UX|UI Case study · 7 min read

Increasing trust in genetic health services

Scroll
CircaGene

Meet

The client

CircaGene is a StartUp taking a new approach to consumer-oriented genetic testing by way of privacy. They provide genetic health care services, such as DNA test kits, to gain insights into your health and risks of hereditary diseases, as well as action plans to fight back.

The results are fully encrypted, and only the customer will own the private key that includes user-specific information to decode and display the results.

Understanding

The challenge

Our team was asked to focus on rebranding and design of their eCommerce website to increase brand awareness and trust, enhance their user experience, and clarify their unique selling proposition while emphasizing the conversion opportunity (ordering a DNA test kit).

The problem

A new identity

The content of the site is structured, but there are several pain points: The layout does not distinctly delineate their unique selling proposition and point people to the conversion opportunity. Overall look and feel of the site aren’t as polished as they’d like it to be, and the visuals of the health report need work.

My role

I was involved in the research, synthesis, ideation, prototyping and testing phases, preparing the deliverables handoff for the client, and presenting our weekly progress while keeping the clients engaged with workshops.

The team

Casian Pascu (UX/UI)
Lindsay Ambrose (UI)
Monika Bishwakarma (UI)

Tools used

Adobe Photoshop
Adobe Illustrator
Adobe XD
Optimal Workshop
Lookback
Otter.ai

Deliverables

Design guide
Annotated Wireframes
High-Fidelity Prototype
Logo design
Packaging design
Health report design

The strategy

Implementing
the change

Following the Double Diamond Design Process and focusing on the website, the first two weeks we started with research to discover the pain points of the existing website, defining what additional knowledge we need, and synthesizing the data gathered. Following by usability tests of the current website, competitive analysis, information architecture, and understanding the product.

The following weeks we had two rounds of iterations and testing after developing prototypes from low-mid fidelity (first round) to high fidelity (second round) screens. We explored divergent brand designs, and we implemented the final brand design in the high-fidelity screens for the second round of testing. After the last tweaks and iterations, we successfully delivered the new designs to our client.

Research

Understanding

The services

First, we needed to understand the existing services, and the best way to do that was through our client’s knowledge. This way we found out of how their services work, how we can differentiate them to make it clear for the users, and how does the eCommerce website work along with their patented technology for data encryption.

testing

Users didn’t trust the company

We interviewed ant tested the existing website with eight users (remote and in-person), and we found the following:

competitors analysis

Using market research

At this stage, we focused on exploring competitors to find strengths, opportunities, and patterns. Some aspects that we considered are information architecture, type of content and visual elements included on their website, and tone of voice used.

Define

Defining the problem

The user needs to understand what services CircaGene provides and compare and differentiate them to buy with trust, confidence, and ease as the current platform does not cater to their needs.

Defining

The content

The competitive analysis helped with the type of content that we wanted to include on the website, to align with our goals.

We used card sorting for the creation of site map, hierarchies, categorizations and navigation. It was essential to know what type of content the user wants to see on the website so they can trust the company and buy their services.

We gathered this information from our initial user interviews and kept refining it throughout the following iterations, starting with the most important pages on the website: home, about, and services.

Develop

Ideating

Creating the first prototype

Having all the information needed to include in our design and a clear definition of our problem and understanding of the services offered, was enough to start designing our first low to mid-fidelity wireframes and build a prototype.

User testing

Trust is increasing

We carried out nine user testing (remote and in-person) on our first round of prototype. We provided the user with a series of tasks to complete during the tests and post-test questions to follow up. We had a lot of success in this round, but also many opportunities for improvement on the content and design.

Users were missing the following:
• Brand transparency
• Clearer information about the products
• Testimonials/reviews from actual users

Exploring the right mood

We diverged and explored a series of moods for branding. After testing and gathering votes from users, we presented the mood boards and logos to our clients to gather their feedback before showing them the results from our users.

Choosing the right mood

Our clients had a big decision to make moving forward - choosing a style that represents their values and at the same time, inspires trust and transparency to the users.

Moving forward, we helped them make that decision by designing two style tiles from the most voted and better-received mood boards.

Back to testing

With the final logo and a chosen style, we were ready to iterate once more for the second version of wireframes and prototypes.We implemented the feedback gathered from our users and our clients into the second version, along with more content.

By this time, the COVID-19 outbreak became pandemic, and we started working remotely, but this didn’t stop us from remote testing. We had 15 participants, from which 12 were moderated via Zoom and 3 were unmoderated via Lookback.io.

The new design was well-received, and overall we hand a 15% improvement on user trust in the company from the first round of tests.

Deliver

Conclusion

Client testimonials

François Paillier

CEO of CircaGene

It was a pleasure to work with Casian Pascu. Casian is easygoing and witty.
He has an excellent sense of UX/UI design that matches his communication and organizational skills. Casian is always quick to integrate feedbacks to ensure deliverables follow the client’s vision. Casian’s commitment to quality and perfection is the cornerstone to his success. He delivered in time what i needed and with very high quality, even surpassing my high expectations. I recommend Casian unequivocally; it was a great experience working with him!

Jackeline Palma

Co-Funder of CircaGene

I have worked with Casian for 4 weeks in my UI/UX web designs. In addition to superior design and technology skills, Casian brings a level of professionalism that is hard to match—he delivers peace of mind to my enquiries and recommendation. Casian has met every challenge faced on to create sharp, contemporary designs. I recommend him gladly.

Reflections &
recommendations

We’ve made massive progress in four weeks, but this is how far we could take the product. I’m proud and happy that we got through these intense weeks as a team.

This was a challenging product, but we solved the problems that CircaGene was facing:

• Increasing brand awareness and trust by 85%
• Clarify their unique selling proposition while emphasising the conversion opportunity
• Complete rebranding of their website

Future recommendations for the client:

Hire a copywriter (users want layman’s terms)
Create video content of customer’s testimonials
Keep adding customer reviews from Trustpilot
Live chat function & toll-free helpline for users
Use the design system to implement brand identity across all platforms

Key learnings

In a project like this, I learned that I need to understand the product properly, test it and empathize with the user as soon as possible, to confirm initial assumptions, specify the goals and start with the right foot. Workshops with the clients are an excellent method to understand the product in the early stages, enable progress on a particular challenge, and keep the stakeholders involved and engaged through the project.

I refined my knowledge of logos, documents, and web designs. I learned how to use tool never used before, like Lookback.io, and how to manage tasks and time better during a pandemic.

Next project

Improving the home
repair marketplace

Made in Webflow