four weeks
UX designer, project manager, user researcher, workshop facilitator
4 UX designers,
1 project manager
Figma, Miro, competitor research, feature inventory, Delta/Plus assessment, user interviews, affinity mapping, feature prioritization, usability testing
persona, sitemap, wireframes, high-fidelity mockups, MVP prototype, design system and branding
desktop and mobile (responsive design)
The client, rebolet needed to emigrate their customer base away from third-party sales platforms onto their own custom marketplace to increase profitability and better showcase their brand and business model.
Design thinking was spent understanding the brand on a fundamental level to be able to instill their values and mission into the design. Success meant driving brand viability as much as driving sales.
Through research, we aimed to understand how competitors build customer loyalty and trust when their brand is tied to a marketplace rather than a tangible product itself.
Through a Delta/Plus assessment, the need for significant reorganization emerged. The site lacked conventional, consistent information architecture. Items were grouped in haphazard, unclear categories. Without organization, users cannot quickly nor easily navigate a site, leading to confusion, frustration and decreased sales.
More than anything, the site needed consistency to provide an environment conducive for customer browsing, a key element to harness increased online sales, through facilitating the construction of users' mental models.
User interviews offered many conflicting opinions. However, the design team dug deep to withdraw out the common ground, revealing the following insight:
Through synthesizing data from user interviews and competitor research, an explicit need for transparency became apparent. Its value stems from demonstrating honesty to the consumer, preventing them from feeling confusion or other negative emotions. Honesty breeds trust breeds loyalty.
We redesigned the experience to provide a clean, organized experience that offers customers a sense of familiarity in order to build trust and transparency with the client’s user base. Building the brand in addition to creating a modern, clean interface provided the foundation upon which Rebolet can build a successful business.
By focusing work on the B2C experience, we gave ourselves the means to tailor the experience better and allowed us to offer the client more short-term gain, providing both revenue and the ability to showcase brand value / potential to pursue additional investment.
The feature prioritization allowed us to realize many less exciting ideas would provide a better, more complete user experience in line with what our users described as important.
In designing updated information architecture, I designed three main categories: shop, environmental efforts and customer service. These three purposefully place the commitment to sustainability and the customer in persistent view of said customer. Doing so creates longterm brand viability through recognition of their company mission and values.
I also focused on crafting four broad categories for products within the shop to help lessen users’ cognitive load and reduce or outright remove the need to adjust the categories / architecture based on current stock.
Due to client feedback describing the site as friendly and curious, I created a tone guide to govern the creation of copy on the site. I aimed to make shopping on Rebolet an experience akin to time with a friend, using warm, informal language and the user’s name whenever possible. This choice was meant to blur the line between user and interface, furthering the project goal of instilling loyalty and fostering trust in the customer base.
User testing revealed shortcomings in the visual hierarchy established, particularly in the checkout flow. We iterated the design to a more vertical visual flow, following the user’s eye as they fill out form fields to be more intuitive through less back and forth eye movement.
Next steps include testing the account flow. Our research suggested users are more likely to patronize a business when they understand the benefits and incentives to doing so. Testing this critical aspect of the project was a distinct limitation due to the tight project deadline but presents an opportunity for further growth.
The modern world faces new problems every day. With time spent at home rising throughout 2020, the demand for online shopping increased dramatically. As online shopping increased so too have online returns. What happens to ill-purchased goods after sending them back? My client recognized this very pain point.
Rebolet is a German online reseller based in Berlin, aiming to increase online marketplace profitability by reducing waste. They strive for 100% environmentally-friendly operations via recycling or donating any items unable to be resold.
To increase profitability for online vendors, Rebolet acts as a consignment service intaking and assessing item quality. Using their proprietary algorithm, they determine the best avenue to sell returned or overstocked items. This creates value for both the consumer and the vendor, not to mention the planet
As the project began, my team met with the project magnager to learn the business' needs and decide upon a direction forward. Initial conversations circled around a simple conceit: who is Rebolet? What is their brand? What is important to them?
The client wanted to wean customers off third-party sales platforms onto a native Rebolet marketplace.
The Rebolet logo
Thankfully, their mission statement provided a guiding light:
This FRESH perspective guided us forward. We decided a focus on creating a quality experience with unique brand recognition, fostering customer loyalty through promoting the benefits of the site, would provide the most return on investment (ROI) for the client. Success meant driving brand viability as much as driving sales.
Rebolet’s business model covers business with individuals alongside bulk-oriented business orders. After discussing internally, we determined focusing on their B2C (business to consumer) marketplace offered us more traction as an MVP (the minimum viable product) than trying to cover both B2C and B2B (business to business) sites.
By focusing on the B2C marketplace, we gave ourselves the means to tailor one experience more completely. Furthermore, it allowed us to deliver a product which offered Rebolet more immediate short-term gains: providing revenue and showcasing their potential viability as a startup and brand to pursue further venture capital.
From this point, we drafted various documents to guide ourselves as a design team. A functional team plan provided the foundation for a harmonious, collaborative work environment.
Our project timeline provided a map to guide us forward. This was vital as the team was working entirely remote, as far from each other as from our client. The timeline allowed us to see the forest through the trees.
Designing for a German customer base provided mixed feelings of excitement and trepidation. The specific project constraints provided a unique ideation process where we spent significant time discussing and understanding the differences between our specific goal and a typical e-commerce platform.
An important consideration I raised early was collecting accurate, representative data from users available to the design team. The project manager assured us that similar shopping habits exist among European and US shoppers. We would not need to limit research parameters to solely German customers, further still to those who spoke English.
Kicking off the initial phase of research, we decided against using heuristic evaluation because doing so highlights flaws. Various competitive and comparative analyses were chosen instead to help identify the strengths of other marketplace sites. We had been given enough leeway from the client to move in any direction, so we chose to research components of competitors' success rather than diagnose shortcomings within the existing product.
Through our research, we aimed to discover how websites create loyalty when their brand is tied to their marketplace instead of a specific product itself.
I conducted a feature inventory, comparing Rebolet with top competitors. This analysis focused on individual features to discover where there was overlap and what I could borrow from competitors to ensure parity within the MVP design for the client.
Competitor sites included reviews for sellers and shipping (instead of particular products) as well as information regarding item condition and a related grading system. Ultimately, a need for transparency became apparent in order to prevent users from feeling confusion or worse in an attempt to deceive them. Honesty begets trust begets loyalty.
When dealing with rapidly changing stock, overt access to information provides an ability to foster trust with the user through transparent practices and guidelines.
I was surprised to discover that Blinq and Etsy both offered information on their sustainability initiatives. Blinq is an online reseller and direct competitor to Rebolet; Etsy is a marketplace catering to handcrafted goods. Both were upfront regarding how shopping with them (over competitors) affects positive environmental change. Throughout the initial research phase, the team deep dived into this facet to discover some valuable trenches of information to extract.
A great example of this endeavor is Nike. Their sustainability efforts warrant their own website, separate from Nike’s online marketplace. The site encompasses everything from blog posts to statistics. It includes their efforts ranging from community impact to social initiatives, human rights to responsible sourcing of materials.
While this was far removed from our client's focus, it provided them a prospective roadmap to strive toward. It provided an ambitious objective to measure success against and work for in furthering their own environmentally-aware brand and marketplace.
After completing individual rounds of research, the design team regrouped to perform a Delta/Plus assessment of the preexisting Rebolet marketplace. This allowed us to examine both the strengths and areas for improvement within the current design.
The implementation of standard design conventions in the global navigation and footer were promising. However, the rest of the site lacked necessary organization to the information architecture. Products were grouped into haphazard categories without any obvious reasoning. More than anything, the site needed consistency to provide an environment conducive for customer browsing through facilitating the construction of users' mental models, a key element to harnessing increased online sales.
In synthesizing our user interviews through affinity mapping, users' feedback often had conflicting opinions on the same issue. This forced the design team to dig deep to draw out the common ground and find the empathy in their comments. Six users between the ages of 20 and 40 echoed the following insights that allowed our work to progress.
Users feel empowered by a well-organized website which in turn encourages increased spending.
Transparent return policies provide a feeling security, whether or not the customer intends on using them.
Users will usually only make an account if they see benefits and incentives in doing so, remembering positive checkout experience and returning to those sites.
After mapping and identifying the trends from the interviews, our primary user persona emerged. Nadia is a price-conscious student studying architecture abroad in Germany. She wants confidence in her purchases. Nadia also places importance on her impact on the environment.
“Shopping resale is a bit of an adventure.”
- Nadia Brooks
Nadia needs an experience that is organized, trustworthy, and transparent in order to feel confident when shopping reseller sites because she "feels tricked” when an item arrives in a condition other than stated.
Utilizing a feature prioritization after establishing the primary user persona allowed the design team to focus on which features were most necessary to include in the MVP. We employed a MSCW feature prioritization to conclude which potential ideas must, should, could and won’t (MSCW) make it into the project scope.
Use of this tool was useful in recentering design ideation around our user. At this phase, plenty of exciting, glamorous ideas emerged. Despite their perceived value, the MSCW sort allowed us to realize many less exciting ideas would provide a better, more complete user experience in line with what our users described as important.
Understanding the client's competitors and users, we were ready to move into the design phase of the UX process. I facilitated a design studio workshop for my team. We warmed up together with some simple drawing prompts then individually sketched ideas for potential solutions to areas deemed key to the user experience. These key experience areas included:
We wanted to craft a homepage able to guide users to products without making them feel as though they were being coerced or influenced in any way. A clean, focused aesthetic was a purposeful choice we carried through all our potential designs and iterations to match the client's perceived understanding of self.
Ensuring design consistency was important to our client. Knowing this, we worked to create elements that introduced more common interface conventions into our work. We also explored mobile responsive designs per the client’s request.
We aimed to begin the user’s experience with a sense of trust and curiosity through the purposeful use of Rebolet’s own brand color, aptly named Curious Blue. Focusing in on the global navigation present in the header, we built a sitemap to serve as the skeleton for the rest of our architecture.
We employed dropdown menus in the global nav to account for the increase in text space needed when translating between English and German. The ability to toggle both languages was a feature the client deemed necessary as they want to appeal to German customers alongside the potential to attract a larger, international audience. Broader appeal becomes especially important when promoting their brand viability.
The global navigation consisted of three main sections: shop, sustainability efforts and customer service. To account for the irregular nature of Rebolet’s stock, I formed four overarching categories that comprised the type of stock the site typically offers: apparel, sporting goods, electronics and home goods. By using broad language, the need for consistent updates to the header is circumvented.
Placing access to sustainability information and customer service as primary, persistent elements in the global nav speaks to Rebolet's values as much as creating a functional user experience. By prominently displaying environmental efforts, Rebolet shows its commitment to sustainability and the planet. Likewise, providing easy access to customer service options shows their commitment to the customer.
A design addition with the most longterm value placed sustainability at the center of Rebolet’s redesigned homepage. The world is moving in a direction where increasing importance is placed on doing good for the planet, a sentiment synthesized from user interviews.
By showcasing sustainability in an area of importance, on the homepage directly below the hero image and two horizontal item scrolls, it cements environmental awareness as a core tenet of Rebolet’s DNA. They can utilize it as a means of building trust through transparency with their customers. This provides a source of strength that I believe will only continue to increase as their brand recognition grows.
Heading into the final stretch before the project deadline, my group lacked direction. Feelings were beginning to mix with and affect the work. Mindfulness allowed me to recognize this change in the air and decided to step into a more prominent role leading the team.
I had been quietly guiding the team up to this point by setting meeting agendas and delegating work. Previously it had been important to me to not overstep within the group, so I held back. However, I instinctively recognized that the group needed to momentum in order to maintain a pace fast enough to meet deadlines so I stepped up to help push us forward.
After this turning point, I directed us to immediately begin usability testing the working prototype with live users. The goal was to uncover and diagnose the oversights and areas of weaknesses in our work. It was integral that we continually return to questioning how our work benefits the user.
We tested the prototype with 6 users between ages 23 to 40. Only 67% were able to locate the item in under 2 minutes while only 50% were successful in completing the task in under 10 clicks. Ultimately, 100% of the users were able to complete the task meaning our designs held merit. More iteration through the design cycle was needed to refine and iron out these usability issues.
Many users instinctively began their testing session by immediately maneuvering to the search bar. This proved an area of friction as we had not prototyped that functionality nor considered that its use would be so instinctive.
In discussing the global navigation with multiple users, they said it felt “cheap.” By being sparse, the minimalism could either appear modern and upscale, or as our users put it, lacking in content and therefore inferior. The design goal was to avoid highlighting shortcomings with a clean, straightforward design. Cheap was not an adjective I wanted associated with the design, only with the prices.
Testing also revealed that users were drawn to areas we did not anticipate in the checkout flow. The checkout process needs to be easy for the user to prevent loss of sales through loss of interest. We rearranged the button layout from the right to the bottom of the page to allow the user’s eye to travel vertically along the flow of form inputs instead of repeatedly back and forth across disparate elements on the page.
The original checkout flow (left) and the updated version, aiming to streamline and increase efficiency through improved layout.
Overall, users described the checkout process as easy, effective and efficient. Despite recognizing areas in need of improvement, the basic flow was successful.
Approaching the handoff deadline with the client, the design team created high-fidelity mockups indicative of our creative vision for the polished, final version. These are clean and organized, exactly like our aspirations for our client Rebolet.
It was at this point that I finalized work on the foundations of a design system I had been building throughout the entirety of the contract. This living document guided the group, ensuring consistency in the creation of visual hierarchy and individual components including buttons, text and color.
The final swatch of recommended colors, adding more neutral tones for balance and greens for environmental associations
Color was a very pervasive element to our thought processes during the design process. We took Rebolet’s color palette, modified and expanded it as something better. We built upon their existing palette to maintain consistency with their own concurrent redesign work of their backend customer portal which began before our contract.
Within the design system, I focused effort on the creation of a tone guide. At the project outset, I asked our client, “How does Rebolet speak to its customers? What tone of voice does it use?” The client told us it is friendly and curious. Therefore, I aimed to make shopping on Rebolet an experience like that of a friendship. Rebolet speaks to its customers using warm, inviting language. When applicable, the customer’s name is used. Exclamation points are encouraged! Like a friendship, I want Rebolet to be perceived as reliable.
These choices were all purposeful to instill loyalty and foster trust with Rebolet's users.
This decision was purposeful. Informal, conversational language helps to blur the barrier between user and interface, shifting the experience toward that of a more traditional user to user experience received when shopping in-store. It helps increase the sense that the shopper is valued as an individual. The design team consistently strived to find ways to build trust with the customer including examining how language could be used.
Various iterations of responsive designs for mobile devices, from left: home screen, product detail, cart, shipping, search results.
Pushing the work further, the design team was unable to test the mobile responsive designs before handoff. Without getting these flows in front of users, the pain points remained hidden. Testing would help us understand the inherent differences between how users utilize marketplaces on mobile versus on desktop.
Similarly, we would like to test the feasibility of our account flow. In usability testing, we focused mainly on the checkout flow to provide the most ROI for the client. By focusing on what makes a successful checkout process easy and intuitive, Rebolet has the foundational building blocks to pilot success through sales and brand recognition.
The process of creating an account and its benefits are equally important, according to user research. Are we providing reasons for the user to return beyond their initial purchase? Did we offer enough, if any, incentives? Usability testing would serve to illuminate our hypotheses on this.
After having designed the B2C marketplace, the design team was also eager to design a B2B marketplace. We were excited to play with the use of color to create a darker variant of our B2C concept, akin to “night mode” in modern applications, that riffs off our design but remains consistent with both the previous design and Rebolet brand guidelines.
Yes.
We aimed to turn shortcomings into strengths with this design.
By giving her the tools to easily find what she wants, Nadia feels empowered. It makes the shopping experience easy and pleasant, therefore memorable for her.
A shopping experience that stays inside the user’s consciousness means that user is more likely to return.
We focused on highlighting in an upfront manner what makes reselling beneficial, namely price and discounts. Users want to be treated like people, not statistics.
Being upfront with customers creates more trust and loyalty in a customer base because they intuit the company values them as much if not more than the profits.
Integrating sustainability into Rebolet’s brand via message, color and design offers a source of pride and strength to the business model that I believe will only increase with time.
Nadia can shop at Rebolet knowing she is saving money and saving the planet.
This design cemented the mantra “I am not my user” into my consciousness. Plenty of exciting ideas came forth. However, through the use of a MSCW feature sort and consistent reference to our primary persona, I forced myself to confront a simple question: "How does this benefit the user?" While human-centered philosophy is the heart of the UX process, this project forced me to confront it from every angle and allowed me to internalize it. I learned that it is applicable at every stage and tool of the process.
Working with this team was illustrative of why level-setting and building relationships at the outset (through a functional team plan or other means) is so valuable. It creates understanding and sets expectations. Despite feeling I was falling behind, I learned how a design team supports each other through the division of work and shared goals, which above all else, united us in a common purpose.
