Storage Mate UX Design Mobile App Design and Branding First I started by designing the logo for StorageMate and the CEO was so happy with the result that he requested a full mobile app design from concept to high fidelity prototype. He had initially mocked up a wireframe in Microsoft Word and delivered it to me as a PDF. This was an excellent starting point for his vision. I however could not make any assumptions about these wireframes in terms of usability and ended up discovering some elements that would evolve as I worked through the process of building the click through prototypes. Paper Prototyping
I started my wireframing on paper, one of my preferred methods of working through the user experience. For me, the act of writing every detail in a draft down on paper minimizes distractions of typography and layout. Paper also ensures you critically think about all of the pieces. It helps me come up with some of the potential UX concerns early in the process. An example of a concern that came up pretty early was the footer navigation item of the camera. The camera icon was to give the user a quick access to take a photo of a box or location of a box. Each of these boxes were items that they could organize within the app. However when building out the pages on paper, I discovered that the photo icon navigation item was in fact redundant and that functionality would only be relavent to the user within item creation or editing. I brought up this concern early in the process but the CEO was still interested in keeping it. I then brought it up in the black and white wireframes as well, but it was not removed until the final high fidelity prototypes with all the branding finalized were completed. This is not uncommon. As a visual person I can imagine the final workings of the app from a sketch on notebook paper but so many others need to see it to really comprehend the impact. Through years of experience I am used to this behavior for people and so I build in a very flexible way so that even if concerns need to be addressed in the final stages it is not an issue.
Also for this specific issue the redundancy would not have been bad for the user, it just would have been redundant. Much like a header and footer navigation redundancy isn't always a bad thing because people use tools differently. This is why I chose to test each element and see how people are using it. If it tests and proves useful then I would test what impact removing the element would have on the current user base, and so on. The Story

I was working 100% independently on this freelance project in direct contact with the CEO of Smead who had found me through my online portfolio and had originally simply requested a logo design. He was so satisfied with the logo design he requested a full mobile app design from wireframe to high fidelity prototype to be shipped to his development team.

The Lowdown Exactly what I did on this project
  • UX and UI Design
  • Mobile App
  • Software flow design
  • Re-envisioning functionality and working through usability
  • Wireframing and prototyping
Highlights

I chose Helvetica Neue thin to keep a clean and modern look.

Typography

These are some pretty vibrant colors but essentially I wanted to imply some user interface elements with the colors. Green implies new. Yellow is - note this is something you should see but isn't too big of a deal. Red is a, warning you need to deal with this.

Palette

Copyright all rights reserved BrookWebDesigns.com

<< Back to Portfolio

Storage Mate Portfolio AaBbCc123
Be -