A responsive web application developed as part of the Interdisciplinary Integrative Project in Software Engineering II (PITII).
The project explores the development of a complete web experience for a fictional cupcake business, from interface prototyping to the implementation of multiple application pages and user flows.
👉 https://enchantecupcakes.netlify.app/
Enchanté Cupcakes was developed as an academic Software Engineering project with the goal of applying concepts related to interface design, prototyping, web development and application structure.
The project includes multiple pages and user interactions, providing a practical implementation of concepts studied during the Software Engineering course.
Rather than focusing only on the visual interface, the project was structured to explore different stages of the development process, including prototype creation, page organization, navigation and implementation.
- Responsive web interface
- Home page
- Product presentation
- About page
- User login interface
- User registration interface
- Navigation between application pages
- Interactive elements using JavaScript
- Structured CSS styling
- Prototype-driven interface development
- Mock data/resources for development
Front-End
- HTML5
- CSS3
- JavaScript
Design & Prototyping
- UI/UX concepts
- Interface prototyping
- Responsive design
Development
- Git
- GitHub
- Netlify
EngenhariaDeSoftware-PITII/
│
├── css/
│ └── styles and interface components
│
├── images/
│ └── visual assets
│
├── js/
│ └── JavaScript functionality
│
├── mock/
│ └── development/mock resources
│
├── about.html
├── index.html
├── login-page.html
├── produtos.html
├── register-page.html
├── prototipe.png
└── README.md
🎨 Prototype
The interface was planned using a visual prototype before the implementation of the final pages.
This step helped define the visual structure, content hierarchy and general navigation of the application.
The prototype is available in the repository:
🧠 Software Engineering Concepts
This project provided practical experience with concepts such as:
Requirements interpretation Interface planning UI prototyping Separation of HTML, CSS and JavaScript Application page organization User navigation flows Responsive interface development Version control with Git Incremental project development
🚀 Development Process
The project followed a simple development workflow:
Requirements ↓ Interface Planning ↓ Prototype ↓ HTML Structure ↓ CSS / Responsive Design ↓ JavaScript Interactions ↓ Testing ↓ Deployment
💡 What I Learned
This project helped strengthen my understanding of the relationship between Software Engineering concepts and practical front-end development.
Some of the main lessons included:
Translating an interface concept into working code Structuring a multi-page web project Organizing CSS and JavaScript separately from HTML Building responsive interfaces Creating login and registration interface flows Using Git and GitHub throughout project development Deploying a web application for public access
🔄 Future Improvements
Although this project was originally developed for an academic assignment, it can be modernized as my development skills evolve.
Possible improvements include:
Refactoring the JavaScript structure Improving accessibility Improving semantic HTML Adding form validation Improving error handling Creating reusable UI components Migrating the interface to React Adding automated tests Improving performance and SEO
👩💻 Author
Marta Geraldo
Software Engineering | Front-End & Full-Stack Development
GitHub: https://github.com/mggcode
📷 Image Credits
Some visual assets used in this academic project were obtained from:
Freepik Unsplash
All respective image rights belong to their original authors and platforms.
📚 Academic Context
Developed in 2024 as part of the Interdisciplinary Integrative Project in Software Engineering II (PITII).
The repository is maintained as part of my Software Engineering portfolio and documents my development and learning process.
