VHELPP
Overview
As UI/UX Designer for the startup, I designed their website for their launch of the startup.
Role
UX/UI Designer
​
Visual Design, UX research, UI design, Website design
​
Sep 2021 - Nov 2021
ABOUT
Vhelpp aims to provide a virtual platform to the home-grown local businesses and professionals by providing a seamless and transparent experience of the entire discovery, booking, delivering and payment process of the service consumption.We set out to design the complete website for the platform to ensure that it encompasses the usability and aesthetic appeal of all corners of the website.
I led the project on all the aspects of the design work including its UX, visual and interaction design. I also designed the key pages for the website that will be implemented by the developers to bring the platform live.​
THE CHALLENGE
The challenge was to design a website that is easily navigable and that helps both the vendors and the clients to use each other’s services on the platform reflecting the transparent process of the company’s business model. The website should not only help in attracting potential vendors and clients to use the platform but also help in encouraging the business of local professionals.
DESIGN PROCESS
While working in the project I had a collaborative team of stakeholders who constantly guided me in understanding the business aspects of it. The initial phase of the project involved understanding of the platform, of its business aspect and the users of the product.
![Design Process [Recovered]-01.png](https://static.wixstatic.com/media/69b035_f603277e797c474890528fd544ee4f19~mv2.png/v1/fill/w_86,h_48,al_c,q_85,usm_0.66_1.00_0.01,blur_2,enc_auto/Design%20Process%20%5BRecovered%5D-01.png)
User Research
Online Survey
"It is the duty of machines and those who design them to understand people."
- Don Norman
It is imperative that we first understand what the actual user’s pain points, trigger points, journey and other such emotions, are that would help in designing the best possible experience for them while they interact with the product. We have conducted two online surveys targeting our two major user groups- service providers and service consumers.
With our targeted users being the service providers/vendors and their clients, we conducted two separate online surveys to get both sides of the perspectives in a clear and concise manner. We tried to understand how, what and the why of their leading to use the platform and also understand their motivations and frustrations while using an online platform akin to ours.
Customers' Response
Service Providers'/Vendor's Response
_Artboard%203.png)
Competitor
Analysis
I chose two potential competitors- Urban Company and Fiverr- and built their marketing profile, SWOT profile and conducted a UX analysis of their products. The goal was to identify what type of problems users encounter with competitor products, as well as understand what the users might expect from the product I am designing.
User Persona
Based on the user research I gathered, I created two user personas that capture the essence of my target users and helped me in defining the users expectations and problems in a constructive way.
User Journey
Map
I have created the user journey maps of both my user personas, in order to illustrate the process of how Advait and Rashi behave, feel and what they think while accomplishing their goals to detect pain points or moments of delight. Here is the journey maps I created of the two personas.
User Flow
I have built the user-flow keeping in mind the needs and the key objectives of my user personas which would ensure that they can successfully complete their key goals while reducing the existing pain-points to give them a fuller and better experience.
Develop
Sitemap
"Design is not just what it looks like and feels like. Design is how it works."
- Steve Jobs
After all the research work was done and their results analyzed and the needs and goals understood, I moved to the developing stage of the design process. I started off with creating the Sitemap for the website detailing and mapping out the primary features and the structure of the website architecture. After sending out the initial sitemap to my client I received few feedbacks and then went on to integrate those in my second and the final version of the sitemap. Here, are the two versions of the sitemap that I created for the website.
Sitemap V.01
.jpg)
Sitemap V.02
Paper Sketches
Low-Fidelity
Wireframes
I focused on the core features of the product and sketched the first wireframes of Vhelpp using pen and paper. Afterwards, I tested the paper prototype with my stakeholders to validate my initial design ideas.
After I got the green signal from my stakeholders for the initial paper sketches I then went to create the low-fidelity wireframes of the all the screens for the websites. I created all the digitized low-fidelity wireframes for the website and got it validated with the stakeholders involved in the project.
Visual Identity
Style Guide
UI DESIGN &
INTERACTION
UI Designs
The UI screens have been designed keeping in mind the needs of the users keeping the visual aesthetics of the brand in conformity. The aim has been to not just attract users but also retain them and increase the conversion rate of the website.
+19 More Screens
UI Interactions
I have set the interaction for the screens designed to be able to do the usability testing for the users and also demonstrate the website in real time for the stakeholders. The same has been sent to the developer team so as to keep the designs along with their interactions intact.
In order to maintain user familiarity with the interface of implementing global navigation, the important categories of the website have been placed at the top bar of the website. The bar over each category whenever a user visits a particular page indicates it to them which page they are visiting currently.
The 'Vendor List' section of the website provides a list of vendors available to the users based on the different category of services they'd be providing. Users would be able to filter their searches on the basis of available options and in case they want to they could also recommend the vendor/s to their social friends using the "Recommend" toggle button.
Social Proof have been used for both vendors and their client users in the form of user and partner testimonials to nudge user to sign up for the service.
The "Order & Payment" details page have been designed in a minimal way to provide the user a hassle-free transaction and a transparent process of their order process.
CONCLUSION
-
The website prototype has been user-tested among the stakeholders to gather their feedback on the designs and received a positive response from all involved;
-
Currently, the website is under development by the software developers of the startup;
-
As with any other designs and product there are still room for improvements for the website further down the road for this project and I'd love to work on the future improvements of the website;
-
After looking at the results of the real users interacting with the website more user pain points may arise and work would be needed to be done on solving those pain-points.