Final Product
You’re On It!
Portfolio Project
Project Pages
Flow
The flow of a website is a very important thing when looking at consumer interaction, it can determine whether the website is satisfying and easy to navigate through.
I felt my first website did not have the greatest navigation, starting with the front page, since I put my “about me” below the hero page, I felt the layout looked weird and I was not able to put all the information I wanted to include in a the best possible way.
Problems
Overview
Something that originally started as a class project for a web design class has turned into a passion project that I constantly want to make better and keep up with modern design and UX practices.
Before
1
2
3
Lacking UX elements
Optimization
Issues
Media query
errors
After
Why I chose Figma and Framer
Quicker
All of the tools in Figma and Framer allow you to really create a website efficiently, without the need of any code. Taking out the need to write code you save so much time in the designing process. With Framer becoming more popular, hand coding is starting to look more and more obsolete, at least in the product design world.
Uses My Skills
With how proficient my design skills are in Adobe Indesign and Illustrator and how similar figma is to those apps but focuses more on online uses as oppose to print. I feel I am to create much better designs using figma and exporting those into framer for the interactive elements that not only look better, but also work better.
Less Error
When using code you have a lot of room for error, you could be coding an element for 10 minutes to then realize it’s not going to work in the end, which is just a huge waste of time. But with Figma you are able to very quickly add an element and see if it will work with the flow of my webpage.
Design Thinking
Portfolio needed better optimization and better flow.
Optimization
To help better optimize my portfolio site, I decided to decrease the number of images I have, and where I do have images, I made sure to polish them for the web. I also wanted to add more UX elements seeing as how that is what I am interested, I am able to do that a lot easier and faster with framer, as oppose to hand coding.
Design
Hero/Home Page
About Me Page