Information Architecture

The MXD App Iterations

Summary

A lot of this process cycled between UX research and UI investigations. Because the timeline for this particular part of the process was so crunched, I did begin designing a little too early in the process. 

Below is the evolution of the information hierarchy and iterations.


 

MXD App: Round 1

In this first round of designs, I tried to include all information that I assumed (key word) was relevant to anyone who wanted to work out. 

 

My mistakes / Learnings:

  • Ignorance of UX/UI standards
  • Lack of informed hierarchy
  • Jumped to designing too quickly

Round 1 Architecture + Designs:

 
 

MXD App: Round 2

In the next generation of designs, I tried to maintain the same amount of information but reign in the use of color and symbolic infographics. 

 

My Mistakes / Learnings:

  • Still had too much color, all symbolism is lost because it's too much to keep track of
  • I had lost any UX focus on how to guide a user through this information
  • Too much emphasis on too much information
  • Inconsistent UI cues + CTA's

Round 2 Architecture + Designs:

 
 

MXD App: Round 3

The third round took a large leap in terms of UX. A feature of the previous iterations was to rate how each workout made you feel. I took this idea of emotion, and put it to the front of the experience.

 

My Mistakes / Learnings:

  • By creating more specific actions, I did help guide the user a bit more.
  • The toned-down color palette helped clarify the communication being shown, but it was still too much information.
  • The home dashboard made for an awkward user experience entry into the workout.

Round 3 Architecture + Designs:

 
 

MXD App: Round 4

While the search via mood filter was highly interesting, it was more of a feature rather than a needed step in the process. 

I went back to having pre-decided workout options, but only 1 per exercise level. It was important to me to not require a username in order to access any playlist as the first flow. 

 

My Mistakes / Learnings:

  • The information needed to be more hidden, available but deeper in the experience
  • The colors were finally working!
  • I needed to focus on my first goal, getting Shaker's to work out ASAP

Round 4 Architecture + Designs:

 

MXD App: The Final Round

By embracing a cheeky vibe, and emphasizing the graphic visual direction I had developed, some mentors helped me realize that I could make this whole app much simpler. 

This change in the information architecture and overall user experience was the missing puzzle piece to this app. 

Round 5 Architecture + Designs: