This is the fourth design portfolio project for UI and UX designers. A detailed client brief that is time-boxed, detailed, and crafted to give you a hands-on experience of doing a real project. Each portfolio project is meant to help you create work you can add to your portfolio.
The other projects in the series from UX Design Mastery
A little about me
My first job in design was for a small design agency as the Lead UX/UI designer.
I met the CEO over coffee for my interview and he hired me on the spot and asked me to name my salary.
That totally took me by surprise because it meant I had successfully transitioned from being a Java Developer to being headhunted for a design role within a year. He had pointed to the fact that my portfolio had demonstrated enough creative potential to get the job done rather than work experience.
You see, I had not done an internship, gone to a design school, or worked in a design company but I still had great portfolio projects that I had conceptualized from nothing. The design projects were detailed, tackled a real problem, and demonstrated my design process and design skills.
The same thing could happen to you. I was fortunate that I had practiced my design skills to the point that someone could see the value I could bring to their company.
A key takeaway is I had designed solutions to projects aligned with what I actually wanted to do on the job.
So if you want to work for an agency do a number of campaign projects. If you want to work for an app development house, do a number of mobile app designs. Treat all your conceptual projects as gateways to where you want to be. This is what these design projects are for.
Today’s project is to create a responsive agency website for desktop and mobile.
About Design portfolio projects for UX and UI designers
Included in each design brief is the following:
- Timeline (For this to be realistic each brief has a timeline that is as close to real-world work as possible)
- Objectives (What is REQUIRED by the client. This part usually trips designers up as they go off designing what is not required)
- Platform(Where your designs will live. Understanding these platforms will give a well-considered solution)
- Target audience (Users always come first and the design must accommodate the target audience’s pain points)
- References (If you are not sure where to start, clients normally give a set of examples or references they like. The closer the design solution is to the references, the fewer revisions a designer will have to do)
- Deliverables (Most importantly how the solution should be delivered. These represent what a well-detailed portfolio case study looks like so hit it out of the park)
- Recruiter advice (Portfolio advice from creative directors, CEOs and leading design creatives from the biggest companies)
Let’s get into it
This time we look at an agency website project.
UX UI Design Portfolio Project 4: Designing an Agency website
Choose any design agency brand of your liking
Create a responsive website that allows an agency to:
• Market who they are, what they do and what they stand for
• Showcase their work case studies and awards they have won
• Contacted by potential clients
• List available positions and receive job applications
Please design a design agency website for desktop (1200px wide and mobile view 365px wide)
The site must load quickly hence any interactions or large imagery must be kept to a minimum.
- Compile a case study on Behance(Get a free account) laid out like this; Name of project, date, your role, project type(Concept)
• Research: (Refer to the References provided)
• Highlight 3 enhancements or unique features you have included in the solution that makes the site unique and allows it to stand out from other design agencies
• Sketch of conceptual and initial ideas
• Wireframes and prototype of
⁃ Homepage with work, values, team, and contact us calls to action
⁃ Our work with filter by industry, date, and awards
⁃ About us with values and team bio
⁃ Contact us with a map and form
⁃ Careers with a culture section and application form
These should be both desktop and mobile screens
• Testing and Results section: Show your wireframes to 5 people and ask them using your designs what they think about them, what they would improve, and an overall rating. Take their feedback, iterate the designs, and have a final round of testing with 5 users. See that you improve your overall rating. If not go back to the drawing board and change your designs and retest.
References that the company would like their website to follow in terms of structure and layout. It will be your job to replicate something close to these websites but add your creative flair to it.
Advice from recruiters
I don’t want to see every piece of work that you have ever done. Pick your favorite pieces. It doesn’t need to be for the most famous or biggest clients as long as you are proud of it and want to talk about it.
I would like to see more personal projects in portfolios. The work that you did in the best of conditions and with full artistic freedom
We want to see work that is consistently good. The best portfolios take a well-rounded and curated approach to showing work. Ideally, we’d see a handful of solid logos, examples of web design, examples of illustration, and some editorial work.
They should briefly describe the work and the particular role they played. We get a little nervous when someone’s portfolio includes a lot of team projects. We want to clearly understand someone’s strengths and weaknesses before we hire them.
Telling the story of your work — how it all relates, why it’s important — matters. Additionally, it’s important for designers to show that they understand the goals of their work and that those goals touch on both user and business needs. A pet peeve of mine is when there really isn’t a good reason behind the work, or the designer doesn’t show any interest in or understanding of its impact on the business or user.
If you would like a portfolio project PDF of this design project you can download it at UX Design Mastery. Included is a portfolio project layout template that outlines how to present your project your final case study.