Stan Dottori, Tattoo Artist
This project involves the development of a web application for a popular tattoo artist based in Lyon, Stan Dottori. The goal is to provide an online portfolio and booking system, allowing clients to view Stan’s work, learn about his style and what tattoos are available to be “inked” (flashes).
Front-end :
The user interface is build with Twig template, and the animations are entirely built using CSS, inspired by tutorials from Kevin Powell and others. JavaScript is used only for the calendar feature.Back-end :
The core functionality is powered by PHP with the Symfony framework. Data is managed using Doctrine with MySQL as the database system.Development Tools:
Composer is used for PHP package management, and Yarn is employed for JavaScript dependencies.Admin Panel:
The admin interface is powered by EasyAdmin, which simplifies the management of content for the tattoo artist.File Uploads:
The application uses VichUploader to handle file uploads, making it easy for Stan to upload and manage images in his portfolio.Database Modeling
The database structure for this app was designed using the MERISE methodology, ensuring a robust and scalable architecture. The process involved:MCD (Conceptual Data Model): This step focused on defining the entities, attributes, and relationships required to model the moods and user interactions effectively.
MLD (Logical Data Model): The MCD was then translated into a more structured format, outlining primary keys, foreign keys, and detailed relationships.
MPD (Physical Data Model): Finally, the MLD was converted into the actual implementation in MySQL, optimizing the tables for performance and reliability.
Wireframes, Mockups, and Prototypes
To ensure an intuitive user experience, the interface design went through several stages of development using Figma:Wireframes: Initial low-fidelity wireframes were created to outline the basic structure and navigation flow of the application.
Mockups: These wireframes were then enhanced with color schemes, typography, and UI elements to create high-fidelity mockups that reflect the final look and feel.
Prototypes: Interactive prototypes were developed to simulate the user journey and test the overall usability before implementation.