After a summer of freelance magazine work, I joined the DockYard design team. This has required my design practice to evolve. My education and experience in editorial and publication design made me comfortable with visual systems and hierarchy—a skill fundamental to any design project. Yet, shifting my focus to UI involves working through a new set of problems.
Even though I use web applications daily, it doesn’t mean I understand every crucial detail that makes a successful interface. I know when a design doesn’t work, but the thing about good UI is that it can slip right by you. If you asked me what the loading state for tumblr was, I would have to go and check even though I see it everyday.
A common idea in UI design is to fail fast and iterate often. Understanding means nothing without experience. With this in mind, I chose to design the UI for a speculative project that would challenge me to confront the differences between print and web application design.
Designing for the user, not for yourself almost seems like a new concept born out of interaction design, but editorial is no stranger to this ideology. Just like with any web application, a magazine’s user needs to be able to absorb the important information quickly and navigate seamlessly. Good print design is consistent with grid, type, and color choices. This consistency provides a level of comfort for the user.
Unlike a magazine, an application should provide constant feedback to communicate with its user. Every action needs an appropriate reaction to simplify and support the user’s journey. Interface responses manifest themselves in different component states. “Why is this taking so long?” is met with a skeleton UI that makes the application appear faster than it is. Answering a user’s instinctive questions lets the brain focus on the task at hand.
For this project, I focused on a concept for a produce delivery service from an article by Steven Trevathan. Working on this app gave me a chance to explore different states and forms of feedback for many application components. For a range of different states, I planned to design the components shown below.
To guide this project, I referenced The Nine States of Design article by Vince Speelman. Given that these states are a necessity for any web application, the exciting part is experimenting with the form and language of them. My next post will show my own process designing states that align with a specific brand personality. Well crafted states can give the user an experience to enjoy and not just tolerate, even when they deviate from the intended path.
