The first steps
Based on User stories, User journey mapping, and Information-architecture, we will first prepare low fidelity wireframes based on UX honeycomb and AIDA using Balsamiq. The low fidelity wireframes are used to get fast feedback from the client before designing high-fidelity mockups, where we wanted to focus in particular on the C.R.A.P model.
The final design was prototyped for the client using HTML and CSS for the semantic structure as well as JS to create micro-interactions on our solution and Bootstrap to speed up the workflow. All coding was done either at Atom or Brackets and with Github as our collaboration tool..
Every brand have a style
In agreement with the client, it was decided to keep their current website and brand colors.
A streight roedaghed
The goal of information architecture is to build a hierarchy of menus, sections, and content that feels natural to users and does not mislead or interfere with their use of the site.
Following the creation of the Information Architecture, the newly updated version was tested using a closed map sorting test by LinkedIn users. The test was conducted using the online tool Optimal Workshop to find out what preferences the target audience had when it came to Vivolead’s website content.
First impression is important
Research and user analysis formed the basis for the initial wireframes. The new Landingpage website has more focused on telling the user about Vivolead and their application.
The company has some material they want users to have access to. The materials can be anything from introduction videos to how-to tutorial and blog posts.
Since the business application requires some personalization, it is necessary to schedule physical meetings. This option under the contact page is made easier to navigate through using the dropdown menu.
Prototype, Test, Design
After testing our Prototype on the target audience, necessary design adjustments were made. User test feedback is an extremely important element to ensure an end product that meets user needs as well as the set goal at the start of the project.
In agreement with the client, it was decided to keep their current website colors.
End of road
©Mustafa Rangeen 2020
made by wordpress