BIZX MEMBER WEBSITE

Background

BizX is diverse community of business owners who leverage one another to earn new customers and improve cash flow by selling their excess capacity. No business runs at 100%–there’s typically something left unutilized.

To solve that, the BizX community buys and sells with each other using an in-network currency (the BizX Dollar) representing that spare capacity while keeping cash in their pockets. These businesses earn loyal, high-value customers, and optimize their bottom lines.

Purpose

The BizX member website is currently focused on the BizX Marketplace–solely for buying and selling. The design and technology is outdated, and user experience is poor. I worked on redesigning the site in order to encourage members to:

1. Engage and interact with one another to build community
2. Discover ways to spend their BizX
3. Find valuable educational resources/tools

I also worked to ensure that the new user experience is optimized and adheres to industry standards.

Process

1. Identify user needs
2. Gather business requiements
3. Iterate designs through multiple levels of fidelity
4. Work with engineering to develop the designs

User Research

I first sent out a survey to members to gather feedback on their current experience as a BizX member. A few key points that were uncovered after analyzing and coding the data were:

• Members find it hard to spend their BizX dollars
• Members have trouble raising disputes about transactions
• Members log onto the Marketplace one to three times a month
• Members would like a place to ask questions to the BizX community
• Members would like to see how other members are utilizing BizX

Specify Business Requirements

To gather business requirements, I had conversations with the executive board and documented their needs and goals.

After this, I carried out and moderated a affinity diagramming exercise with the lead of each department at BizX. The purpose of this was that so I could get input from each area of the company. For example, the sales department who are talking to members on the phone every single day, will have different opinions than the customer service team who are always dealing with member’s issues. I instructed them to write as many things on post-it notes that they believe should be included in a new member website. Then, I had them put their ideas on the wall and group features by common themes.

It was great to get everyone in a room to roughly agree upon what the new member website’s features will be, and to also break the regular office routine and get everyone thinking in a new way. After the exercise, I documented all the post-it notes and this informed the iterations of the sitemap and user flow.

Design & Paper Prototype

After this I sketched multiple iterations of the design for the pages with various solutions to the problem. I also created user flows and a sitemap. I presented my designs and went through rounds of feedback. I also carried out paper prototype testing for the designs before creating the wireframes. The particular image of the paper prototype pictured below was used to test the idea for a multicategory autocomplete search bar.

Sitemap & User Flows

I created a sitemap of the website as well as user flows (not pictured). We created user flows based on how different user personas would use the website based on their goals.

Wireframes

I created annotated wireframes using Sketch. The example pictured, is of the community newsfeed homepage. This page speaks directly to the feedback that members want a place to be able to ask each other questions. This also speaks to the business goal of creating a community amongst the members. I did multiple rounds of feedback and revisions on all the wireframes before moving onto the next phase.

High-Fidelity Designs - Directory

I created high-fidelity designs using Sketch. Of all the page designs created following the sitemap, I will share a couple. One example is the directory page for the members. Currently the Marketplace doesn’t do a great job making the distinction between directory listings and product offerings. Here we can see that “Marketplace” is clearly separated from “Directory”. To help the members find ways that they can use their BizX, one way we have integrated this into the design is the section for project ideas. This will provide a guide of recommended members to use for specific projects.

Also shown is the member profile page. The improvement here is having one centralized area where users can find out about a BizX member, what they have to offer, their reviews, as well as get connected to them and raise any disputes.

High-Fidelity Designs - BizX Community Feed

Another example is the BizX Community Feed page. In order to encourage members to build community and interact with one another, we created a centralized portal to allow members to have conversations. Here, they can create conversations based on different topics - questions, buy & sell, resources, meet & greet and recommendations. They can also share events that they may be hosting. We also including an onboarding card at the top of the feed so that members can know what they need to do to get started.

Development

I worked very closely with our offsite engineering team to write specifications for the designs.

Limitations

Because of limitations in resources and time restrictions, I was not able to do as much user testing. I would have liked to test all of the new feature for the website so that we can make sure we are designing in the right direction. Also, I would have liked to have more time to refine the visual design before jumping into the development phase.