Like anybody who makes interfaces for apps/websites, I spent a lot of time looking at Design Inspiration (read: UIs, real or imaginary, made by other people). This is a really good way to look at visual conventions that other people made, and have used in their UIs and UX.
If I were to examine the time I spent "designing" more closely, and divided it between actually pushing pixels around in Figma, and looking at other people's work on Dribbble I would be shocked and ashamed.
Allow me to justify this though: unless you are one of two-three social media giants, literally nobody spends the majority of screen time in your app. It would be incredibly arrogant to assume your app is good enough that people are willing to learn a whole new style of interaction, navigation, and visual metaphors for it. In this teeny blog post, I just want to list some of the places I go when I want to find good UI to look at
A quick caveat though. These sites are good in the same way that a buffet is good. But they're also bad in the way that a buffet is bad. If you're not consciously selective in how you expand your UIs, it can feel like a collection of disparate widgets. Would you trust a website that could go from crunchy spring role to full-bodied bolognese, just because a designer fancied it? As a designer it is your responsibility to understand the types of data, interactions, and journeys that your app is trying to promote or facilitate. Sometimes "because it looks cool" is enough of a reason - but this might not fly so well on a village GP surgery.
Anyway, this post isn't about that, it's about some sweet sweet list of cool sites for design inspiration. Well have I got a twist for you, I actually made two lists (Inception Horn).
Here are some sites that put words to visual design patterns:
- UI Guideline : Web-focused, component-level naming.
- ui-patterns : Mobile-focused, pattern and component-level naming.
- lookup.design : Another great free library of examples of components used in the wild. Clean UI and tags, with a nice variety.
Here are almost endless numbers of mockups from people far more talented than I:
- UI Sources (💸 paid) : A well-curated collection of app design patterns.
- mobbin.design : Another nicely curated list of mobile app designs
- UI Movement : Primarily mobile and animated interactions.
- Muzli search : Find designs by searching words or colours, a cool little tool run by Adobe.
- Dribbble : I'm putting these guys on the list, but they don't need the recommendation.
And for Colour Palettes:
- Muzli Colors : A really nice little tool that shows you a selection of colours in some standard UI mockups (pie charts, chats, cards, etc.)
- Coolors : A classic tool I use very frequently to help me find complementary colours.