CHARLIE HA

Chess Galaxy

Project type:

Website project.

Project description and Reflection:

This project is a Product Catalog for a chess store. Whenever we go to online stores, we see many different product cards. As website designers, we cannot manually create each product cards whenever the store introduces a new product because it is inefficient. The more efficient way is to code and extract the information of those products from the database and make them auto-populate on the website. The purpose of the project is a simulation of that automation but instead of storing and extracting information from the database, I store and extract from Javascript.

--------------

My idea for this project is simulating chess store that sells chess pieces, chess sets, chess clocks, and chess books. The pictures I took online from these stores chessuniverse and chesshouse. My interactive idea is when hovering over the product card, the "Add to cart" button will appear and push the description of the product up to grab attention.

Date:

April 15 - 28, 2024

Role:

Web developer and web designer.

Project highlight:

Product Catalog Project

CHESS

GALAXY

Concept Sketches and Wireframe:

First Product Catalog Sketch
First Product Catalog Sketch
Second Product Catalog Sketch
Second Product Catalog Sketch
Wireframe without Annotation
Wireframe without Annotation
Wireframe with Annotation
Wireframe with Annotation

Reflection:

The feedback I got from the sketch is that the "Add to cart" button color changes from yellow to purple and the size of the images should be cropped to the same ratio to keep them same size on the website.