Background: Our mission is to bring great tasting Fortune Oysters to more people by challenging old assumptions and welcoming a youthful audience. We aim to make Fortune products more broadly appealing and available. The site targets two sets of visitors: retailers looking to validate the brand and ensure they’re aligning themselves with the best, and consumers looking to find out where they can purchase and enjoy fresh oysters.
While functional benefits like quality, consistency and flavor are all part of what the brand stands for, it’s the joyful experience of consuming oysters that matters most. We want that same experience to come across when browsing the website.
Design core: The brand’s art direction is based on an artistic style that’s inherently rebellious, youthful and bold-old-school tattoo art. Each element of the brand world and website embodies the spirit of this time-honored style. Treated media like photography, video and illustrations are displayed in muted tones, adding emphasis to the product and presenting them as the hero. The style lends itself to organizing unique layouts to house products, company information and rich media. The incorporation of small Easter eggs while scrolling or hovering—depending on your device—as you navigate the website adds an element of unexpected delight.
Being mindful of Fortune’s ambition to add online purchases down the road, we incorporated commerce patterns that will lend themselves well to this next stage when it comes time.
Process: We aim to design and build every website so they’re easy to maintain on the front and back end. This website is component driven so Fortune has the ability to move blocks to change the order and presentation of its product, add new layouts, and ensure longevity as the website’s content grows over time.
The layering of media, typography and illustrations pushed our development team to ensure consistency between breakpoints. We needed to strength-test all components so that we could be confident that no matter what kind of content gets thrown at it, Fortune can put its best foot forward.
Navigation structure: Our primary navigation focuses on the core objectives of the website, making it easy to learn about the product and get in touch. Since the site’s scope and size didn’t warrant search functionality, we include the full site map in both the sidebar menu and the footer of the site, ensuring there’s always an appealing option to navigate regardless of the visitor’s preference.
Technology: The site’s theme is built on WordPress and utilizes Advanced Custom Fields to ease future content growth. Subtle animations and scrolling trigger effects help reinforce the care and attention that Fortune gives to every aspect of its product from the production line to the final product in the hands of its customers.