Skip to main content

Personal Portfolio Website

I build a modern and interative portfolio website using React to showcase my skill, projects, and experience.

Visit website
  • Art Direction
  • UX and UI Design
  • Front End Development
  • Motion Design
The aero lesson builder app dragging an audio component into a screen about plant cells.

The problem

I developed a modern and interactive portfolio website using React to showcase my skills, projects, and experience. The application is fully responsive and designed with a focus on clean UI and smooth user experience. Through this project, I strengthened my frontend development skills and gained a deeper understanding of UI/UX design principles.

A set of dark themed components for the aero design system

Design & Development Approach

To build this portfolio, I focused on creating a clean and consistent design system. I used reusable components and maintained a responsive layout to ensure a smooth user experience across different devices. The goal was to make the website visually appealing while keeping it simple and easy to navigate.

The homepage of the aero design system docs website linking to principles and components.

Design system docs

A design system is useless if no one knows how to use it, so we put together a comprehensive documentation website to cover principles, ux, accessibility, and component guidelines for designers and engineers working with the system.

A dramatic ocean scene with lava forming a new land mass.

Motion design

Animation was a core principle in making the authoring experience a more understandable process. Elements animate in ways that indicate the cause and effect of each interaction to improve the fluidity of the overall experience.

Encouraging adaptivity

A major part of solving for collaboration was being able to visualize the learner experience in the editor. This was especially beneficial for subject matter experts and instructors need to review and give feedback on the higher level structure without having to dig through all of the adaptivity scenarios screen by screen.

A drag and drop storyboard style editor for creating an adaptive lesson.

Key Features of My Portfolio

This portfolio website includes key features such as a responsive design, smooth animations, and a clean user interface. It showcases my projects, skills, and contact information in an organized and visually appealing way. The goal was to create a simple yet professional platform to represent my work effectively.

Configuration options for a component.
Configuration options for text.

Building Modern Web Experiences

I design and develop modern web applications with a focus on clean design, performance, and user experience. My goal is to create engaging and responsive websites that effectively showcase ideas and projects.

Interactive Web Experience

I used modern web technologies and animations to create an interactive and engaging user experience. The 3D elements and smooth transitions make the portfolio visually appealing while keeping it fast and responsive.

Interactivity

Learners can then be directed to specific parts of the model and shown labels. They’re also able to click and drag to orbit around and freely explore at any time.

Animation

I implemented smooth animations and transitions to enhance the overall user experience. These animations make interactions more engaging while maintaining performance and responsiveness across different devices.

Project outcome

This project helped me strengthen my frontend development skills and improve my understanding of modern web design. I gained experience in building responsive layouts, implementing animations, and creating a clean user interface. It serves as a strong foundation for my future projects.