Competitive Analysis (CA)

I was actually going to do Tacos Por Favor, El Texate, or Holy Guacamole, but decided to go with Spitfire Grill because I ate there a few months ago and was surprised at its current state. What was once a favorite brunch spot now seemed to be stuck in the past with no sense of identity. Their current website perfectly reflects this confusion, so let's just jump right into an analysis of their site and then we'll move on to some more contemporary restaurant websites in the LA area for comparison sake.

SPITFIRE GRILL

Santa Monica restaurant located near the SMC Airport campus.

The site almost appears as if someone is in the midst of updating it. It's almost like passing by a construction site that isn't finished yet because they ran out of money. Bouncing around from the main page to the subpages, users encounter two differnt styles: one an attempt at an update, the other a relic of the 1990s. Each style does not relate to–nor compliment–one-another, making the site appear disjointed to the point where users might wonder if they're still on the same site.

And it's not clear if the main page has been completed or is still in progress of being redesigned since there seems to be many things that pose question marks. For one thing, why is it missing a logo even though a hamburger menu is included for the main navigation? Also, why is all of the text in italics? And why so many images of airplanes instead of the restaurant and its food? (Granted, the images are thankfully in a slideshow that can be paused.)

Some other observations

• Hours and contact info is located on the main page, though only at the very bottom.
• They also include a Reservation call to action which takes you to an internal Reservation Form handled by Spitfire Grill.
• The Events page is very dated looking and, unlike the main page, is not responsive. It has a very different design and looks like it was created in the 1990s. For some reason the top nav is located so far down the page that some users may not see it without scrolling.
• Further, the main nav is underlined with a fancy typeface that mars its appearance. All of the events listed are from the past (most from 2016 and 2017). However there is one from August 2018 where a user has asked why the menu for this even is so out of date as s/he wanted to give an updated menu to friends for this event.
• The Menu page offers links to 4 menus that open as PDFs in a new tab. This page suffers from layout issues and is similarly designed like the Events page.
• The Wine Tasting Gallery isn't designed to make their images look attractive or interesting. And I'm not sure why they only have a gallery for a niche event. Why not include a gallery that has images from events, the restaurant, the food?
• Contact us does include a map, hours, and contact information, including a form for comments. It's simply lacking an updated design.

Goals and Target Audience

• Spitfire may still be trying to attract the same customers they served over 15 years ago, but they need to attract a more diverse group of people that spancs several generations. They are located near the SMC Airport campus, and they're across from a very busy dog park and soccer field that attracts a large number of westsiders of various ages. However, I don't think children and families should be their main target since their prices and quality of food should appeal more to adults.
• The goal is to update the look to bring them into the "almost" 2020s.
• Their site should convey a sense of quality food and welcoming decor while also being a bit playful.
• With "spitfire" in their name as well as being located near the Santa Monica airport, they might want to tap into that theme without presenting themselves as a historical museum. There should be a way to capitalize on that in a similar fashion that "New York style" pizzerias sometimes utilize NYC subway design.

CA: BADMAASH

Located in downtown LA, and it serves different kinds of food, but the site interests me so I'm adding it here.

Analysis

• The splash page looks nice, but seems pointless. Why make users click to access the main site?
• Main page is a (mostly) single scroll responsive page.
• Nice mix of color images and negative space
• Combines a clean contemporary feel with some playfulness
• Simple top nav options (4)
• Callout for reservations located "above the fold"
• Contact information located in top area
• Makes the restaurant seem human by adding a very simple story in 3 sentences, 3 images, and a quote.
• Warhol-like Gandhis with sunglasses adds a playful personality to the site and restaurant.
• More detailed restaurant information is located near the bottom (map, hours). Not sure if this is the best place for it, but I don't know where a better place would be.
• The Instagram images added to the very bottom of the page isn't integrated well into the page. Would probably be better to convert the large image near the bottom to a bar of thumbnails or something similar instead.
• Very clean and contrasting typefaces create a clear hierarchy and make it easy to read, skim, and understand.
• STANDOUT: the submenu navigation for their food/drink menu doesn't take you to another page, an image of the printed menu, or to an anchor point down the page. Instead, the food menus appear in the same place depending on which submenu is selected.

CA: SOCIETY KITCHEN

Santa Monica restaurant. Main page with subpages.

Analysis

• Top nav is a bit strange. While they provide a callout for ordering (there are no reservations for them), the social media links are placed here as text. Most users are used to the icons so seeing the text as part of the top nav makes it appear at first to be a subpage of the site.
• The main page is very very colorful, full of images and very little text. It's pretty, but doesn't really convey any useful information. So why do I have to scroll down it so much? Feels like a waste of time.
• Clicking on the submenu items under the top nav Menu link takes users to an image of a menu without any way to navigate back to the site without clicking the browser back button. Very frustrating when you want to view more than one menu (e.g. breakfast vs drinks).
• Contact page is too simple. Might as well include the hours and possibly a map (or link to a map).

CA: BAVEL

LA restaurant, but I liked the style so wanted to breakdown the site.

Analysis

• Animation is a bit distracting but it also gives them personality and makes them stand out.
• Includes call to action near top to encourage reservations.
• Clicking on the Reservations button brings down a pulldown to provide details, then takes those details to OpenTable.
• Unlike Society Kitchen, Bavel keeps the main page simple and clean without making users scroll unnecessarily. And the one item they discuss on the main page (the menu) provides a link To Learn More.
• The Menu subpage looks nice, but it's way too long. They would benefit from the navigation employed by Badmaash where the menu sections are displayed separately through a simple click.
• The About subpage is also long, but that's fine. Anyone going to the About page wants to know something about the backstory of the restaurant. And they've divided up the page into sections so it's fairly easy to scan.
• The Contact subpage includes a map, hours, and contact information for diners, media, and event inquiries.

CA: UOVO

Pasta restaurant in Santa Monica.

Analysis

• Simple top nav (4)
• Appears to be a single scroll responsive page, but the top nav links actually don't shoot users down the page. Instead, they take users to a new page where additional images and information is provided. Unfortunately, the headers for those sections on the main page don't also link to those subpages. At least they could provide a link at the bottom of each section that states "Read More" or something like that. Otherwise, I think many users will miss that additional information, especially on a smartphone.
• Very colorful and clean with lots of breathing room.
• The call to action items are all located at the very bottom of the page. It's strange that they wouldn't have any kind of reservation call in the nav or near the top of the page.
• STANDOUT: Includes link in lower right corner to take user back to top of page.
• Presents their story in words and images to show authenticy.
• Considering how nice the rest of the page is, the bottom area (round "cutout" images and unaligned calls to action) seems a bit out of place.
• Hours and restaurant details are located on the separate "Contact" page.

CA: LITTLE PRINCE

Santa Monica restaurant. Main page with 3 subpages.

Analysis

• Simple top nav (4)
• I really like the minimal text, fonts, and white space. And with all of the white space and minimal text, the color in the single image really pops.
• Keeps the Reserverations option in the top nav.
• All relevant info is right there: Link to Menu and Reservations, Brunch and Dinner days/times.
• The Gallery page is full of colorful and inviting images that give a clear feeling for what it would be like to eat there.
• Biggest misstep is the Reservations page. There's a callout button to Resy on the main page but it's only visible if users scroll down to the bottom. So if a user clicks the Reserations link instead, then they get a page that states bookings are available via Resy... without linking to Resy! And, again, the Resy button is located way down below so users won't see unless they scroll. So, instead, they've provided near the top an active link to email them. Bet they get a lot of phone calls and emails for bookings.
• Runner-up misstep: The menu page retains the lovely feel of the site, but then they include 4 images of different menus that users can't zoom into. Further decreasing the legibility is the fact that they have their enloarged logotype splayed out across each menu.

CA: ASHLAND HILL

Santa Monica restaurant. Only including for the Events subpage.

Analysis

• Aside from the dated events they have listed, this is a more pleasing way to show various events on a website that Spitfire Grill currently lacks. While I don't love this exact layout or typefaces, it reminds me to explore options that group information in a better way for users to easily skim.