Portfolio Instructions for Gammaa 1️⃣ Website Overview Title: Habiba – Personal Portfolio Style: Modern, clean, professional, dark theme (#1E1E2F) with bright accent colors (like pink or purple) for headings, buttons, and highlights. Fonts: Poppins for headings, Roboto for text. Layout: Single-page portfolio with sections: About, Journey, Projects, Skills, Certificates, Contact. Fully responsive for Desktop, Tablet, and Mobile. 2️⃣ Header Displayed at top, sticky when scrolling. Includes
Portfolio Instructions for Gammaa 1️⃣ Website Overview Title: Habiba – Personal Portfolio Style: Moderncleanprofessionaldark theme (#1E1E2F) with bright accent colors (like pink or purple) for headingsbuttonsand highlights. Fonts: Poppins for headingsRoboto for text. Layout: Single-page portfolio with sections: AboutJourneyProjectsSkillsCertificatesContact. Fully responsive for DesktopTabletand Mobile. 2️⃣ Header Displayed at topsticky when scrolling. Includes: Name: Habiba Navigation: About | Journey | Projects | Skills | Certificates | Contact Optional small circular profile picture. Navigation links smoothly scroll to sections. 3️⃣ About Me Section Heading: About Me Content: "I’m Habibaa UI/UX designer and Front-End developer. I create attractiveorganizedand user-friendly web interfaces. I enjoy learning and experimenting with new ideas in practical projects." Include optional profile image. Add a fade-in animation when section comes into view. 4️⃣ My Journey / Experience Heading: My Journey Content: Timeline or cards showing milestones: Started learning HTMLCSSJavaScript to build simple web interfaces. Completed projects: Restaurant WebsiteLogin SystemSimple CalculatorTodo List. Began UI/UX design and created a simple UI/UX project. Currently working on an advanced UI/UX project to improve user experience. Each milestone in visually appealing cards or timeline style with hover effect. 5️⃣ Projects Section Heading: Projects Display projects in cards grid (responsive). Each project card includes: Image or screenshot of the project Project name Project type / description GitHub and Live Demo links (if available) Projects to include: Restaurant Website – interactive website for ordering and menu display. Login System – secure user login system. Simple Calculator – basic arithmetic operations app. Todo List – task management app. Recycling Project – simple project demonstrating recycling ideas. Simple UI/UX Project – small demo UI design. UI Cube Project – 3D or cube-style UI design. Include hover effect showing details. 6️⃣ Skills Section Heading: Skills Display as progress bars or chips with percentages. Skills: HTMLCSSJavaScriptUI/UX DesignFigmaResponsive Design. Animate bars or highlights when section comes into view. 7️⃣ Certificates Section Heading: Certificates Display in grid or slider format. Each certificate: Course name + Issuing organization + optional image. Add zoom-in effect on hover. Include all certificates from Trackin and other courses. 8️⃣ Contact Section Heading: Contact Me Include contact form: NameEmailMessageSubmit button. Include professional profile links: LinkedInGitHubEmail. Buttons and icons should have hover effect. 9️⃣ Footer Include: NameYearCopyright. Optional quick links to sections or projects. 🔟 Design & CSS Guidelines Cleanmodernprofessional look. Shadow effects on cardsbuttonsand projects. Hover effects for projectscertificatesand links. Fully responsive for all devices. Typography consistent and readable. Smooth animations: Fade-inhover highlightsskill bar animation. Use Flexbox and Grid for layout. Consistent spacing between sectionscardsand content. Extras Highlight current UI/UX project in a dedicated section. All images and text should be organized and visually appealing. Portfolio should be fully ready to use after implementationwithout need for further adjustments.
