PowerlinX
Internship Timeline: 10 weeks
My Role: Content Design Intern
Tools: Figma & Digital Sketching
In the summer of 2022, I had the opportunity to participate in the TAMID Fellowship and intern at Powerlinx Inc, a small B2B startup facilitating connections between suppliers and buyers in both directions of the supply chain.
BACKGROUND & SOLUTION OVERVIEW
Upon discovering a 40% abandonment rate during the registration process, I embarked on a new initiative to overhaul this experience. The project involved conducting research through interviews, devising wireframes, and prototyping to establish a revised information architecture, update CTA text for button components, and refresh the visual design.
In my role as the lone content/UX designer at Powerlinx, I assumed full ownership and adeptly navigated through ambiguity. Furthermore, I successfully managed a challenging project deadline of three weeks while collaborating with an international team amid political turmoil.
PROBLEM STATEMENT & STARTING POINT
How might we create a registration experience that is intuitive and comprises relevant information so that potential users can access Powerlinx’s features and sell/purchase materials?
My design solution aimed to answer the question
As a requirement, I needed to use Powerlinx's three part registration process. An overview of this process is as follows. Initially, users are required to sign in using their email and an OTP (One-Time Password). Subsequently, they gain access to the feed. Should users wish to proceed further, they are prompted to fill out their Personal Profile. This profile encompasses both individual and business details, such as their position and department. Finally, new users are mandated to finalize their Company Profile, thereby adding their business to Powerlinx's backend database.
Understanding the Problem Space
To learn about the problem space, I answered the following questions.
Problem Space Guiding Questions
USING RESEARCH TO ANSWER THESE QUESTIONS
As previously noted, quantitative data revealed that out of every 10 users who downloaded the app, only 6 completed the registration process. To validate these crucial business metrics and pinpoint the registration process areas posing the greatest challenges to users, I conducted informal interviews at Powerlinx's booth during the Dun and Bradstreet Client Conference. Through these interviews, I discovered that users find the order and layout of questions within the Company Profile screen confusing. Additionally, the buttons within both the Personal and Company Profile screens lack clear guidance for users, and the verification text for company names adds further confusion.
Powerlinx's Booth at Dun and Bradstreet's Client Conference
Design Process
IDEATION & SKETCHING
I broke my ideation strategy into three parts:
-
Company Profile: information prioritization and hierarchy
-
Business Information: company name verification CTA text
-
Personal Profile and Business Information: CTA text
After defining these buckets, I brainstormed all possible changes. I used this list as a guide for my designs.
Snapshots of Ideation Notes
Next, I sketched wireframes to explore possible changes visually. First, I determined the information hierarchy for the Company Profile prompt groupings. I determined that starting broad and continuing with increasing specificity would be the best approach. Then, I sketched a sample of the About section to help me determine alignment, font styling (i.e., bold), and how to reduce unnecessary navigation. Finally, I sketched various CTA buttons for the Personal and Business Information Profile screens and a CTA button for Business Information name verifications.
Company Profile Information Hierarchy Funnel
Business Information
Company Name Verification
Company Profile About Section Sketch & Notes
Personal Profile and Business Information
CTA Options
Prototyping
In this phase of my design process, I translated my concepts into Figma to assess their integration within the app's existing framework. Leveraging Figma's tools, I incorporated arrows to visually demonstrate the relationships between screens and pop-ups. Furthermore, I employed color strategically to guide users through different screens and influence their interactions. Bright orange was utilized to capture users' attention, while a light peach hue was employed to steer users away from certain actions, such as account deletion.
Personal Profile and Business Information CTA and Company Name Verification CTA on Figma
Company Profile information hierarchy
and company name verification text on Figma