Wandering to Inspiration, pt. V
Part five in a series about the journey to build something, starting from the moment inspiration struck
It’s been five months since I completed my Design 101 course at Designlab in April, 2020. It’s been six months since I even looked at my mood tracking app design. I’m a bit rusty, a bit lost, and bit unsure about how to proceed. These blog posts have helped revive a back-burnered interest in building anything. Over the course of the previous four posts, I’ve described how I went from the moment inspiration struck me while wandering around The Metropolitan Museum of Art in New York City, to recognizing my interest in UX design with a career coach, to finally taking a step toward learning design basics. But where do I go from here?
Well, now that I have brought you up to speed, it is now time to document the journey in real-time. Pre-recorded show to live. Flashback to in-the-moment. What does that mean, exactly? Well, it’s time to apply some of what I learned in Design 101 to the designs I made prior to taking the course!
It is important to note that I did not look at our touch these screens before posting. As you can see, I only built the basics so far. There are more screens to walk users through the habits and activities flow, and versions where I play with dark mode, but this is mostly it. From the landing screen, the user proceeds through the decision flow where they set preferences and begin building how the app will work for them.
The most glaring issue to me is the use — or more appropriately, misuse — of space. When I laid the text and visuals out, I had no concept of 8pt grid systems or 12-column grids, for example. But beyond that, things feel… off, don’t they? Larger than they need to be. Looking at the first screen specifically, the area around the logo is inconsistently spaced. The padding on the sides is larger than the top and bottom (and they’re not even equal on the sides), and it just dominates the space. General padding on the page — that is, the space between content and the border of the screen — is also unequal, making it unclear to the eye where to go. Shrinking a few items, making padding and spacing more consistent, and maintaining a coherent approach to drawing the eye down cleans it up a bit. It is by no means complete, but it already feels less cramped and respects white space more.
What I do like about my design thus far is how simple it is. I know, I know, there are rainbow lines behind text and it is a bit loud, but other than that, it is fairly sparse. My goal is to emulate apps like Dark Sky, which utilizes a clean, simple color palette which makes using the app feel light and easy. I want my app to feel light and easy while using it! It’s an app that is meant for mood tracking, after all. I believe that a clean visual style can foster an app experience that is more welcoming to users, encouraging them to enjoy their time in-app.
This design was not final in April 2020, and it certainly isn’t after putting thoughts down for a blog post in October. But it is evolving, which is important. Even more important is that I am applying some of what I learned in Design 101 to this project. It shows that I can take an old idea, critique it based on new evidence or knowledge, and improve upon it. That’s so awesome to me! What remains to be seen is if I can apply some of what I’ve learned to continue building my mood tracking app beyond where it is today.
