IRONHACK Challenge 2: Wireframing
What is Wireframing?
Wireframes give a simple visual representation of how the flow of the app or website you are creating will be. The key word here is simple; which is why wireframes should be done in black and white and with just enough detail for them to be understood by someone else, without distracting from the goal (creating the skeleton of your interface).
My second challenge in Ironhack requires to “reverse engineer” one popular app Interaction Design and User Flow.
Why Netflix?
Firstly, I choose Netflix app to work with. I choose it because of this corona days, people enjoy spending time with Netflix. So it inspired me to do this app as a wireframe pre-work . Netflix is the world’s leading internet entertainment service with 158 million paid memberships in over 190 countries enjoying TV series, documentaries and feature films across a wide variety of genres and languages. Members can watch as much as they want, anytime, anywhere, on any internet-connected device. Members can play, pause and resume watching, all without commercials or commitments. It makes this app very functional and easy to use because of the simple and clear design.
I worked with Sketch app to wireframe screens. I created 6 screens. As you can see below, there is the original screen on the left side and my wireframes are on the right side.
I used Ironhack wireframe kit to complete this challenge without taking a lot of time drawing. I tried to make simple design. I used basic shapes, some icons for search/edit/play buttons and labels for navigation bar. I did not use any photo, colour, complex icons. Because wireframe is simple visual representation of your app.
User Flow
I used InVision Studio to make a Lo-fi User Flow
Task Analysis
- Users are trying to find a movie or TV series
- Users are trying to get more information about what they want to watch
- Users sign up to receive an e-mail notice when a new movie/TV series has come
User Flow Steps
Login → app
Choose → Profile
List Detail and Choose→ TV Shows/ Movies/ My List
Search Engine→ TV Shows or Movies
Downloads → TV Shows or Movies
Coming Soon →Notifications
Prototype Link
I really enjoy creating new screens and designing colourful pages. But by this challenge, you see that focusing on the flow is sometimes more important than waste your time by designing deeply. By wireframing you have chance to show the main point to your team in a quick way.
Thanks a lot for your interest.
