UX/UI

GRO INTELLIGENCE

Marketing Website Audit

Sr. UX/UI Designer

Background

Gro Intelligence is a data analytics company that leverages artificial intelligence to provide insights on global agricultural markets and climate conditions, aiming to improve decision making in the agriculture sector. Prior to my involvement, Gro revamped it's marketing website and branding through collaboration with several outside firms. The resulting brand package and Strapi site (a "headless" CMS) offered a suite of modules that (hypothetically) would allow rapid page design and implementation, including a selection of prebuilt pages designed to address Gro's needs at the time. This undertaking was positioned to create a user-friendly, uniformly branded source of information and updates, to showcase Gro's expertise and attract new customers. In practice it would allow employees, regardless of website expertise, to update content as needed.

Challenge

The Strapi site, and accompanying prebuilt pages, addressed some but not all of Gro's needs. The original package met some requirements of a public facing marketing website, but did not meet industry or accessibility standards. Additionally, functionality site-wide was hampered by improper breakpoints, unreliable tags and classes, as well as non-functioning elements. A major audit was necessary to assess these pain points and identify potential improvements.

Goal

A fully featured (and functional) suite of modules to empower both Content and Marketing to create and edit pages as needed. These modules needed to behave as originally intended across devices. Gaps in content coverage (missing legacy pages, modules, etc.) needed to be remedied through the creation of new templates. In addition, tags and classes needed to be corrected and aligned across the board, to ensure predictability and uniformity from one page to the next.

Research

Due to the nature of this project, our research was positioned to assess Gro's resources and toolkit as opposed to competitor analysis. Collaboration with Marketing was vital as they were the primary users of the Strapi platform, and had much to share in the way of pain points and desired use cases during the research phase. Special attention was paid to accessibility, and WCAG's best practices were used as reference wherever applicable. Research was conducted by the UX/UI team lead and myself. An exhaustive internal audit was conducted to assess how widespread the issues were. This involved comparing initial (external firm designed) mocks to our then-current implementation. This comparison progressed from a micro to macro level, first examining the function within a given module, then the relation between multiple modules across pages. Concurrently, code was examined to identify duplicate tags and other redundancies. Typography hierarchy was examined site wide to identify any gaps or issues therein.

Solution + Implementation

Unify all elements of the existing marketing website's design to match the original product vision, while meeting industry and accessibility standards. Document discrepancies in breakpoints to ensure website behavior remains consistent and predictable across devices. Streamline typography hierarchy to simplify implementation of future modules (standardized H1, H2, Paragraph, etc.). Provide reworked designs to developers for modules that were originally broken or missing. Implement interactivity based on Marketing input to drive further engagement. Align overall aesthetic more closely with Gro branding and stakeholder feedback. A premeditated schedule was constructed for developer hand-off to ensure efficient use of time for all teams involved.

Final Thoughts

This project proved to be incredibly important and long overdue. Assessing gaps in basic website function had been de-prioritized due to a lack of developer resources, but we were able to devise a methodical roadmap to fix these issues. The prioritization of issues helped determine a cadence of improvements deployed to the site, without straining any of the teams involved. The website audit helped strengthen cross-team collaboration, and made future, similar workflows more succinct and effective.

CONSUMERTRACK

Mobile App Redesign

Lead UX/UI Designer + Researcher

Background

GoFreeCredit (GFC) provides credit monitoring services through partnerships with companies like TransUnion and Experian. ImportantScore (IS), a property that exists under the GFC banner, was under-performing in comparison to other GFC products. The copy and graphics emphasized FICO Scores and ease of use, with a color palette influenced by IS’s logo design. Previous IS changes had been implemented to more closely imitate competitors, without a holistic consideration of IS's own identity. Due to multiple high-level stakeholders and legal requirements, many considerations had to be made regarding the product's final appearance and copy. The entire revamp was owned by the design team, with collaboration and thorough research critical to the project's success.

Challenge

ImportantScore performance data showed a severe drop off between the landing page and Page A, as well as a low overall completion and conversion rate when compared to other GFC products. Designed desktop first, the initial development ignored the fact that over 45% of the traffic was mobile. Previous design, copy, and interaction decisions had been based on an amalgamation of outdated user tests.

Original Landing Page & Page A - Click to see more

Goal

Increase conversion and rework (or remove) the IS branding to simplify the user’s experience. My focus on this project was to revamp the first two pages with which a user would interact, which would then serve as a template for the remainder of the process.

Research

Due to a lack of funding, guerrilla research was conducted to obtain immediate insights as well as actionable feedback from a variety of sources. Participants were asked to navigate to ImportantScore via their search engine of choice, and then proceed as far as possible with the provided sign-up information. Research was conducted both with and without the participant having any knowledge of the product’s intended purpose or pre-existing pain points. Notes were taken and recordings were made to properly document the user experience, as well as common grievances. Additional metrics were culled from other GFC user research and A/B testing to supplement our results when applicable.

Research & Ideation - Click to see more

Solution + Implementation

Design mobile first. Deliver a concisely informative landing page with robust representations of the benefits available upon completion. Bolster the legitimate connection to more reputable clients, whose services would be presented upon successful signup. Strip IS branding to eliminate user confusion. Excise unnecessary information (FICO scores and other non-primary product features), and update the aesthetic to more closely match industry standards. Additionally excise unnecessary fields and overabundant padding. Due to a shift in company priorities, funding for this project was pulled before launch. However, the work directed and conducted by my team and me, from research to the rework of design elements along with practices established during the project, have been applied to other products to boost performance. The collective brainstorming and collaboration between the design team and other departments yielded auxiliary ideas that were applied elsewhere in myriad ways. Further guerrilla testing with this prototype has netted positive results and feedback. Many aspects of this refresh were applied to the company's flagship product, GoFreeCredit, to great effect.

Final Version - Click to see more

Final Thoughts

This redesign served to reintroduce fundamental design philosophies back into the company's ecosystem. Due to TransUnion's intense legal requirements and a circuitous approval process, the end user had been lost in the shuffle. Even though this redesign wouldn't see the light of day as a reworked version of ImportantScore, the lessons learned were a wonderful chance to refocus on our product's core competencies, as well as circulate relevant information to other departments and stakeholders. The new resources created through this process (prototypes, high quality mock-ups, etc.) would live on in other user flows and prove to be an invaluable resource moving forward.