Arturo Gómez
    About
    Arturo Gómez
    Arturo Gómez
    /
    Work
    /
    Bringing the brand new offering to a clear and engaging website
    Bringing the brand new offering to a clear and engaging website

    Bringing the brand new offering to a clear and engaging website

    Project

    Marketing Website

    Role

    Interaction Designer

    Overview

    We implemented Payactiv re-branding into the web communication presenting value prop through emotional storytelling

    Payactiv

    Live the life you earned

    image

    Team

    Antonello Crimi, Project Lead Casey Corcoran, Program Manager Jhonny Minor, Visual Designer Erin Nelson, Copy writer Karl Carstensen, Design Technologist Marco Murguía, User Experience Designer

    Overview

    Payactiv is a company from Silicon Valley providing financial services such as earned wage access to employees. We partnered with them to design the foundations of a marketing website that convert visitors into leads and active users.

    image

    The challenge

    Over a year, we helped Payactiv to define their future vision. Establishing a brand strategy & brand identity that support and drive actionable next steps for bringing the vision to life.

    One of those steps was to redesign their website channel in order to show the current value proposal of Payactiv but also support the construction of a new company strategy. So our challenge was to design the arquitecture and the principal user flows for the marketing website that will be the bringe for this vision.

    image
    image

    Goals & Process

    I worked hand to hand with visual designers, copy writers and tech architects to define the narrative along 8 pages for Payactiv’s external marketing website.

    We stablished the Information Architecture and the Initial Design Language System (DLS) for the new brand implementation. We completed page design (wireframe + visual + copy + animation) for 2 breakpoints (Desktop and Mobile).

    The project took 6 weeks and we go through lots of design reviews and iterations to define deliverables. From understanding clients goals and expectations in workshops to helping them to understand the best way to implement tech challenges such animations and web renderization.

    Competitive Analysis

    Identifying the right path

    With insights and brand definitions already created by frog, we starting by researching the current state of the industry communication in terms of marketing websites. We find out patrons and identify the right path to differeciate ourself from the saturated Earned Wage Access sector:

    • Drive with emotion
    • Create trust through community
    • Provide proof points for analytical types
    • Focus on conversions
    • Be contextually relevant
    • Lead with core intents and clear wayfining
    image

    We decide the sections to design based on the traffic of the previous website. This information was provided by the company throught Google Analytics. This also give us some actionables insights about visitors behaviour:

    • Focus on main sections (80% traffic) and create a more efficient structure.
    • Focus on driving traffic to conversion goals.
    • Drive traffic from employees to employers.
    • Re-think a new way to create value through a new “About us”.
    Main pages by number of views
    Main pages by number of views
    image

    Approach

    Process defined by content and form

    Due that we were running multiple path of work at the same time –Architecture, copy, narrative and visual–, each member of the team were iterating their progress with other members advances and the proccess itself was determinating what decision makes more sense with the ritme of work and thinking process.

    For example, while I was defining the narrative for the landing page focusing on convert visitors as soon as possible, and avoiding excessive CAT's that could distract the user, the Information Architect was working with that limitation in mind and determining how other pages could support storytelling.

    Narrative explorations aligned with architecture.
    Narrative explorations aligned with architecture.
    image

    Final Screens

    We started from the landing page in order to present the value prop with a emotional storytelling from a content and visual standpoint. The navigation menu follows responsive behavior and clear patterns, such simplicity and clear CAT.

    Four main sections to clearly communicate and convert

    image

    HOME

    Inspire, build trust, and show paths

    • Create an emotional connection with workers.
    • Clearly show the product and value to users.
    • Build trust through the company mission and social proof.
    • Connect with companies by demonstrating tangible value

    Convert visitor workers into enrolled users (App & Join)

    • - Direct visitors to more detailed pages about our offering Direct interested visitors to read more insights
    • Provide more answers and support
    • Log in active users
    image

    FOR YOU

    Demonstrate value to convert workers

    • Show relevance to workers' real needs
    • Provide social proof from workers who use Payactiv
    • Clearly show the possibilities Payactiv provides

    Direct workers whose companies are not yet Payactiv providers

    • Promote Payactiv Card
    • Ask to promote Payactiv to their employer
    • Convert visitor workers into enrolled users
    • Direct interested visitors to read more insights
    • Log in active users
    image

    FOR COMPANIES

    Build trust and sense of urgency with companies

    • Establish Payactiv as a partner to support workers’ well-being
    • Build trust through key partnerships, social proof, and industries served
    • Demonstrate integrity through company purpose
    • Show tangible value for companies at a high level and in detail
    • Provide peace of mind through compliance standards and integration ease
    image

    IMPACT

    Inspire companies' belief in all we do

    • Focus on workers' and companies' own words
    • Move hearts through a clearly and transparently stated purpose
    • Demonstrate impact both rationally and emotionally
    • Establish authority and build trust through company story and mission
    • Put the mission in context to show the gravity of the problem and create urgency
    • Provide social proof from workers and companies who use Payactiv
    image
    image

    Hand Off

    Documentation is key to implementation. We created a Design Language System for the website in order to deliver a creation base for the Payactiv's internal team.

    Besides the traditional componentes in a UI library, we documented detailed design principles, layouts and animations with implemented examples like transitions and illustration animations. This also helped the developer's understanding.

    image
    image

    Takeaways

    Payactiv creates products that empower more people to participate in the economy they helped to create. The Livelihood Platform lets workers access what they've earned, choose how to spend and save, and own their schedules so they can engage more fully in both work and life.

    It was an honor to us reimagine how companies can serve their employees with innovative benefits that help them retain, engage, and impact the daily lives of the people who work for them.

    image

    Thanks for reading.

    If you want to learn more, I’ve got a bunch of links for you on the right. Explore them.

    Want to stay in touch arturocotacio@gmail.com Twitter · LinkedIn · Medium

    image

    ← Back

    Previous ← Infosel Hub

    Next → Laser Duel

    Let's build the future together. With love by Arturo Gomez.
    LinkedInMediumInstagram