Overview

Zoodcount is a Canada-based internet bookkeeping website. Based on its previous design, the decision was made to redesign it for greater efficiency. Therefore, I redesigned the website according to user needs to make it easier for them to find information. As a UX designer, my mission was to solve problems and create a user-friendly platform.

Role

Product Designer

User Research, Interaction, Visual design, Prototyping & Testing

Duration

Tool

4 Weeks

(January 2024)

Figma

Business Goals:

• Design based on business requirements and facilitating customer communication.

• Create a method through which users can easily send their documents.

• Improving pricing presentation by grouping categories and ensuring consistency.

• Change in the user interface.

Design Goals:

• Identify and resolve any usability issues.

• Combine the context, content, and users into the design.

• Redesigning a user-friendly website through research.

• Designing a simplified user interface.

Design Process

Usability Test and Interview

Persona

Conducting heuristic evaluations with users enables us to gather valuable insights and pinpoint weak areas. Following this, I conducted interviews to gather the necessary features that users wanted to find on the website.

Challenges:

Solutions:

Competitive analysis

Sketch and Wireframe

Moodboard and UI Kit

Solutions and Iterations

Site map

Discover

The design process was based on the Double Diamond method, which includes discover, define, design, test and deliver.

1. Finding a sufficient number of users from companies for heuristic evaluation.

2. Displaying prices for both individuals and companies based on their service needs.

1. Conducting more competitive analysis and usability test.

2. Design based on users needs, collaborating with the stakeholder and iterating on the design for better results.

While analyzing competitive websites, we discovered that Zoodcount lacked some features. During this analysis, we identified both threats and opportunities.

Threat:

• The decrease in customers is attributed to the lack of connectivity on the website.

• The absence of location-based features on the website is also causing a decrease in trust among customers.

Opportunities:

• Offering free consulting encourages customers to engage and connect.

1. Users didn't notice the website's purpose because there wasn't any hero text or introductory element to introduce it. They only discovered it by looking at the navigation bar.

2. The two lines with different categories in the navigation bar are causing users to spend more time finding information.

3.The "Email" button was a small link to connect with the business, and they missed it.

4.There were large explanations present without any accompanying title.

5.Values weren't displayed on the homepage, leading users to navigate to other pages to find them.

6.In financial services, users need to connect with advisers, but there were no immediate contact details show

7.The prices were presented in a list format and were not divided correctly. There was a lengthy list of prices for each category.

8.On each service explanation page, users searched for links to connect with the business and view prices.

Define

User Journey

Home Page

Conclusion

Home page

Explanation Page

Our target users were small businesses and individuals who need financial services. So, I created this persona based on research and data about the goals and pain points of real users.

This sitemap was crucial for planning and designing the website, ensuring a clear, organized structure and easy access to content.

Develop

First, I began by sketching to identify each part. Then, I merged them into mid-fidelity sketches. Through usability testing, wireframes underwent multiple iterations before reaching the final result.

Color was identified by the company owner, and they decided to change it to dark green. Then We created a UI kit containing color codes, font sizes, icons, components, and design variants to streamline the design process.

Deliver

To enhance our design, we conducted multiple rounds of usability testing and iteration. Here are some examples of our design solutions that we developed to solve problems we found during research.

• First of all, due to the variety of categories not relevant to accounting, I decided to add a "More" section to the navigation bar. Within this section, I included sustainability and academy.

• Through usability testing, I noticed that differences between categories confused users. By sharing the research results with stakeholders, they decided to remove irrelevant categories of financial services.

1. On home page, in navigation bar we removed all irrelevant categories unrelated to finance. Additionally and added a business phone number for easy user connectivity.

2. Add a clear sentence to the hero section to highlight the website's services, and include a CTA for easy access to get consulting.

3. Highlighting the startup's values to demonstrate the benefits to users.

4. In the 'Submit Files' section, after several usability testing, we found that guiding users to their profiles to submit files allows them to conveniently access all their previous files and notifications.

5. Company owners, acting as users, were eager to learn more about the explanation of business services.

6. Designed a footer tailored to users' needs, including connections to businesses.

• Initially, on the pricing page, we designed services in packages for individuals and corporations. However, after usability testing, we found that users spent more time searching for their specific needs.

• By adding segmented buttons at the top of the pricing page, each section is categorized according to its topics.

• On explanation page, by incorporating CTAs, users can easily connect with the business. Additionally, since the business cannot offer prices for each section individually, including a price link will allow them to navigate to the price page

Price Page

News Page

Dashboard

At the end, here is the complete high-fidelity design of all pages after iterations.