Chez-Natalie Web-App: Full-Stack Digital Solution

Context

This project was the centerpiece of the SKIL2 course. Our challenge was to inherit Figma designs and database structures from three different student groups and merge them into one cohesive system. We transformed these separate concepts into a fully functional, end-to-end web application.

What We Built

We delivered a comprehensive architectural plan and a live application, including:

• Unified Use Case Diagram: A complete map of all user journeys and system interactions.
• Interactive Figma Prototype: A high-fidelity, clickable model of the final user interface.
• Functional Web App: A production-ready platform featuring all planned business logic.

Why We Built It

We built Chez-Natalie to bridge the gap between abstract design and technical execution. The goal was to prove that fragmented ideas from different teams could be integrated into a single, seamless user experience. By focusing on database integrity and feature prioritization, we ensured the final product wasn't just a collection of pages, but a robust tool capable of handling real-world data and user needs.

How We Built It

We managed the project using the SCRUM methodology, breaking the development into four distinct sprints:

• Sprint 1: Built the foundational database schema and core architecture.
• Sprint 2: Developed the "Must-Have" features to establish a Minimum Viable Product (MVP).
• Sprint 3: Integrated "Should-Have" features to expand functionality.
• Sprint 4: Focused on bug fixing, UI polishing, and final performance refinements.

My Personal Contribution

I took on a dual role during this project to ensure both technical progress and team organization:

• SCRUM Master: I facilitated our daily stand-ups and managed the sprint backlog to keep the team on schedule.
• Backend Development: I focused on the server-side logic, ensuring the database communicated correctly with the frontend.
• Task Execution: Outside of my leadership role, I picked up general development tasks from the backlog to support the team wherever needed.

Tech Stack

• Design: Figma
• Modeling: StarUML
• Development: TALL-stack (Tailwind CSS, Alpine.js, Laravel, Livewire)

Key Takeaways

This project taught me the importance of agile leadership and code integration. Acting as SCRUM Master showed me how to keep a team motivated through technical hurdles. Technically, I learned how to work with existing codebases and designs, which requires a high level of flexibility and problem-solving.