Rye Restaurant Website Design – Case Study

Rye Restaurant Website Design – Case Study

Rye Restaurant and the chef-owners Megan and Colby Garrelts are well known around the Kansas City community. With now three restaurants and many awards, including Colby being named 2013 James Beard Foundation Best Chef: Midwest, they wanted to conquer something new. They came to us wanting to update their website for Rye KC because they were about to open a new Rye restaurant on the Plaza.

When they first approached us in June of 2016 they wanted our thoughts and ideas of what they could do. How could the website be structured to showcase both Rye restaurants but not confuse the viewer. We came up with many ideas but the best was to have a single page layout with all of the information on it for one restaurant.

Once we had this main idea down we made a proof to show what it could look like. We then met with Susan, the events manager at Rye, to discuss exactly how things could look. We went piece by piece and drew up a new design of what they liked and what they would like to see. There were certain pieces we had to make sure stood out, like the viewer knowing which restaurant they were looking at. Our designer came up with an updated proof and they loved it.

The next step was building the site and adding in content. We built the site on a staging server and through the process of building the site and quality assurance testing we found some issues. The menu was hard to look at with multiple pages and the hidden scroll. If the viewer did not know the scroll was there then how would they know that there was more to the dinner menu? We found a solution by creating pop-up menus with a lightbox feature. This way they could see at the right of the screen that there was another page and could click on that to view.

Another issue was the gallery. While it looked nice with all of the blocks and how we adjusted our plugin to have a hidden scroll so that all of the images did not show, it was bothersome. If your cursor was in the middle of the page you would have to scroll through all of the images before being able to move down the page. To make things a little easier, we moved it lower on the page and made it slightly smaller.

To address the location of which restaurant the viewer was looking at we made sure to have two different images at the top of the page. This also had different logos, Rye Leawood and Rye Plaza large and centered. We still kept a Leawood and Plaza button at the top of each for easy access at the top of the page to switch back and forth. We also named each team so that you know who works where, along with having Leawood or Plaza in the reservations so that you knew where you were reserving your table. And lastly, at the bottom of the page, we added links to the other restaurants with their given logos for easy access.

In the end the website went live and everyone was happy. While there were some minor hiccups along the way, the website turned out great. This website was a big adventure for everyone involved, and it was an exciting project to work on. Seeing it fulfilled to the very end is always a wonderful feeling as a designer. View the website at ryekc.com and swing by for a savory bite!