A case study in web design: Tia Yanet - Brooklyn, NY
Turning an up-and-coming food cart into New York’s next big street food.
MY CONTRIBUTION
Research, Ideation, Branding, UI/UX, Photographs, Visual Design, Content, User Testing, Web Development
DELIVERABLES
Final Site & All Content, Wireframes,
Hi-Fi Mockups, User Testing, Logo Development, Photography
TOOLS
Figma, Adobe Illustrator,
Squarespace, Midjourney
DURATION
1 Month
WHAT IS TIA YANET TAMALES?
Tia Yanet Tamales is a small family-run food card that sells homemade tamales and other Mexican food stuffs in Brooklyn, NY. Yanet, the owner, matriarch, and head chef of the business is hard-working, devoted to her product and brand, and highly aspirational.
As a local to the neighborhood myself, I had gotten to know Yanet and her family as I had found myself constantly drawn back to her delicious and comforting tamales. Having started her business only a few years ago, I discovered that Yanet was eager to expand and grow her brand. I proposed helping her to craft a website to broaden her client-base and improve her business’s visibility.
DISCOVERY
RESEARCH & INSIGHT
Street food vendors in NYC are as much of a staple of daily life as the subway. As a New York native myself, I grew up in the era of hotdog carts that sold pretzels and knishes as well. Over the decades the once mighty hotdog cart has become a much rarer almost niche sighting on the streets of NYC, almost relgated to only the most touristy areas. Halal food carts and trucks that boast a much broader number of menu options and more full meals became much more prevalent over time. This led to an even more diverse plethora of types of food carts and trucks that we in NYC are lucky enough to expereince the diversity of today.
Tamales have yet to have their day in the sun as NYC’s next big scalable street food but they meet many of the criteria I believe that on a large scale could make them so.
They are: cheap to make, cheap to buy, easy to mass produce, easy to transport, come wrapped up in corn husks making them potable for the customer, come in many varieties, and perhaps most importandtly, delicious.
Salsa Verde
Dulce (sweet)
Pictured above: 3 varities of Yanet’s tamales. A tamale is a traditional Mesoamerican dish made of masa, a dough made from nixtamalized corn, which is steamed in a corn husk or banana leaves. The wrapping can either be discarded prior to eating or used as a plate.
Guajillo Pork
DEFINITION
SYNTHESIS OF RESEARCH & IDENTIFICATION OF FOCUS AREAS
I began my research by compiling a list of competitors, both direct and indirect, and looked into their web practices. A moodboard was created and I walked the Fragole team through current web trends and practices. They wanted their rebrand to be elegant, modern, and minimalistic. These values needed to be reflected from the moment someone landed on the homepage. Looking at my research, I agreed this rebrand strategy was the route for them.
MOODBOARD
I worked with the clients to identify the tone and approach they liked in local competitors.
Grayscale Wireframes for Desktop
Simplify, simplify, simplify was the rebrand goal for the lo-fidelity wireframes. Everything clean, easy to see and access, and without an overabundance of images to overwhelm the user.
DESIGN
IDEATION AND BRAINSTORMING SOLUTIONS
I pooled all the content I could between competitor websites and the goals of the clients and subsequently trimmed everything down as much as possible into the final product. I envisioned a clear, succinct website. Additionally I developed the assets and imagery to capture the essence of Fragole in a digital space.
I drew sketches to give the clients an overview of my recommendations and we talked through each page of the agreed-upon site map. Heavy emphasis was placed a clear list of goals and changes for the rebrand. Many of the issues requiring solutions existed on both Fragole’s current website as well as on competitors’ websites. These issues included the following: too many pictures of food, an overly lengthy homepage, poorly functioning UI, unnecessary customer testimonials, extraneous details about the restaurant, difficult to find information about hours/location, outdated and misplaced menus, overuse of different fonts, clashing color schemes, typos, and low image resolution.
I completed a large survey with questions for the respondents pertaining to many of these issues. Based on the survey results, along with my research and goals, we decided on the following:
1. A short and condensed homepage with one image only.
2. Elimination of customer testimonials.
3. Two short blurbs about Fragole, one on the home page and one in the “About” section.
4. Prevalent and prominent hours/location postings on each page.
5. A complete revamp of the menu style to incorporate the new logo and gold/white/silver theme.
6. A select number of colors for the website. White background with light gold, dark gold, silver, and black fonts only.
7. New hi-resolution images of food, with food images being placed on the menu page only.
8. A short but succinct “About” section detailing the backgrounds of the owners and head chef as they each have fascinating personal stories and long histories with Fragole and the neighborhood community.
DELIVERY
INCORPORATING THE SOLUTIONS AND BUILDING THE WEBSITE
Taking into account the needs of the clients, the needs of the users, the survey results and all research conducted, the final site was developed and will be going live in spring of 2024. Below, one can find the before and after images of key pages.
Homepage
Before
After
Menu
Before
After
Each menu section now links to a menu PDF, ex below:
Specials
Before
After
LOGO REDESIGN
The word “fragole” means strawberries in Italian. The old logo was problematic in that it only had one strawberry (as “fragole” is plural), the strawberry itself wasn’t necessarily recognizable as a strawberry for many users, and users were confused as to the spoon silhouette and its relevance to an Italian restaurant.
Old Logo
New Logo