How to put together an effective and eye-catching UX design portfolio
Make readers want to keep reading to find out how you got to that point. Practically speaking, a full-width banner image with bold colors and appropriate branding, as well as a mockup or two (mirroring your homepage thumbnail) is the most effective. Follow this with a short paragraph of what the project is about and its background. You should also include a list of details such as the project duration, how big the team was, tools used, and most importantly, what your specific role in the project was.
Following this, make your problem statement bold and clear. It doesn’t have to be too formal. Juxtapose this with your solution. This could be a parallel statement, or a combination of words and graphics once again showing your final product, but more specifically highlighting sections or screens that demonstrate how it solves the problem you just stated.
Everything you’ve written up to this point should be enough to give the casual reader a good idea of the project background and what the final product looks like. They’d probably be fine moving on to another page on your portfolio. But for people who want to read more on this case study, make sure to clearly but concisely tell everything that relates to the work that you did. Structure the rest of your case study after the introduction like this:
Research — E.g. competitive analysis, interview and survey results, and personas (if any).
User flow(s) — Important to give an idea of how the app is meant to be used.
Ideation — E.g. information architecture/site map, sketches, low-progressing-to-high fidelity wireframes, usability testing feedback, annotated iterations, and before/after examples.
Final design — Complete prototype containing your highest fidelity wireframes. You could walk through a specific user flow, or just showcase different screens. Here is where gifs, an embedded prototype (more on this later), and demonstration videos should be placed.
Conclusion — All good pieces of writing need a conclusion to stick the landing. Talk about next steps first, because readers’ minds are still on the prototype. Then, if applicable, mention direct impacts of the work you did, such as specific growth or revenue metrics. Then, give it a personal touch by talking about what you thought of the project, and the lessons learned.