MY WEBSITE
July 2019
I wanted to make an online website to host selected works from my portfolio. My goal was to make a simple, and clean layout that was responsive for both web and mobile.
After hand sketching my ideas, I used AdobeXD to design and layout the pages. Each of the selected works has a theme color, so I decided to keep a monochromatic theme for the rest of the site so that the different colors do not compete.
Process
Process Sketches
Landing Page Iterations
In order to reduce the complexity of building the site, I wanted to create a singular template and structure that I can use for each of my projects. The following selected iterations were created in AdobeXD.
Project Page Iterations
Web
Elements
Development
Once I was satisfied with the look of the site I shared my wireframes with the developer via Adobe XD and Figma. The scaffolding was built by Rehan Butt using Jekyll and the Foundation CSS framework. Once the framework was established I was able to make minor edits and additions since a lot of the design components are repetitive across the projects.
Complex issues with coding were outsourced to David Baker via sharing the website's repository. Most of our communication happens through Github's interface.
After the website went live for a few weeks, I utilized web analytics to help inform how I improved/modified the site. For example, my cookie cutter project was one of the last pages I uploaded chronologically, however it had the most page visits overall. So I added more images and info onto that page to demonstrate additional skills to the visitor.
User Flow
Regional Traffic