Web Portfolio

Trifecto Bar

Trifecto Bar

Project Description

Trifecto Bar is a small business that offers a variety of sandwiches, coffee, and craft beer. The establishment is located in a shared kitchen so their branding is not readily seen from the street. The business relies on website traffic to display its products, reel in customers, and invite customers to make purchases online. Recently, Trifecto had gone through a rebranding and wanted its website to reflect the changes.

two people sitting at the bar with drinks


Trifecto recently underwent a rebranding, adopting a sleek capital T graphic as their logo along with a new slogan, "All Day Cafe." The clients wanted to feature this new branding on their website, incorporating a new color scheme of black, white, and beige.

Given the increased importance of online ordering during the COVID-19 pandemic, a significant portion of Trifecto's customer base relies on this method for their purchases. To cater to this trend, the clients emphasized the need to prominently feature online ordering on the website.

In addition, the clients sought to enhance accessibility by opting to display the menu in text rather than images. This adjustment aimed to make the website more user-friendly and inclusive.


The clients shared they wanted a more modern approach to their website, featuring graphic colors like white and black while using beige to be warm and inviting. The encircled logo serves as a focal point, and the clients emphasized the importance of incorporating this graphic detail consistently across the website. Rounded corners on images, buttons, and graphic shapes echo the design elements of the new logo.

A distinct pattern, custom-designed for Trifecto, takes center stage in the heading of most pages. Depicting drawings of the various food offerings, this pattern contributes to an inviting and homey atmosphere, adding a personal touch to the overall vibe of the site.

trifecto pattern

User Experience

Trifecto relies on third-party platforms for its online ordering and delivery services. On their previous site, the linkage to online ordering within the menu was unclear, featuring wordy headings and lacking a dedicated landing page on the Trifecto site.

The clients wanted online ordering to be at the forefront of the new site. To achieve this, the home page prominently features a button for online orders, and all online ordering links are conveniently consolidated on a single page within the Trifecto website. These buttons clearly indicate that the ordering process will take place on a third-party site.

The establishment of a dedicated page for online ordering, complete with clearly labeled links, has significantly enhanced the overall user experience of the site.

trifect home page


In the previous iteration of Trifecto's website, the menu was presented as a PDF image, posing challenges for text readers. Recognizing the importance of accessibility, the clients emphasized the creation of an all-text menu that would be visually appealing to a broad audience.

To achieve this, the menu underwent restructuring, organized into clear sections and subsections. Quick links were strategically placed at the top of the page, facilitating swift navigation for customers utilizing text readers. With the entire menu now presented in text format, accessibility has been significantly improved, ensuring that all users can access the information easily and efficiently.

trifect menu page


In summary, Trifecto Bar's website overhaul successfully captures the essence of its recent rebranding, featuring a sleek logo and a vibrant color scheme. Prioritizing user experience, the design incorporates modern elements, a dedicated online ordering section, and a visually appealing, all-text menu for enhanced accessibility. This comprehensive update reflects a commitment to adaptability and inclusivity, ensuring a seamless and inviting digital experience for all visitors.