Enhancing the user and visual experience of the existing website of Wisedrive

  • UI UX Design
  • React Js
wisedrive/wisedrive_banner.webp

Project overview

wisedrive/wisedrive_project.webp

Our Solution

Structuring the information

We worked with the client to comprehend the challenges, objectives, and commercial strategy of the platform. The basic information architecture of the website was redesigned using the data acquired from the initial study and the competitor analysis.

wisedrive/wisedrive_flow.webp

Wireframes

Several iterations were created and ideas were thrown around in achieving the user experience part for the exercise module. From dashboard to the admin tables, pixel perfect wireframes were created.

wisedrive/wisedrive_wireframe1.webp
wisedrive/wisedrive_wireframe2.webp
wisedrive/wisedrive_wireframe3.webp
wisedrive/wisedrive_wireframe4.webp
wisedrive/wisedrive_wireframe5.webp
wisedrive/wisedrive_wireframe6.webp
wisedrive/wisedrive_wireframe7.webp
wisedrive/wisedrive_wireframe8.webp

Color Case

We experimented with colour while adhering to the brand's history by sticking with the blue hues that make up their identity and trying some eye-catching gradients.

wisedrive/wisedrive_color.webp

Type Case

Work Sans is a typeface family based loosely on early Grotesques. The Regular weight and others in the middle of the family are optimised for on-screen text usage at medium-sizes (14px-48px). The fonts closer to the extreme weights are designed more for display use both on the web and in print

wisedrive/wisedrive_work.webp

Turning wireframes into design

Dashboard was one of the two priorities along with the user experience part in the onboarding module in achieving the solution. The platform was designed with 8 point grid system.

Intutive UI

wisedrive/wisedrive_intutive.webp

Responsive UI

Responsive versions were designed for the platform. 8 point grid system was followed in the UI. while maintaining the grid system we were able to achieve a pixel-perfect responsive user interface across the website.

wisedrive/wisedrive_ui.webp

Similar Portfolios

projects/ondway.webp

On D Way

An employee engagement platform - users were going to the site with the declared aim to play a game in every case.

View case study
projects/algobulls.webp

Algobulls

We simplified the algo trading web application to create content flow and structure that’s easy to discover and scalable. Our atomic design approach created a systematic design system.

View case study

Come Experience - The Sketch Brahma Difference

our-service/sbPath.png
icons/arrowTop.svg