UI Design For Disney's The Mandalorian
Project Goal - What Was The Challenge?
This UI concept originated from a design challenge I undertook. I regular undertake design challenges to improve my design skills.
The goal for this challenge was to create a single page design for Disney. As this was a little bit vague, I chose to hone in on promoting my favorite TV show right now, The Mandalorian, which is available on Disney+.
Creative Strategy - What I Did & How I Did It
Before even starting the challenge, I chose to implement some constraints to see how this would impact my design decisions. I decided to focus on time constraints in this case and limited the entire project to 1 hour.
With this in mind, I limited the creation process to research, set up of color palette and typography, finding appropriate imagery and finally creation of the mock up itself which I created in Figma.
I chose not to do a full wireframe but sketched out a very rough outline of what components would make sense to include.
Project Outcomes - What Was The Result?
The outcome of this design challenge was a single page UI design mockup.
I found the time constraint in particular to be an interesting way to work. Being conscious of the time remaining forced me to stay on track with what I was designing and once I was done with one section I would immediately move on without being conscious of the minute details.
The time limit also ensured that I created the components that were essential to the design and without cluttering up the UI with other non-essential graphics etc.
The color palette I chose, various shades of greens, worked particularly well in my opinion. There were enough colors to choose from to ensure enough contrast in the design without being too distracting.
The structure of the page adheres to a 12 column grid structure emulated from the Bootstrap design system. This combined with the use of white space and balance allowed me to create an aesthetically pleasing design.
Overall I am very happy with how this challenge turned out. I was able to learn a lot about the practice of utilizing the elements and principles of design to create a UI (for example: contrast, balance, repetition, white space, type).
If I had more time I would certainly like to create a mobile view of this design to understand how that process would work. Additionally, I would probably go back and add some additional content such as more detail on the cast and a section for twitter comments or recommendations.
What Do You Think?
Let me know what you thought of this design challenge. Do you have any feedback on things that could be improve?
Head on over to my website if you would like to see more of my work:
