OnePlus 6

A RESPONSIVE WEBSITE

ABOUT THE PROJECT

In this assignment, we were tasked with designing a responsive site for both desktop and mobile as part of a course at Netcraft Academy. The assignment required us to incorporate the entire UX process while considering the product's 'feel' and integrating it into the website design.

In my opinion, the existing website was good but not great. I believed that by infusing more artistry and creativity into its appearance, using the captivating wallpapers featured on their mobile phones (which, for some reason, were absent from their website), we could distinguish our design from those of other mobile competitors.

WIREFRAMES

After learning about the phone's specs and features, I proceeded to create wireframes for both desktop and mobile. I also had the opportunity to design the missing icons, resulting in a more organic and cohesive design, as opposed to relying on a third-party icon set.

Throughout this wireframing stage, I was acutely mindful of ensuring responsiveness. It was paramount for the landing page to perform optimally on both desktop and mobile devices. This consideration led to the creation of wireframes that not only maintained a user-friendly layout but also seamlessly adapted to different screen sizes. The responsive design approach was integral to delivering a consistent and engaging user experience across various platforms

THE DESIGN STAGES

During the design stages of the landing page, I drew considerable inspiration from the colors and abstract backgrounds featured in their wallpapers. This served as an exceptional starting point, providing me with a cohesive and visually striking theme that I could carry throughout the entire design. This recurring motif not only infused the design with a unique aesthetic but also played a pivotal role in enhancing their brand consistency. It became a unifying element that threaded seamlessly through the entire user experience, reinforcing their brand identity and message.