Designing a product website for iTaps, a HR Management Software
Project Type
A client project that I did in General Assembly
Timeline
3 weeks total
.png)
Role
Team Project;
UX Researcher
Assisted with UI
Tools Used
Figma
Axure
Who is it for
Company heads and HR staff
What does it do
The Product Website for iTaps provides all the information that the user needs in order to purchase the HR Management software.
The Process
Understanding the background:
To kickoff the project, we had a project meeting with our client who shared about the problem the business faced, their business needs and the targeted audience of the app. HR processes used to be a very manual process of excel sheets, lengthy scouring of the market for talent and very complicated processes of leave approvals. With technology becoming more advanced, bigger companies moved to HR management softwares to help streamline their process. This left smaller companies like SMEs and Startups in the dust, that couldn’t afford to invest in these softwares.
Enter iTaps. This is a HR Management system, perfected for SMEs and Startups. They streamline the HR process and not for exorbitant costs of other HR Management systems out there in the market.
Conducting research:
Understanding more about the company left my teammate and I raring to go. To start off the research process, we looked at other websites for HR Management softwares made in Singapore that were out there in the market through a competitive analysis. Getting a feel of the market helped us to know the business’ competition better. Along with that, we conducted a comparative analysis on other B2B companies’ product websites. We could see the common features of their websites and had a better idea of what our website should have.
We also conducted interviews with 6 people that were either HR staff and business owners. Here, we managed to find what they wanted in websites that sold software and we got to learn a bit more about how HR Management softwares (Or the lack thereof) affected their work life.
Some of our research goals:
- What do users look for when they visit a product website?
- What makes a user want to buy/try a product based on the information that they get from the product website?
What we did with the responses
From the interviews, we synthesized what we learnt from our participants through Affinity Mapping via Miro. From this, we found out 3 main wants from our users:
- “I want to see the features of the product”
- “I want to see the reviews of the product”
- “I want to try the product"
He’s the result of all the people that we had interviewed and gathered insights from. We would be using him to keep our sights and goals aligned throughout this project of designing the website.
To design a better product for Desmond, we came up with a Problem Statement and Hypothesis:
Problem Statement
“Desmond needs more details on the functions of the software so that he can make an easier decision.”
Hypothesis
“We believe that by giving Desmond more details on the functions of the HR Management system via the website, he will be able to make his decision easily.”
First iteration:
With more understanding on the goal, my teammate and I set out to do a quick sitemap of the prototype.
We also created a task flow to allow for a streamlined process for our users to go through and we tested these in our usability test:
We built it in Figma, and it was an easy choice because of the ability to build fast and prototype quickly.
For the first test, we did the tasks in the task flow and conducted it with 3 participants. After each task, we asked our participants to give us a Single Ease Question (SEQ) score, with 1 being the hardest and 7 being the easiest. With the feedback we were given, we started making improvements on the website.
Second iteration:
Our first order of business was to change the initial site map that we had based on the feedback of our participants
Since we had changed our site map, we had a refined task flow as well.
While I was covering the first usability testing with the participants, my teammate was also putting together the style guide for the high fidelity prototype.
This time, we started transferring our designs on Figma to Axure. We liked the amount of prototyping and interaction abilities that Axure had.
We conducted our second usability tests with new participants this time, courtesy to our clients. Once again, we had 3 participants and we followed the same tasks that were done previously. Once again, we asked our participants to give a SEQ score.
Final iteration
The final iteration was still done on Axure. We improved on what our participants found to be friction in our second iteration of the prototype. Feel free to try it out by clicking here to open the prototype in a new tab
Solution
Reasons why users should use iTaps
By listing what iTaps had to offer, users were more inclined to use iTaps.
The Preferred HR Management Solution
By listing the excellent customer reviews of iTaps, users were more inclined to use iTaps.
The ability to try before committing
The presence of free trials were very important to users and served as lead captures for iTaps.
Watching the product in action
We wow our users even more by creating videos to showcase iTaps in action
Reflections
Communication is key. It was a great experience working with our clients because we communicated our progress on the project and received their feedback. We were able to finish this project in good time because of how communicative we were with our clients during this whole process.
