SEG 3125 React Project

As part of the SEG3125 course, I lead a group completed a series of labs (Lab 1–10) that progressively explored web development, usability design, client/server interaction, and modern frameworks.

Lab 1 – UI Survey Website

https://seg3125.lab1.tonyxyz.com/survey.html

Built a static survey page using HTML/CSS to evaluate a website’s interface.

Designed form inputs (text, radio, checkbox, dropdown, comments).
Applied consistent styling with external CSS.

Lab 2 – Adaptive Online Grocery Website

https://seg3125.lab2.tonyxyz.com

Developed a dynamic grocery shopping site with JavaScript.

Personalized UI for different users (vegetarian, gluten-free).
Implemented price sorting, dietary filtering, and cart functionality.

Lab 3 – Alternative Grocery Website Design

https://seg3125.lab3.tonyxyz.com/

Created an alternative design for the Lab 2 grocery store.

Improved navigation and structure (categories, better wording).
Added product images to assist user decision-making.

Lab 4 – Service Shop Website with Bootstrap

https://seg3125.lab4.tonyxyz.com/

Designed a hair salon / bike repair shop website using Bootstrap.

Focused on usability principles: visibility, mapping, affordance, consistency.
Built a mobile-first one-page layout.

Lab 5 – Enhanced Service Shop Website with jQuery

https://seg3125.lab5.tonyxyz.com/

Expanded the Lab 4 service site with jQuery and usability principles.

Added service selection by professional and credit card input.
Used input validation, tooltips, and icons to reduce cognitive load.

Lab 6 – Survey Analysis with Node.js

Developed a server-side survey analysis app using Node.js, Express, and EJS.

Collected and analyzed survey responses from Lab 1.
Implemented participant and analyst views.
Improved survey UI with Bootstrap.

Lab 7 – Website Design with Usability Heuristics

Created a prototype design for a website of my choice.

Applied 10 usability heuristics with sketches/wireframes.
Built a semantic network of domain concepts.
Focused on interactive processes (e.g., exploring, planning, communicating).

Lab 8 – React Implementation (Part 1)

https://seg3125.lab8.tonyxyz.com/

Began implementing the Lab 7 design using React (or React Native).

Built core UI components aligned with heuristic design.
Demonstrated early functionality in a video walkthrough.

Lab 9 – React Implementation (part 2)

https://seg3125.lab9.tonyxyz.com/

Completed the React/React Native app.

Made the site bilingual (internationalization).
Ensured UI elements addressed each usability heuristic.
Conducted a heuristic evaluation walkthrough.

Lab 10 – Service Chatbot with Dialogflow

Developed a service chatbot as an alternative to traditional menus.

Implemented intents (welcome, fallback, thank you, get service).
Extracted entities (service type, staff, date, time, contact info).
Explored conversational UI design with Dialogflow.

Page updated

Google Sites

Report abuse