UX Design — website redesign

For my final client project at RED Academy in London, I had the opportunity to improve the user experience for — a website for businesses to send personalised postcards to their customers. The main goal was to increase conversion from the landing page to actually booking a campaign.

The Task

Sprint: 3 weeks

Scope: Manage the client relationship from inception to deliverables handover

Team: Rebecca Frearson (UX), Fiona Brownlie (UX) and Ameet Gonsai (UX)

Tools: pen & paper, Sketch, InVision, Adobe Illustrator, Google Analytics

Our Process

Research

We started off on the right foot— we had an engaged client who provided access to postary’s Google Analytics, plus a clean minimalist look and feel to the site that we believed to be appropriate for the target audience.

Analysis of the existing website

To figure out why there were so few conversions, we started investigating by performing a heuristics analysis on the existing website, user testing and reviewing the site’s Google Analytics.

Our immediate thoughts were that we needed to reduce the bounce rate by engaging users with the homepage from the get-go. A way to do this would be to increase time spent on the homepage with a video.

Competitive Analysis

Our competitive analysis revealed that most competitors in the direct mail marketing genre have step by step instructions on their homepage. Further, case studies are commonly used to prove that their service yields results. Plus, we thought that the service offered by postary was superior in that you can track individual postcards AND send only as many postcards as required, but these USPs were not clear to our visitors.

Survey

Next, we created a survey on Google Forms to understand the motivations of our users. As no one on the team has ever sent a direct mail campaign, we had a lot of catching up to do to figure out what features our users want to see, and also how they would like the information displayed. Below are the key findings from our survey.

Since most survey respondents said they’d like instructions in the form of a video, we decided to include an instructional video on the homepage. This corroborated nicely with our need to increase dwell time on the homepage as a result of our Google Analytics research.

Affinity Diagram

To conclude our research we created an affinity diagram to bring together all of our ideas on postary and how we can build upon it. This really helped the team hone in on all of our best ideas and observations in order to produce a site we were all confident would deliver a great user experience.

Planning

To understand the motivations and needs of our user, we built our user persona and relied on other tools such as a scenario and journey map — from the reason why they would visit the site in the first place to how they interact with the website.

Persona

The visitor coming to the postay website works as Head of Marketing for Cats Protection League and she is driven to the site to increase engagement with customers and to increase website traffic. It’s her job to spread the word about her company’s services and to engage with customers on a personal level. She often has a low budget and wants an effective and personalised campaign that can be measured.

User Journey

Job Stories

With an intimate understanding of our persona’s motivations and needs, we identified what the website must do to meet these needs with job stories. We would need to ensure that the users could identify and understand the process of sending a campaign is as well as highlight the USPs.

  • As a Marketer, I want to send my customers a personalised message within my budget
  • As a Marketer, I want my customers to feel connected with the Cats Protection League community
  • As a Marketer, I want to engage my customers so that they are familiar with our service and tell their friends and family about us
  • As a Marketer, I want to increase traffic to our website so that our cats have the best possible chance of adoption
  • As a Marketer, I want a tool that is simple to use and a way to measure the success of the campaign

Design and Testing

The following hand sketches of postary’s homepage show how we incorporated some of our key design decisions such as adding a video and an infographic. We wanted the user to know what the service offers from the get go. Plus, we wanted to showcase postary’s case studies to build trust with the user.

From testing our low-fidelity paper prototypes, the most significant feedback we received suggested that our designs did not make the postary process crystal clear. Those landing on the home page need the information in digestible chunks that they can expand upon. We decided to include an anchor point with each step of the postary process underneath the video.

The following images show how we evolved our hand sketches into mid and high fidelity screens. Testing the mid-fidelity site suggested that we had not quite hit the nail on the head — we still needed to better explain who postary are and what they do. We solved this challenge by coming up with a Why Statement that explained who postary are and what their USPs are.

Testing also told us that a section of the website for campaign resources such as postcard sizing and design guides was necessary. Previously this had been under the “How To Guide” — but this gave the wrong impression that this section detailed the postary process. We renamed it Campaign Resources and when we asked testers to find out what size a postcard is, they all searched under Campaign Resources.

Final iterations included some UI guidelines. We didn’t have a UI designer for this project, so we worked with the assets provided by the client to bring the postary brand to life. We used intuitive icons in the anchor point and we also added the rocket into the anchor point to show that it is a flow.

Prototype

The prototype can be viewed here.

Next Steps

At the end of the sprint, we shared our findings, process and final designs to the client in a formal 40 minute presentation. Afterwards, we had the opportunity to discuss the designs in more detail and arrange for a handover of all of the assets.

The client was enthusiastic about the results. They felt that we took their existing content and presented it in a far more effective manner. They said they were excited to make the changes to postary and asked for advice on what to change first. They also appreciated our insights from Google Analytics and the steps they can take to increase conversions.



Source link https://blog..io/postary-aeff1048d9a4?source=rss—-eb297ea1161a—4

LEAVE A REPLY

Please enter your comment!
Please enter your name here