User Flow Diagram

At this stage, I created a simple user flow diagram on how the user interacts with the system and how the business and the system will respond back. I presented this information to the client which was approved.

Wireframes

After creating the user flow and receiving the approval from the client, I created a simple wireframe for the website. The wireframe included the positions of the functions requested by the client. This wireframe shows the home/shop page which is intended to display the products. It shows the basic layout of what the website could look like.

Medium Fidelity Prototype

Sample Title

Sample Text

Sample Title

Sample Text

Wordpress Build (Home/Shop)

After creating the wireframes & prototypes, I presented the designs to the client which they mentioned that it was ideal for the website project. I can now start building the website using wordpress. ​At this stage, I built the initial website's home page to display the products. This version was intended to showcase the website design.

Wordpress Build (Filter)

After showcasing the website itself, I started adding all the plugins which fulfilled the necessary functions and requirements given by the client.

Functions made:

• Filter function
• Checkout request to email
• Login/register

Feedback & Revision 1

As the website is functional, I presented it to the client and received some feedback. 

Changes requested:

• Website inaccessible by public
• Checkout system sends emails to both client's email and business email
• Show prices for tires
• Home button leads to shop page
• Logo in header leads to shop page

Feedback & Final Revision

After creating the revised build, I presented it to the client and received more feedback.

Changes requested:

• Change the hover button color to red from yellow
• Add shipping and billing ability for customers and it must be present in the quote email
• Change checkout button text
• Ability to validate new registered users before making the site accessible