mcorybennett.com Redesign
Research | Information architecture | Content strategy | Design | Development
The problem
My portfolio didn't adequately capture my contributions as a leader or teammate. My original hastily designed portfolio site didn’t represent the quality of leadership and work I provide for projects I’m running or involved in, nor the support I provide for my teams.
The strategy
Research and apply portfolio best practices AND showcase my personality. Tooting my own horn has never been one of my strong suits, but I needed to put my best foot forward, highlighting more current work and more of the thought process that goes into the work. It’s not the destination, it’s the journey.
What did success look like?
Silence my harshest critique: me. The metric here is qualatative in nature. Would I feel comfortable sharing this portfolio site when a recruiter asks for it? Finally, my answer to that question is yes.
DO have a website, no matter what creative field you’re in.
― Stephen Gates
Original inspiration
When I decided to sit down and put the time into redesigning my site, I started thinking of what it was that originally inspired me to build a portfolio website. The original inspiration was Episode 9 and the refresher Episode 61 of the Crazy One Podcast by Stephen Gates. “DO have a website, no matter what creative field you’re in” was an eye-opener for me. For the longest time, I didn’t consider myself a creative, but this statement was the jolt I needed to build a portfolio site. I was training for a half marathon and remember listening to these episodes while running on Grant's Trail. "I need to do this, and I need to do this immediately!" That's all I could think about when I finished that run.
All good projects start with research & data
This one was no different. After revisting the Crazy One show notes, I re-read A Creative Director’s 5 biggest portfolio warning signs. I continued researching portfolio best practices and scoured as many designer, writer, content strategist, and technologist portfolios as I could. I was looking for something clean that could communicate simple and complex information alike. For my original portfolio site, I tried too hard to force myself into the role of a visual designer (not my strength), instead of practicing what I preach and putting content first. I found a number of examples that inspired the information architecture and hiearchy of information I decided to use as my framework.
"Back of napkin" sketches
Or reusing an accidentally printed on piece of paper, to be accurate. I started with the project page structure because those are the details I wanted to be ready to share at a moments notice at the request of a recruiter or hiring manager. With that audience in mind, what was the primary information I wanted to convey? If a recruiter or hiring manager only has time to skim the project pages, what do they want to know? Project name and Services (which became my role in the project) would be the H1 and H2. “The Project” became “The problem” in my Sketch wireframes and the final site content. What was the problem I/we were tasked with solving? What was the strategy for solving that problem? And finally, what was the outcome? What did success look like?
Thinking responsively
I mapped out the basic navigation and structure in a desktop viewport first, then defined how I wanted the smaller viewports to adapt. This made for easier testing in the various screen sizes. It also made it easier to course-correct the blocks I would create in Semplice once I knew how it would format in mobile.
Reorganizing, reformatting, and rewriting the existing project pages
The next step was taking this framework and applying it to the project pages I wanted to keep in my digital portfolio. I chose three to redesign, and then I would apply this format to more current projects, such as this personal site redesign you’re reading about now. I moved from paper to Sketch and started building out low-fi wireframes with suggested imagery and near-final copy.
No turning back
Once I had the three project pages I wanted to redesign wireframed and ready to build, I took the path of no return and installed the latest version of Semplice which rendered all of my previous work incompatible. It was time to build those project pages in the new format. I built the first using the framework developed in the wireframes, then used Semplice’s “blocks” to create a template that made the build of the project pages quick and efficient. Now, once I have the low-fi wire created, and the media assets sourced and sized, building out a project is about a 30-minute task, including testing across desktop, tablet, and mobile viewports.
Bringing it home
Once the project pages were built, I created the home page and basic navigation, and then I rebuilt my digital resume. The redesigned project pages will continue to be tweaked to care for some formatting inconsistencies. The rest of my time will be spent adding more current projects. I’ll be adding a space to showcase my writing and other contributions, and perhaps some other pet projects too. But for now, mcorybennett.com v2 is a go and I’m finally comfortable sharing the link with recruiters.
