Croque is a restaurant specialized in grilled cheese sandwiches, focused on making different kinds of grilled cheese sandwiches inspired in flavors from the world. For Croque, the goal was to create a website design considering the essence of the place, that allowed users to create as many customized products as they wanted to, without getting confused.
Croque es un restaurante especializado en sándwiches de queso a la parrilla, que se enfoca en distintos tipos de sándwich de queso inspirados en sabores del mundo. Para Croque, el objetivo era crear un diseño de página web considerando la esencia del lugar, que permitiera a los usuarios crear tantos productos personalizados como quisieran, sin sentirse confundidos o abrumados.
Food & Drinks
Grilled cheese sandwiches that clients can customize, with different kinds of bread, vegetables, cold meats and proteins, and vegan cheese options. The restaurant also offers wines, sodas and beers.
Target Audience
Young adults (college students and recent graduates) from all fields and backgrounds, that identify themselves as foodies. They’re passionate, curious, outgoing and enjoy trying and creating new dishes.
Audience’s Values
Climate awareness, special interest in local produces, traveling, fair trade, freedom of speech and equality.
📓 Strategy
To clarify the key parts of the design, I considered the user needs and then the functionality requirements related to each need. After that, I arranged a sitemap connecting all the single screens required to do this.
User Needs
- Find out schedules and table availability at the restaurant
- Know more about ingredients used (verify allergens and product origin)
- Order customized products
Functionality Requirements
- The user will be able to browse all products
- The user will be able to know details about ingredients
- The user will be able to order an unlimited ammount of products
- The user will be able to personalize all products
📍 Sitemap
🖥️ Wireframes
Considering user needs and functionality requirements, I assembled wireframes using the tool Balsamiq to have a broad idea of how could content be arranged.
👁️ Moodboard
To have an idea of the look & feel of the website, I created a moodboard inspired in french posters and restaurants, creating an image that is both colorful and bright, but clean and a bit romantic too
⚡ Final result
💄 Look & Feel
I picked a colorful yet not too bright color palette inspired in the french poster style, with a bold serif font that mimics the lettering
📝 Ordering process
The user can choose each product individually, customize it in the specific product page, and then see the full order details in each step of the process, making sure the order is correct until the last moment
🍅 Detailed information about ingredients
Since the target users care about the origin of the products they purchase and fair trade in the food chain, for each group of ingredients they’ll be able to see a quick summary of seals, information and related allergens
🌟 Conclusions
The most challenging part of the project was putting all the information in place, without keeping the screens too crowded and making sure the image was consistent through all screens, which I did by maintaining consistent styles and handling the color palette, adding pops of color, without making it too overwhelming. What I liked the most, was working on a theme I’m really passionate about. It was perfect quick project for a foodie 😊
