Published on <a href="https://blog.prototypr.io/portfolio-redesign-1-4-the-precedent-study-c0609b4dae51?source=rss----eb297ea1161a---4">| Prototyping: From UX to Front End &mdash; Medium</a> Mike Heighway 
This is an ongoing project and I will be adding relevant content throughout the process. The main goal here is to document my design process for both myself and for others who may be interested.
Recently, I opted to redesign my portfolio. It’s an ongoing project, and certainly isn’t complete. My desired outcome is to have a site that is easy for me to update, within a visual system that reflects my design opinion. There are probably varying stances on the matter, but I am from the camp that this project should be handled no differently than one for a client; but due to some constraints it was necessary to shift slightly to be a design/build project. It involves 4 main stages: research, programming (the design kind, not the development kind), design/build, and refinement. This post focuses on my research.
<img alt="" src="https://cdn-images-1.medium.com/max/1024/1*9ApVZUlndR_62uray7AFAg.png">Excerpt from my portfolio site.
Redesigning a portfolio site is no small feat. The process can be long and tedious, particularly if you are a design professional, already working in the field. I think I easily could spend 120 hours on this project, so this process needed to be optimized for efficiency. Full-time employees don’t have the “luxury” of freelancers in the sense that we can’t simply block out three or weeks straight to work on our project. Luxury is in quotes because being a full-time freelancer is not easy, unless you are well-established. The point to take away here is that if you are a full-time employee you are limited to time after work and on the weekends to make progress.
The first step in this process was to survey the work of designers around me. These were people that I was already aware of, but also it was a good exploration to learn of new designers. I used a variety of sources to find the pages of designers I liked. Here is a short list of resources that were helpful for me:
<ul>
<li><a href="https://www.dribbble.com">Dribbble</a></li>
<li><a href="https://www.instagram.com">Instagram</a></li>
<li><a href="http://visualjournal.it/">Visual Journal</a></li>
<li><a href="https://www.semplice.com/showcase">Semplice Showcase</a></li>
<li><a href="https://www.behance.net">Behance</a></li>
<li><a href="https://www.siteinspire.com">SiteInspire</a></li>
<li><a href="https://www.twitter.com">Twitter</a></li>
</ul>
Through these sites I often found myself in “design holes,” finding designers I knew of and respected, but then going looking at the people they followed and cited. In my research I found some really excellent sites that I admired (I also found some really bad ones that surprised me). I made a list in <a href="http://www.bear-writer.com/">Bear</a> of the different sites and why I liked them. Here are a few that stood out:
<img alt="" src="https://cdn-images-1.medium.com/max/1024/1*yo6JXoY3TbPPEj0PEqAY8Q.png">Wade Jefree’s <a href="http://www.wadejeffree.com/">site</a> has some nice typography and clever elements.<img alt="" src="https://cdn-images-1.medium.com/max/1024/1*QThZCqf1mBU-PCdTCn068Q.png"><a href="https://www.pentagram.com/">Pentagram</a> is a leading source of inspiration for me, both in terms of execution, but presentation of work.<img alt="" src="https://cdn-images-1.medium.com/max/1024/1*rv8OHD0CMsU5Dydydlu30w.png"><a href="http://hulsedurrell.com/">Hulse &amp; Durrell</a> have strong presentation and projects.<img alt="" src="https://cdn-images-1.medium.com/max/1024/1*MQGaHu9viqGGDNg2Qe1UKw.png"><a href="https://www.johnsonbanks.co.uk">Johnson Banks</a> has a very clever site. Through and through excellent design, and certainly worth spending some time purusing the projects.<img alt="" src="https://cdn-images-1.medium.com/max/1024/1*6kZasl8QnfUs0VRYSPi2OA.png"><a href="https://woodwork.nl/">Woodwork</a> shows off some nice work with a lot of motion. The project pages are successful.<img alt="" src="https://cdn-images-1.medium.com/max/1024/1*OGlwlaj5G0HFTl7_WSCdjg.png"><a href="http://tkachuk.me/">Anton Tkachuk</a> uses Semplice. I liked his typography and color system (even though the greys fail web accessibility standards).
Throughout this phase I was making note of two important categories: Design and Content. So, not only was I soaking up the design of the pages, analyzing typography, grid systems, color, and layout, but I was looking at what information they presented, and how they chose to present it. If you are wanting to position yourself amongst your peers, then you must first understand their method. This included the kind of content they had, the length of project descriptions, and how they described themselves and their design philosophy.
After reviewing between 50 and 100 sites, I started to formulate my “take aways.” More specifically, what did I find valuable from my audit? I found that I really valued typography, strong layout and cogent thoughts on projects.
The next step…how I started to formulate my site’s requirements and content.
<img src="https://medium.com/_/stat?event=post.clientViewed&amp;referrerSource=full_rss&amp;postId=c0609b4dae51" width="1" height="1" alt="stat?event=post.clientViewed&amp;referrerSou">
<hr>
<a href="https://blog.prototypr.io/portfolio-redesign-1-4-the-precedent-study-c0609b4dae51">Portfolio Redesign (1/4): The Precedent Study</a> was originally published in <a href="https://blog.prototypr.io">Prototypr</a> on Medium, where people are continuing the conversation by highlighting and responding to this story.

Portfolio Redesign (1/4): The Precedent Study

Top Stories