Case Studies

KoffeeGeeks Cafe

KoffeeGeeks is a local coffeeshop located in Circleville, Ohio. Owners Jodi & Mike have other successful locations in Laurelville and Lancaster, Ohio, and saw a wonderful opportunity for success within Circleville.

The original website left much to the imagination with noticeable gaps in the overall design as well as many opportunities for more accessible design choices. A fresh, contrast and color blindness friendly palette needed to be put in place, a new font type and style to replace the original which was too small and light in color making it hard to read. And there were too many over-sized images that took over the pages and overpowered the accompanying bodies of text.

Various websites from neighboring shops were observed to note which features seemed to work well for their business and were taken into account. Color contrast and color blindness checkers were used to ensure the colors were accessibility-friendly and were complimentary to one another.

Chef YumYum

Chef YumYum is a fictional company who crafts and delivers meals and recipes for their clients. They also help their clients craft their own recipes based off of their favorite ingredients, and also provide ready-to-go recipes.

The original site had no set layout for any of the sections on the page, and needed to be revamped in order to be more legible, user-friendly, and more appealing to look at.

Each section was redesigned so that there was a set layout, color scheme, and appropriate color contrast for accessibility. Each part of the page was designed so that it was evident to the audience that they were scrolling into a new section on the page, the Recipes section was also given a grid layout so that they were seamlessly grouped together in a more organized manner.

Responsive Styling & Accessibility

This is a fictional webpage used to demonstrate various aspects of accessible styling such as color contrast, font style & type, button sizes, and cursor styles.

Google Fonts was used to select the different font types and styles that would be used in each variation. Adobe Color was used to choose colors that were the appropriate contrast, easy research was conducted to find the proper button sizes that would communicate the appropriate level of importance, and the same was done to find the proper cursor styles.

Want to learn more?