Lending-stream-introduction.png

Lending Stream.

Product UX UI designer to redesign an application form / May 2018 - August 2018

“Charlotte was one of the most pro-active and self managing product designers. I've worked with. She hit the ground running from day one. Her skills, experience, and assertiveness were a great asset to my team, which was exactly what I needed. In the short time we had her on the team, she made changes and improvements to our processes and guides that will continue to enhance our creativeness and productivity for a long time.”

Rob Renton, Head Of Product Design (UX/UI)

Challenge.

  • 30% The loan application form conversion rate was just above 30% and dropping

  • 48% Bounce rate

  • 16% Withdrawal rate and gradually increasing

  • 85% The form was originally designed few years ago for desktop users which was a concern seeing as around 85% of our customers were now on mobile devices.

The team

The majority of the team was based in the head office in London Bridge but the UI designer, the data analyst and the front end developer were in Chennai, India. We followed a well structured workflow process with weekly zoom meetings for kick off, research review, design review, walkthrough, testing, development… and daily conversations via Slack.

Team organisation

Team organisation

My role

  • Assisting the UX researcher

  • Defining concepts inline with the best practices and the WCAG

  • Creating flowcharts, wireframes, prototypes, and interaction design specifications

  • Establishing a design system and taking design decisions that scale

  • Putting the user at the heart of the design process, grounding my design decisions in user research findings in collaboration with the research team

  • Working closely with development teams to ensure that design specifications can be implemented and making acceptable design adjustments

Empathise & Define.

 

At the beginning of the project I received a lot of documentation, Product owner requirements, competitor analysis, customer interviews & feedbacks, customer service feedbacks, customer behaviours videos, customer profile stati, pain points, drop points, UX reseracher recommendations… I also conducted an usability research, created the current wire flow and study the WCAG for the best practices and accessibility.

 

Then we established the problem statement

WHO? Our new customers with mobile devices,

NEED? want to quickly, easily and confidently complete the application form,

WHAT? to apply for a short term loan.

Lending-stream-draft.png

Ideate & Prototype.

The research phase has allowed me to generate lots of ideas that I quickly sketched on paper. I came up with different types of application form, functionality and patterns ideas to improve the customer journey. We evaluated them all and kept the ones susceptible to solve the problem statement. Our main hypothesis was that splitting the application form into smaller, clearly organised sections would make the form feel shorter and quicker.

As a team we decided to develop 2 of my concepts: “the natural language”, and “the single field forms”. I designed 2 tangible solutions in order for us to identify challenges, technical constraints and determine next steps.

Desktop Copy.jpg

Natural language

The form is split into small groups of related fields, and constructed into conversational sentences. Rather than reducing the copy, this approach actually makes it longer, but the goal was to make it more natural to complete. As a field is completed, the next part of the sentence is revealed.

Lending stream Single field.png

Single field.

The fields are presented one by one, with a smooth animation from one to the next. This approach makes the form very quick and easy, as the customer doesn’t have to read more than one instruction at a time, and can make a quick decision.

A different progress indicator was required as once a section is completed, the section name sticks to the top of the screen where the indicator usually goes.

Designing this solution had a different set of challenges to solve. Most fields would require an OK or next button meaning the customer had to click to proceed each time.The form is split into small groups of related fields, and constructed into conversational sentences. Rather than reducing the copy, this approach actually makes it longer, but the goal was to make it more natural to complete. As a field is completed, the next part of the sentence is revealed.

Lending-stream-test.png

Test.

We finally decided that the split form and the single field (designed by someone else) form could solve the problem statement and should be user tested. We tweaked and improved those 2 concepts following the feedbacks and developed two prototypes.

I then helped the UI designers creating a design system guidelines in Sketch for further design projects and worked closely with the front end team in India to build a high fidelity protype and make sure it functioned as expected.

The result were quiet positives, they conducted a user testing session with an agency. The participants found the process easy to use, fast and trusthworthy and felt secure, intuitive, effortless.

The single field form felt longer and slower despite the same amount of fields

Having an overview of the total lenght of the application form and how far they had progressed was desirable.

Takeaway.

The main takeaway was that giving the customer the impression of less effort, grouping relevant tasks together and providing clear sign posting can significantly increase customer satisfaction and ease of use without reducing the number of fields, we made the form effortless and quick to complete. I also learnt the importance of qualitative data based on customers feedbacks and testing as opposed to assumptions.

Moving forward my process has been better documented than it has never been before.

Previous
Previous

Deutsche Bank

Next
Next

Datto