Product Design : Simple e-commerce app

This is a simple e-commerce website that I have designed and developed for a project during my university studies. This illustrates a fictional store for an organic products manufacturer containing both product presentation and product ordering.

I have created an Activity Diagram and a customer Use Case to briefly present the product ordering flow.

Next, I will present the developments and some recommendations on how to improve the webpage.

Homepage

Contains:

• Name of the company and address

• Navigation bar with the pages

• A carousel with representative pictures (products, physical store)

• A footer with copyright information

Other recommended improvements for the homepage:

• A carousel with active promotions or a list of them

• The list of most sold products

• A carousel or list of customer testimonials

• Any guarantees (for example, free delivery, pay with credit card, free returns)

About us/ Our mission

Contains:

• A short description of the company

• Meet the team (their picture, name, if the customer would like to connect with the vendor for a query)

Other recommended improvements for the about us/our mission page:

• A carousel or list of customer testimonials

• Statistics such as number of orders, happy customers, ratings

• A list of the company awards (if any), for example: best e-commerce website in 2018, organic certified company etc.

Product page

Contains:

• list of products, one by one in an infinite scroll, with their name, picture, short description, price

• Add to cart button for each product

Other recommended improvements for the product page:

• Search bar

• Filter by different categories displayed on the left page, for example product type (sweets, breakfast, diary)

• See as grid or one by one

• A carousel with recommended products based on the most sold items, random items, what it is bought right now. After a customer has added a product to cart, the system can recommend similar items from the same category or other. This requires the implementation of a recommendation algorithm - subject to be covered in a future post.

Contact page

Contains:

• a map of the physical store location

• contact details such as phone and email

• a contact form to directly send an email to the company

Other recommended improvements for the contact page:

• some frequently asked questions, for example about delivery, how to pay, how to buy, returns, international delivery

Technologies used: HTML, CSS, Bootstrap, PHP, MySQL.

Notes:

This is a fictional design produced by myself, any resemblance to actual applications is purely coincidental.

The views and opinions expressed here do not reflect those of my employer or any other 3rd party I might associate with.