Project Overview
This is a responsive website optimized for accessibility (image, colors, SEO), scalability, and rapid load time. It features a secure bookstore, dynamic events calendar, and interactive media. The entire site needs to be modular so that we can quickly add additional pages and content.
During the user testing phase, we decided that the site would benefit from a more creative approach. The client shared some additional websites which we used as inspiration for a second re-design. This time, it perfectly matched the client's brand.
Project Research
The Solution
A complete redesign of the site using the UX/UI concept of user flow. We wanted to present this website as not only an outlet for "Dr. E." to showcase her expertise, and share her upcoming calendar events, and media coverage but also to provide visitors with an easy-to-use eCommerce store to support her work.
Coding Stack
The front-end was built using Bootstrap 5, and Sass. While the backend runs on Express, SQL, and Node. The blog section is on the WordPress platform.
The Results
We created a responsive, interactive website focused on promoting her personal brand. We increased visibility on her library of self-published books with our integrated, intuitive shopping cart experience using modals, which work on all screen sizes. We implemented a 3rd party PDF flipbook which gave the site a more interactive feel.
Design System
| Type | Example | Font |
|---|---|---|
| Main Headings |
ABCabc |
Open Sans |
| Sub-Heading |
ABCabc |
Open Sans |
| Paragraph |
ABCabc |
Open Sans |
The Challenge
The original website had been created using Go Daddy's site builder, a CMS platform similar to Microsoft FrontPage. It did not allow for mobile-friendly layouts using complex CSS styling using Grid or Flex-box. There was no structured sitemap or ability to optimize images. Furthermore, there was no way for the client to retain the coded layout of the content as it was displayed.