Moving the Homepage Forward

Going more granular, the old homepage was originally created when our main offering was the Moves Business Cash Advance (BCA). Since then, the product had expanded into a Spending Account that tracks gig incomes week to week. The app team initiated a project that changed up the user flow to accommodate these new features. As a result, it just didn’t make sense for the homepage to only be focused on the BCA, when so many additional features will launched. (Old design below.)

Originally, members were able to apply to a BCA without opening a spending account. This new product update added more steps to the flow:

Only then, members would have full access to Moves features. Obviously, this then creates more friction in the process to obtain a BCA.

After an internal audit of the existing designs and gathering information from stakeholders, I identified some key problems that needed to be addressed.

• Moves has evolved, but the Moves website is still currently focused on the old offering. It lacks a narrative and the content is spread out quite randomly throughout the page. It doesn’t align with our current product marketing positioning and messaging
• The original website was built to drive sign-ups for the web app, but now it needs to drive conversion to the mobile app
• Our current branding motifs are limiting and don’t have much meaning towards our brand behind the design

Understanding our problems, I came up with a few objectives for this project. I wanted to make something that:

Besides the major objectives, I had some goals in mind for customer retention optimization. I kept these values in mind while designing:

• Increase desire, decrease labor and confusion
• Test options with customers when I can
• Create a fully responsive site (of course)

To provide further context, I took a look at the updated tagline and positioning statement.

After aligning on problems and objectives, I worked closely with our copywriter to come up with a wireframe. This was to organize and communicate how information was going to be prioritized on the page.

I created 2 different versions that I wanted to A/B test to validate the clarity and what would resonate more with our users. I was particularly interested in how the use of “Trusted by” logos would compare to quotes from users in terms of brand trust.

Once the wireframes were approved and finalized, I started on the high fidelity designs. I wanted to design the homepage to be spacious, with a lot of breathing room so the user can focus on one thing at a time. I felt that doing this would allow each section to create a bigger impact.

In order to reduce perceived friction within the mobile app’s new flow, I wanted the page to tell a story through the imagery. I took them through the steps of accessing all of Moves’ features, ending on the debit card and a call to action to download the app. Then, after learning about all the features, they can check if they qualify and read further if they need more social validation and information. Finally, ending in another call to action to really reinforce that downloading the app is the next step they should take. While designing, it was important to me to keep the flow simple and easy to understand.

In terms of motifs, I kept our old rounded squares motifs and introduced a new angle motif that reflected the angles in our logo, creating more movement in our designs. This brought more meaning into our imagery, since it reflected back on a core piece of our branding. Placing the angles horizontally on the site also was utilized as a way to encourage users to keep scrolling.

Alignment during WFH times: Since the homepage is the face of our company and had to reflect the new product flow, I had a large number of stakeholders that needed to be aligned on the direction of this project. This, along with the company being fully remote, led to the challenge of creating visibility for everyone.

I knew I couldn’t hold virtual meetings with everyone because with that many people and opinions, it would be very easy for the conversation to go off the rails. Instead, I created a video series that explained my design thinking and prompted stakeholders to either leave comments in Figma or start a discussion in the thread. That way, I also would always have a record of all the feedback given. In the next video I shared with the team, I would summarize all the feedback and show them how I incorporated it into the next version of the design. This system worked really well and resulted in alignment and happiness amongst all stakeholders.

SEO copy placement: In order to optimize for search engine optimization, we had several paragraphs of text that had to be placed somewhere on the page. The challenge for me was to find where to place it and strategically design it so that it didn’t take up too much space on the page.

In the end, I designed a slider that broke the information down into sections to reduce scrolling. I also placed it in the middle of the page after the main narrative, so it can act as supplemental information, but not get in the way. I felt that this was a nice, clean way to reduce the amount of clutter that extra copy brings to a page.

The launch of Moves’ new user flow and marketing page was a success, leading to over 1000 new users acquired in the first month. The storytelling approach to the marketing site greatly supported the achievements by Moves Financial.

In a fast paced start-up and with this new flow having a hard deadline, I was not given much time for creative exploration. So, I worked backwards and started with designing new motifs onto the website during the course of this project. Then I did a brand guidelines overhaul, which gave me time to specify how these new motifs could be incorporated into the overall brand. After the deadline, I had more time to do deep dive studies into CTA designs and colors.

Although not an ideal order of events, I think it was important that I approached it like I did. This allowed me to take my time with these studies and not rush them to be part of the website release. These were important design elements that had to be well thought out, because they were to be representative of our brand as a whole. Once these studies were finished, I made small changes to the website to reflect the updated designs. Definitely unconventional, but this system worked best for the situation.

I love talking design, get in touch if you would like to hear more about my design thinking for this brand and page or just to simply chat.