Once again, I used the "Crazy 8" technique to come up with quick ideas of screens and many different versions of one screen. After picking out the best version of each screen, I then assembled each screen in order to create the wireframes.
The wireframing process was pretty straight forward as I mirrored the sketches done on paper and digitized each screens, I then created the low fidelity prototype with figma.
Click here to see the low fidelity Prototype
For this project, the task was to firstly create a dedicated mobile app, meaning an app you would download from the app store or the play store and directly launch from your phone without accessing the internet. The mobile app can be viewed via the link below:
Click here to view the dedicated mobile app
The responsive Mobile app is nearly a one-to-one replica of the dedicated mobile app, only with a few changes. Firstly, mobile websites do not have the bottom navigation bar, instead we have the "hamburger" menu located on the top right corner.
There are some other minimal changes like logo placement and overall difference in functionality like how you navigate the website in comparison to the app.
Click here to view the responsive mobile app prototype
Building the responsive website version of the desktop required some more sketching to understand how each element would grow and fit the space. In the world of web design, you will often hear the phrase "Start with mobile". This is also known as the "Mobile First Philosophy". The reason for building mobile first is because scaling up is often times simpler than scaling down.
Click here to view the responsive desktop prototype
If you like what you see and want to work together, get in touch!
jamesfrommtl@gmail.com