herbariasoap.com
Herbaria
Natural cosmetics online store · USA
13 desktop screens · 7 mobile · 2024
Marketplace design · 2024
Mokulima
A marketplace for makers from Maui: jewelry, pottery, prints, photo services and a calendar of local events. We designed the desktop and mobile versions, from the home page to checkout, and built the design into CS-Cart Multi-Vendor ourselves.
- Client
- Mokulima, handmade goods marketplace
- Task
- Design for a marketplace of products, services and events
- Platform
- CS-Cart Multi-Vendor
- Mockups
- 21 desktop screens, 15 mobile
- Year
- 2024
Task
The client planned an Etsy-style marketplace for makers from Hawaii. Besides handmade goods, it sells services such as photo shoots and runs a calendar of local events. The mobile version was a priority.
The client gave us a Figma prototype of the home page and a sample product page. We kept the colors of the earlier design and brought the home page in line with the prototype. Then we designed the menu, the product and service catalogs, the seller page, the event calendar, the cart and checkout.
Home page
- Under the header, a row of sections: Maui Made, Services, Best Sellers, Sales, Newest, Promotions and Maui Event Calendar.
- The first screen is a photo collage. Below it, popular categories with large photos on a green strip.
- The “Discover shops in Hawaii” block links to seller pages. The shops for it are picked in the admin panel.
- Next come product strips with ratings and prices, editor’s picks and the blog.
Customer journey
Hover over a screen to scroll through it, or open it full size.
Product page
On the left, the maker with a photo and a message button. On the right, the price, materials and a gift wrapping note.
Seller page
Three shop banners, the owner’s card, a gallery of work, the shop’s story and featured items.
Wish list
Items tagged “Mokulima’s Pick” and “Free Shipping”, with the shopper’s favorite shops below.
Cart
Items are grouped by shop, a bar shows how much is left to a discount, and the order can be marked as a gift.
Services
We designed separate catalog and page templates for services.
Service catalog
Subcategory tiles with photos: Portrait, Wedding, Real Estate, Product. Filters by location, format and price.
Service page
Services are not ordered through the site, so a “Contact shop” button takes the place of the price and cart.
Event calendar
A calendar of local events: a month view with event tags, a switch to list view and a “Submit your event” button.
Mobile version
15 mobile screens, 393 pixels wide. Products sit in two columns, each with a quantity counter and a cart button, and a navigation bar runs along the bottom.
Catalog menu
A menu without images or icons: sections in larger bold type, subsections under them. This keeps it uncluttered.
Early version
The mockup archive keeps the first versions: a home page built around gift collections, a mobile version with shop strips and a menu with icons and a product photo. The final menu has no images.
Mockup colors
- #7AAD95Logo
- #A2AE9DMenu and strips
- #779177Buttons
- #C1B590Blog
- #FDFAF4Page background
More
More projects
All design projects
Previous
Next
We will find solutions for everyone!
Share your idea and we’ll offer an optimal solution
