Wandering to Inspiration, pt. VI
Part six in a series about the journey to build something, starting from the moment inspiration struck
What do you do with abstract knowledge? Does it sit on a shelf, gaining layers of dust as it awaits an urgent call to action? I mean… maybe? But the best thing to do, obviously, is use it. And that’s what I intend to do, applying some of what I learned from my course with DesignLab to my mood tracking app idea. Last week, I started to explore what that feels like by opening my original designs for the first time since taking the course, and applying some quick fixes. This week, I go waaaay back to one of my first lessons and start from a more basic step: making a design tile.
‘What is a design tile?’ you are definitely asking yourself, because there is no reason for you to know what a design tile is. In short: it is the most basic form of a visual identity for a project, defining fonts, colors, and how they all relate. Including images that inspired the selections is also part of the process. Below you will see an example of the design tile for my Design 101 project next to one of the pages that was part of the final project. Note the similarities and differences. It’s okay to change components as the project evolves, just keep them consistent!
It’s important to note that there are many variations within the ‘___ tile’ ecosystem in design. Even in my own course, we later made a style tile that included a logo and iconography (spoiler: you may see that here soon!). To keep things simple and provide me with enough room to freak out about the color palette, I’ve opted for the simpler step first. I’m still so new to design and even though I know I can make changes later, it’s still a big deal for me to commit to a specific group of colors.
My process for arriving at the basic design tile below was simple: think about how I want the app experience to feel, take the adjectives that spit out of my brain, and see where they lead me. It was a long and meandering process, but in a series of blog posts about wandering to inspiration, it’s pretty on-brand. Mix in a focus on keeping the app light and clean, like the romanticized version of Dark Sky that I have in my head, and I feel confident in the end-product.
What I knew more than anything was that I want the delightful white-space relationship but with more color than what Dark Sky employs. I think it works for them, but this app will be about tracking moods, and moods are varied, numerous, and unique. Blue, black, and white is not gonna cut it.
One thing I really like about my original design is the logo. It may not remain as-is forever, but there is something about the mix of color against black and white that really jumps out at you. The color combination actually reminds me of Fruit Stripe gum, which I used to love as a kid. That playfulness, warmth, and fun had to be a part of my color palette in some way.
I then let myself get lost on a hunch that vintage travel posters may provide some wisdom in finding a color palette to match my concept. Really, I only mention it because vintage travel posters are awesome. The best examples are thoughtfully-designed and demonstrate a cohesive visual experience — where better to be inspired? Unfortunately, the ones I found led me down a ‘could this be a gift?’ or ‘future wall adornment’ path, as opposed to any real concrete design ideas.
Eventually, I wandered my way to Rifle Paper Company — who makes about 80% of the paper goods in my home (of which there are a a lot, because my partner is a big fan). Their designs are elegant yet simple, modern but classic, unique but familiar. More relevant to this exercise: typically their colors are very harmonious. After finding a calendar that I liked (and a future gift for my partner), I pulled some colors out and stared at them for a while. ‘Are they fun?’ ‘Do they work together?’ ‘Will they be able to adequately communicate urgency, error, or success?’
This is where I landed. I kept Antic Slab as the main font from my original design for the app and used the recommendation by Google Fonts to go with PT Sans as the accompanying font. They’re both eminently readable but interesting to look at, Antic Slab in particular. These colors and the shades selected in particular feel bright and fun, lean heavy on warm vs. cold, and complement each other well. Plus, I feel good about the accessibility with the contrast between the blue and very light pink background. Note that the orange and yellow colors chosen do not pass the WCAG guidelines for contrast accessibility, so I will have to use the blue exclusively or add stroke around anything using the lighter colors against the light pink background if I want to adhere to those guidelines (which I do).
I’m still not 100% on these colors. I’m also not 100% on the color assignments! But I am pretty happy to make some forward progress in this seemingly insurmountable task. Chipping away little by little feels awesome. Even better: the more I do, the more comfortable I become, and the more confident I am in my ability to actually make something special. How cool is that?!
