role
ux / ui designer | front-end developer
skills
wireframing | heuristic evaluation | prototyping | HTML CSS Javascript
tools
sketch | invision | HTML CSS Javascript
During my junior fall, I took a class, Programmable Usable Interfaces, in which we learned about the intersections between UX design and business, ML/AI, data science, psychology, and many other topics.
Part of the class involved learning HTML, CSS, and Javascript. This is my final project, which utilizes animations and Bootstrap.
Eggspert is an instructional responsive website about eggs. Eggs have always been a big part of my diet and culture, and I thought this would be a fun project to create.
Final Website Here!
Project Demo
Site Walk-Through
- Egg Exploration - On the home page, click on each egg to see different egg dishes, or click on the "reveal all" button to see everything at once.
- Egg Calculator - Input a valid integer of how much time you have to see all the different types of eggs that can be made. Click on the link to access a recipe in another tab.
- Egg Pun Generator - Click on the button to generate a new egg pun.
- Egg or Chicken? - Click on the images of the chick and egg in order to change the opacity.
Screen Mock-Ups
Beginning the project involved creating a series of sketches and wireframes for what I wanted the website to look like.
Prototyping
The final step before coding is creating the prototype using InVision. This would walk through user interactions and the functionality of the website.
Here is the link to the prototype.
