Designing My Website

See how I brought my website to life using Figma and Webflow.

I've finally made my portfolio website and I wanted to show you my whole process.

First off, I absolutely love Figma. It's becoming my favorite (and go to) design tool. Figma has become my go to tool for designing interfaces to little icons. I've also learned a lot about making low fidelity and high fidelity mock ups before programming them in real life. Figma can take you from brainstorming and organizing your ideas to creating something you can actually test and use.

The first thing I did before designing was establish the mood of the website and added my brand. I use Pinterest to collect images that reflect the look and feel of what I want. My brand is minimalist and modern but also kind of vintage.

View my moodboard here. You won't see a lot of web design*ie things on this board, but photos that establish the feeling.

You can look at the final design on Figma here.

Thinking about my website as a UX designer:

I already had a website out in the web beforehand, so I had a list of things that I wanted to change and what I knew I could do better. Here were my frustrations:

  1. I wanted to better incorporate my brand
  2. I wanted to add design section that was only UX work
  3. I wanted to add all past design work, even print
  4. I wanted the user to feel like they know me and my skills by looking at the homepage

Research:

I looked at many youtube videos and articles that addressed what hiring managers are looking for when evaluating a potential new hire's portfolio. I also watched and read about what a UX designer needs on their website.

After completing the Foundations of User Experience Design by Google, I reworded my introduction and added an "About Me" page.

Users (YOU):

Hiring managers and business owners looking for a designer. *Hey thanks for being here*

The Solution:

Once I had all of my thoughts and ideas on Figma, I began adding them to Webflow. I started with a Tailwind template called Hatch.

I cloned the template and began making changes that would help me build my site. I changed the colors, headers, and overall font to make it easier for me to create my homepage.

This process took me one day to get it all the layers down and a couple of days after to add copy. Overall, the process was seamless and I think it turned out just how I envisioned (minus some minor adjustments that just come with web design).

Introspection:

After working on my website continually, I wish I would have started the design in mobile first. Responsiveness definitely could be better.

What do you think? I'm excited that you are here and I'm able to share all my design process with you.

Later!

Em