UI Exploration: Do the Technicolor Twist, Part 1

Working with brand guidelines can put a designer in a real funk when it comes to colors. We stick to what has been approved albeit our personal preferences. I personally have designed so many blue things I thought that I had seen the gamut of shades of blue but, nay! More were to be found. In the past year and a few months, I focussed solely on the color green with 17hats. (Green for positivity! money! success! more money!) Needless to say, I am now ready to work on projects that have NO GREEN!

Recently, a friend approached me with a UI project for his current endeavor: DropTrack. This product is a music marketing platform for musicians, djs, etc. to get their music into the hands of record labels, other artists, bloggers, and more. As someone who is a musician and music takes up 1/3 of life, I knew that this would be a fun opportunity. The original screens that were presented to me were laid out with an engineer's precision for functionality and ready to take on some designer TLC. I asked the owner, "How do you feel about adding in more color?" The response was, "Let's see it."

This post is presented as a Part 1 for a main reason: I am focussing on a few details at a time. The hope with this series is to display these UI elements to really showcase some of the detail work before featuring on the full screen UI.

My relationship with color in this product has been executed in phases. First was the whole page - how do I present an artists tracks elegantly? How can this product be an even better showcase for these artists? From there, color was used with all CTAs, messaging, alerts, tags. If it wasn't body text, it probably was assigned a nifty RGB value. It made the page come alive but in a functional way. Here are a few samples created thus far:

Dropdown with custom icons for download options.

Message modals. Success alert uses a non-traditional blue/green gradient that is upbeat but not overpowering. Error alert uses a burnt orange gradient versus a bright red to reduce reactionary stress for the user.

Payment modal. Uniting the CTA header text with CTA button with a fabulous purple.

This project is exciting in the fact that there is a great deal of creative freedom while respecting the product itself. The use of color can still allow for a sleek and modern look if done tastefully and correctly. There's always a reason behind a color selection which is why it is effective.

Stay tuned for Part 2 to see how the UI on this product develops.

Happy Details :: Waze on iOS

Alright Waze, you just put a smile on my face. This simple question makes my life that much easier when leaving home, a very nice UX choice. Especially since there's a LOT of red on the map the whole journey. Thank you for knowing my schedule so well and for combating LA rush hour traffic.

Organizing Information :: How Do You Divide?

Ever since elementary school, I've had various pens and highlighters, notebooks of various sizes, and post-it notes to create the ultimate method of organization. Never caring for store-bought planners, each of mine were designed in a fashion which worked for me - how I mentally divvy up information to have the maximum retention. It's grown from composition books and Bic black and blue pens to Moleskine's with Micron pens and Copic markers (these are a few of my favoriiiteee thiiinggss).

Task, project, and overall life planning continues to be an exercise in handwriting for me where a hybrid of traditional versus new (i.e. phone calendars and online project management tools) takes place only in the workplace. Basecamp, Unfuddle, and Confluence have all made a presence but nothing quite compares like the grace and ambiguity of ink dashing across the 68 lb. ivory slate of glory that is my notebook.

Until I met Asana. Finally, a tech savvy match to my method has been found. The web interface is easy enough to work through albeit some of the UI could be enhanced for a sleeker feel which personally provides me with more clarity with information hierarchy. The methods of organization with sections and sub-sections to categorize tasks is one of my favorite features. Thus far, I've created projects for my design work, business docs, and specific meetings (weekly check-in is my favorite). The ease of inputting ideas, to-do items, and methods of labeling objects have greatly affected my work flow in a positive manner. The iOS app is very well done with a simple UI that allows you to focus on the tasks at hand. Not to mention the color palette is quite rich which is a nice variant compared to many apps out there right now which focus on a stark white or near black theme.

What I enjoy most about Asana is the information sharing and interaction features for other team members. Thus far, my only team member is my fiancé, who is the other half of our company. We are easily able to share ideas in the conversations tab which allows for not just text but also image uploads. Emails are sent when these are started to help notify you and keep the conversation in real-time. Most importantly, this keeps my thoughts and ideas in an accessible place providing for the utmost transparency regarding vision and product development, something my lovely Moleskine can't provide unless I physically open and show it to another person.

Thank you Asana for finally providing a tool that allows for tailored organization, increased productivity, and overall, a way to track the progress and excitement of an idea coming to fruition.

The notebooks and Asana lived happily ever after...