1. Project Introduction
Title: Development of My New Personal Website
Summary: A personal website built from scratch to highlight my career professional and demonstrate my skills in web design and development.
My Role: Full Stack Designer and Developer
Team and Tools:
- Design: Figma
- Frontend: HTML, Sass, Vanilla JS
- Backend: PHP
2. Context and Problem
Project Objective: Create a personal website that reflects my brand, communicate my professional history and demonstrate my technical proficiency.
Challenges:
- Build a functional and attractive website without using libraries or CMS.
- Ensure accessibility and responsiveness.
- Structure clear navigation for different types of visitors.
Expected Impact: Strengthen my online presence and serve as a central platform for sharing professional projects and content.
3. Design Process
1. Search and Discovery
I reviewed other professionals' websites and conducted informal interviews with colleagues and recruiters to understand specific needs.
2. Problem Definition
Identified key users (recruiters, clients and colleagues) and core business problems navigation and functionality.
3. Ideation
I developed wireframes in Figma and validated the navigation flow with quick tests.
4. Prototyping and Testing
Created high-fidelity prototypes and adjusted layouts after user feedback.
5. Iteration and Refinement
Optimized colors, typography, and responsiveness to ensure an inclusive and responsive experience. functional.
4. Final Solution
Frontend: Developed with semantic HTML, Sass and Vanilla JS.
Backend: Created in PHP to manage blog, portfolio and forms dynamic.
Features:
- Home: Clear presentation with main links.
- About: Highlight for professional career.
- Blog: Dynamic posting system with filters.
- Portfolio: Organized and detailed projects.
- Contact: Functional form with validation.
Differentiators: Unique visual identity, intuitive navigation and focus on accessibility.
5. Results
- 40% increase in portfolio views.
- Positive feedback from recruiters and colleagues.
- 25% reduction in charging time.
"The site is visually incredible and technically impeccable." — Recruiter.
"The responsiveness and accessibility stand out!" - Co-worker.
6. Closing
This project consolidated my skills as a full stack professional and designer, showing my ability to create robust and attractive solutions.
Want to know more? Contact me through the website or social media. Let's talk!