Beatriz Moreto

The Animais Fantásticos project was developed using HTML, CSS Grid, and JavaScript. It includes interactive features such as tabbed navigation, accordions, dropdown and mobile menus, smooth scroll animations, and tooltips. The site also fetches dynamic content from JSON files and external APIs, showcasing event handling and optimization techniques like debounce.

• HTML
• CSS
• JavaScript
• Fetch API
• Promises & Async
• DOM Manipulation
• Animations & Scroll Effects
• Performance Optimization (Debounce)

The Forest project was developed using Tailwind CSS v4, applying utility-first principles to create a responsive and cohesive interface. It features custom themes, color palettes, and component styling with @apply, along with smooth CSS animations and layouts built using Flexbox and Grid. The project focuses on clean organization, maintainability, and accessibility while following modern front-end best practices.

• HTML
• Tailwind CSS v4
• Utility-first Design
• Responsive Layout
• Custom Themes & Colors
• Flexbox & Grid
• CSS Animations
• Best Practices & Accessibility (A11y)

The Bikcraft project is a fictional e-commerce for custom bicycles and accessories. Designed from prototype to code, it was developed using HTML, CSS, and JavaScript with a fully responsive layout to ensure a seamless experience across devices. It includes interactive forms, animations, and user interface enhancements that demonstrate the integration between front-end development and UX/UI design.

• HTML
• CSS
• JavaScript
• UI/UX Design
• Responsive Design
• Accessibility

The Caravan project was developed using Bootstrap 4 to create a modern and responsive travel agency website. It demonstrates how to leverage Bootstrap’s grid system, components, and utility classes to build a professional layout quickly and efficiently. The design includes navigation bars, modals, cards, and responsive sections optimized for all devices.

• HTML
• CSS
• Bootstrap 4
• Responsive Design
• UI Components

The GTA project was developed using HTML, CSS, and JavaScript. It demonstrates how front-end technologies can recreate an engaging and dynamic game interface directly in the browser, combining layout, animations, and user interactions.

• HTML
• CSS
• JavaScript
• Game Logic
• Animations
• Interactivity

The Pokémon project was built using HTML, CSS, and JavaScript to create an interactive experience inspired by the classic game. It showcases front-end development skills through the use of animations, data manipulation, and clean responsive design.

• HTML
• CSS
• JavaScript
• Animations
• Responsive Design

The FlexBlog project was created using CSS Flexbox to design a fully responsive layout that adapts smoothly across all devices. It emphasizes clean structure, spacing balance, and semantic HTML to build a flexible, professional website layout.

• HTML
• CSS
• Responsive Design
• Clean Layout
• Best Practices

The Wildbeast project was developed using CSS Grid Layout to build a responsive, visually organized interface. It demonstrates how grid systems can create complex yet consistent designs while maintaining adaptability and readability on any device.

• HTML
• CSS
• Responsive Design
• Semantic Structure
• Modern Layout Techniques

The Agência XYZ project was built with HTML and CSS, focusing on layout design through Flexbox and Grid. The result is a modern, balanced interface that demonstrates strong visual hierarchy and usability principles.

• HTML
• CSS
• Responsive Design
• UI Layout
• Usability

The Lobo project was designed in Figma and developed using HTML and CSS with a responsive layout. It integrates design and development to deliver a cohesive experience, focusing on accessibility, visual balance, and typography hierarchy.

• HTML
• CSS
• UI/UX Design
• Responsive Layout
• Design to Code