Adapting the Design for Web Deployment
To develop the app to a tablet version the starting and log in page as well as the main landing page had to be enlarged to fit into the tablet screen. The positioning of the top 10 movies/series of this…
UI prototyping for Mobile Application
The first page that the users will see when entering the app would be of the name of the streaming app that they click onto and then it brings the users to the log in page. The reason for the…
User Flow and U.I Wire framing
The user flow diagram is to help with the functions of the app/website, since this design will be a responsive one there needs to be a user flow diagram to visually map out actions that will take place in the…
Design and Research
Competitors research: For the competitor research, the companies that were researched were Netflix, Crunchyroll and Prime Video. There are two examples of good layout for a starting page from Netflix and Crunchyroll and one bad example from Prime Video. The…
Video
Figma links for the website: https://www.figma.com/file/PClc0m1wH2oONNMqax1O2A/Interactive-website?type=design&node-id=0%3A1&mode=design&t=lEwysCQYICzI6i6G-1 Figma links for the app: https://www.figma.com/file/K0w3su4KOWCJymTgXVmqOi/Interactive-app?type=design&node-id=0%3A1&mode=design&t=XVipCeya10q6NvjK-1
Colour planning and typography
When choosing the colour scheme and typography for the future design and layouts I went into FigJam and took the website design layout from the start and tried different colours and fonts three times using all of the research and…
Mid Fidelity Layouts.
When doing the mid fidelity layouts the first step was to make 8 different small sketches to help when going into the design file to know what layouts to try out. When doing the sketches the paper was folded 8…
Mood boards
To help me decide on the colour palette for the future layouts and overall design, I created a colour mood board that has three different hues/shades of blue, green and pink. The reason these three colours were specifically chosen was…
Website Design Development
To start the website design process the first step was to decide where the logo will go, at the end the logo will be positioned on the top left of the page because it catches the users eyes but it’s…
App Design Development
When designing the app development, the first step was to place where the logo will go when the users open the app. At the end the logo was decided to be in the centre of the app to be the…