UX/UI Design & Branding

BRTR

BRTR (say it "baar-tr") is a platform where artists trade handmade work with each other as well as sell it. My capstone for the Thinkful UX/UI bootcamp, built in a three week sprint from conversations with working artists.

The BRTR website shown on a laptop, with a grid of handmade goods from local creators.
Project
Capstone, Thinkful UX/UI bootcamp
Role
User research, UX/UI design, branding, graphic design
Timeline
Three week design sprint
Prototype
Open in Figma →

Help artists sell in a world that moved online

I started by talking to artists and creatives about what felt hardest coming out of the pandemic. The same answer kept surfacing. Art fairs, popups, and in person shopping had thinned out, and selling had moved somewhere crowded and impersonal. Many of them also missed their community of fellow artists.

So the question became: can we make a way to consume ethically and support small makers nearby? BRTR is my answer. Artists trade work directly with each other, buyers can shop from them too, and every cent goes to the artist.

Learn from what already exists

I pulled apart Etsy and Simbi, a site for trading services. Etsy gets plenty right: a clear mission, obvious calls to action, and categories that make browsing easy. It also shows pitfalls worth designing around. The homepage overwhelms with information, the videos pull focus, and the marketplace is crowded with bulk and third party items far from handmade.

Then I ran surveys and interviews, partly to test the idea and partly to decide what to build. Two things came back loud and clear: people want to know how much of their money reaches the artist, and community is the very heart of why the whole thing works.

Survey finding

17 of 20

said they'd barter handmade goods with other creatives.

From an interview

"All proceeds should go to the artist."

This line shaped the business model as much as the copy.

Two people I kept designing for

Johnny, 28, makes art and just moved to a new city. He wants recognition and trades with other artists, but markets near him are seasonal and he dreads marketing himself online. Melissa, 41, wants to buy handmade and local. She's disabled, so reaching markets to find small merchants takes real effort.

Between them, four needs outranked everything else and became the spine of the build:

  • Make a fair trade with another user.
  • Buy directly from creators.
  • Trust the person on the other end of the transaction.
  • Talk to that person easily.

Sketch first, Figma later

I brainstormed on paper before opening Figma: what the brand should feel like, what the mark could be, and how a trade would work as a screen. The trade was the puzzle. Both people have to accept before anything goes through, and that one rule ended up shaping the entire flow.

A handwritten brainstorm page working out the brand direction, with words like idealism, vintage, textural, bold, future and community centered circled and connected.
Finding the words first. Before any visual, a page of scribbling about what the brand should stand for. "What could society be?" carries the whole mood from the corner.
A page of hand-drawn BRTR logo explorations built around linked and looping forms, annotated with the words community, connection, art, exchange and trade.
Drawing the mark. Logo studies chasing one idea: two things linked together, since the whole product is an exchange between two people.
A hand-drawn wireframe of the BRTR item page, with a note reading 'both must accept for transaction to go thru'.
The rule that shaped the flow. "Both must accept for transaction to go thru," written on the sketch before it existed anywhere else.
The BRTR user flow diagram, mapping the path from the landing page through discovering creators, signing up, and browsing.
Then the map. The user flow from landing through discovery to sign up, so the sketches had a structure to sit inside.

A style tile before a single screen

Bold, idyllic, community, futuristic. I set the palette, the textures, the type and the core icons in one tile first, so every screen after it had a single source to answer to.

The BRTR style tile: a red torn-paper texture, a grid of palette swatches in olive, plum, orange and sand, the trade and cart icons, primary buttons, and the heading and body typefaces.
One page to answer to. Palette, textures, buttons, icons and type in a single tile. The torn paper and the gradient are the two notes that give it a handmade, hopeful character.

What it became

Four screens carry the idea. A home that leads with trading, a mission page that says plainly where the money goes, a product page where messaging the maker sits level with requesting a trade, and the trade request itself, where you set your work beside theirs and both sides agree.

The BRTR home screen: 'Welcome to Barter, a platform for creators to trade work and for humans to support creators', above rows for featured creations, creators near you, and services offered near you.
Trading comes first. The headline sells the trade before the shop, and "creators near you" puts the local part above the fold.
The 'What is BRTR?' page, with columns on community, supporting creators and ethical consumption, and a line reading 'At BRTR 100% of proceeds go to the artist'.
Say it in public. Interviews said transparency builds trust, so the split lives right in the mission statement for everyone to see.
A BRTR product page for a ceramic candle holder, with message seller, request trade, add to cart and save for later actions, plus the seller's story and shop policies.
Trade sits level with buy. Message, trade, cart and save share one row, so bartering feels every bit as natural as buying. The seller's story sits right underneath.
The BRTR trade request screen, pairing the item being requested with an item from your own shop, above a send request button.
The trade itself. Their item, your item, one button. The request completes the moment the other person accepts it.

Prototype

Try the trade yourself

The real Figma file, start to finish. It loads the moment you press play.

Play it yourself. Browse the shop, open a listing, put one of your pieces against theirs and send the request. The same path a real person takes, in the order they'd hit it.