Design Process > Visual Design

Brian Talbert
Brian Talbert’s Portfolio
3 min readDec 2, 2017

My first experience with design documentation and Adobe InDesign came when I planned a portfolio site. I never planned to fully develop the site, but thought it would be a good first time project when it came to the detailed planning I was going to do. This project definitely wasn’t my best visual design work by any means, but it was the best planned out project.

So before I could do anything I had to decide what I wanted to focus on in my portfolio. This was before I had any work to put into a portfolio so I just went off what I wanted to do in my career which was UI/UX work, Graphic Design, and a blog. From these three ideas I created three separate concept models to get all the possible uses of my portfolio site onto paper. They also helped me narrow my focus and audience scope, but more on that later.

The next step was to create the personas of who would be visiting my site. At this point in my life I decided that three types of people would be visiting my site: peers, professors and future employers, each with a different reason to view my work.

Each had a quote, short bio, likes and hates, and a scale to visualize their traits

With clearly defined personas I knew how I wanted to structure my site so I could finally start working on the site structure. I began that with the designers favorite tool, the Post-It. It was a relatively simple exercise and ended up looking like an upside down tree going from the Home Page at the top to the three topics — Graphic Design, UI/UX, Blog — in the middle and then the two or three sub sections of each topic.

My final site map

Finally after all these steps I could begin to visualize my site with wireframes. Though with the planning that was the fastest step so far. The site had a simple layout with galleries of work I’ll have created, various case studies and my writings about design and the tech world in general. The next to last step was fun because I could decide on a style for the site.

Like I said before this wasn’t my best visual work, I was more focused on the design process

I now had all the pieces together to finish up my site design with Surface Comps. After wire framing this was the next fastest step as in general I could just plug the colors and fonts in, since I knew exactly where they would go, and have a finished design.

This entire process culminated in my first Design Guide in InDesign, and now that I can look back on it I appreciate the amount of steps I took to create a small site mock up. Going forward I can always remember the efficiency of these plans and that I can even get joy from this part of the process.

Brian Talbert is a student in the Digital Media program at Utah Valley University, Orem Utah, studying Interaction & Design. The following article relates to projects in the DGM 2250 Course and representative of the skills learned.

--

--