Sensibill is a solution for financial institutions and banks to collect, synthesize, and action customer spend data to personalize at scale.

Timeline 8 Weeks

Role Visual Design & User Experience

Overview

Sensibill’s website redesign was assigned by the Executive Leadership team in collaboration with the Product and Marketing teams. Sensibill is looking to revitalize their website with an emphasis on the homepage in order to primarily attract Financial Institutions and to generally improve user experience.

Challenges

In order to do our research properly, we needed to address our challenges and primary pain points. This was a great chance for Design to sit down with Leadership, Product, and Marketing to discuss issues through the lens of each team. Listed are our primary challenges 👉 View our full discussion here.

Sensibill is looking to redesign their current website in order to attract financial institutions and improve user experience.

Discovery

Competitive Analysis

After addressing our challenges we were curious to see how industry leaders were handling their websites, we looked into direct competitors and top industry leaders such as Segment, Plaid, and Klarna. We paid special attention to how they communicated the value of their offerings, page structure, navigation, and how they visualized their technology.

💡 Key Takeaways

• Segment is a great inspiration for visualizing Sensibill’s AI data engine using simple animation
• We can use animation for communicating complex ideas
• The Fintech space is saturated with dark “code inspired” branding - we can differentiate Sensibill by concentrating on our light and airy feel
• Using Plaid and Segment as inspiration we found that we could alleviate navigation issues by implementing a mega menu

Secondary Research

To make more informed design decisions, we gathered psychographics on our target audiences - leveraging cognitive principles and user stories to understand our audience and increase conversion.

Read the full summary of our research here

User Stories

Based on data and research we focused on two major audiences. Bank executives looking for Fintech solutions, and skeptical banking clients concerned about data security.

Bank Executive Sara Sara is researching Fintech solutions to bring back to her bank that will help them better understand and serve their customers, she is wondering if Sensibill’s tech might be the right fit for their needs.

Security wary Dale Having just downloaded his first banking app, Dale notices Sensibill’s receipt capture option. Concerned about banking security he finds himself researching Sensibill to learn more.

Wireframes & Prototypes

Wireframe V1

After deciding on messaging we designed the homepage wireframe structure, input design inspiration, and animation storyboards. We shared Sensibill's value story and design direction with leadership using visuals, animation storyboarding, and in-file design rationale. Using skeuomorphic UI elements allows us to elude to app benefits without the expectation that we are selling an app when we are selling our technology.

View full analysis here.

💡 Objectives for testing

• Observe the reaction to Sensibill’s technology visualizations
• Understand if we are properly telling Sensibill’s story - are we attracting financial institutions?
• Observe reaction to structure and length of homepage
• Uncover usability issues

Wireframe V1 Feedback

• Stakeholders are concerned about the lift and budget associated with 3D animation. Is there a solution we can come to that is economical with a quicker turnaround?
• The length of the page feels long, we need to distill down messaging and support visuals.

• Include more FI logos for trust and confidence
• A large animated Sensibill Data Engine visual might be out of budget range - can we do this in an economical way?
• Should feel more personal by showcasing people

Wireframe V2

• Header showcases actual user and user profiles - making the site more user-centric and approachable
• Collect, synthesize, action visuals as vector images that imitate Sensbill’s AI data engine as a more economic solution
• Experience, Enrichment, Intelligence visuals as skeuomorphic UI

Wireframe V3

• We lifted the main data engine visual as the website header using animation to show the full platform story
• Removed trust messaging to the bottom as confidence reinforcement with the customer quote section
• Extraction, Enrichment, Intelligence visuals as vectors in a parallax scroll create a feeling of interaction and interest for the user and reduce the length of the page
• Use of vectored illustration and icons are lower lift and economic

Conclusion

With help from Product and Leadership, we were able to distill down our main value story; using animation and vector illustration, align with our target audience, and implement UX best practices. View it live 🌎

• Sensibill data engine animation showcased in the header - immediately shows FI’s our larger story and platform capabilities
• Distill our data engine value story into Extraction, Enrichment, and Intelligence visuals.
• Custom Icon and illustrations showcase Sensibill benefits
• Megamenu makes it easier for users to navigate and align with appropriate solutions