Freytag’s 5-Part Dramatic Structure: exposition, rising action, climax, falling action, and resolution.

Freytag’s Pyramid: Craft Compelling UX/UI Design Case Studies the Easy Way

by Teo Yu Siang and James Newhook | | 27 min read
649 shares

Stand-out case studies for your portfolio are simpler to write than you might think. The not-so-secret “secret sauce” is storytelling—something humans have been doing for a long time. As a result, there is a multitude of frameworks, guidelines, and structures that UX/UI designers can take advantage of in their case studies. One of the simplest yet most effective structures is German playwright Gustav Freytag’s Pyramid. Use this structure and transform your UX/UI design case studies into absorbing narratives that hiring managers love to read.

Gustav Freytag was studying Greek and Shakespearean tragedies when he created his pyramid. Of course, your UX (user experience) stories should not be tragedies! However, Freytag’s structure is perfect for case studies. Step by step, it gives your project a clear introduction, builds it to an exciting climax, and reveals the final product and outcomes. All you need to do is follow Freytag’s five-part arc:

  1. Exposition: Set the stage for your story and introduce the “inciting incident.”

  2. Rising action: The series of events that lead towards the climax.

  3. Climax: The apex of your story, full of emotions and excitement.

  4. Falling action: What happens as a result of the climax. Everything falls into place, and characters start to resolve conflicts.

  5. Resolution: This is the conclusion of your story. All the loose ends and conflicts are resolved.

A diagram of Freytag’s Pyramid.

Freytag’s Pyramid is simple yet effective. It gives designers a straightforward way to build their case studies from the ground up with storytelling. Start with an outline based on the five-part structure, then fill it in with the details.

© Interaction Design Foundation, CC BY-SA 4.0

Storytelling is a vital element of your UX/UI design case studies that hiring managers, like Stephen Gay, UX Design Lead for Google One, look for in a portfolio. Watch this video to discover what Stephen wants to see when hiring and learn how to impress with your UX portfolio:

Show Hide video transcript
  1. 00:00:00 --> 00:00:31

    Desiging a portfolio is a case study unto itself, just like an interaction. An interaction tells a really good story on how to use a product. A portfolio tells a narrative on you as an individual and how you think. So if I see a portfolio that's filled with only finished product, then the story I'm being told is the person only cares about the final results and they didn't really enjoy the journey to get there.

  2. 00:00:31 --> 00:00:57

    So if I see a portfolio of a complete journey. Then I realized they really enjoyed the design process, they enjoyed the detail and the collaboration to get there. I look for a little things like does a person cover things like who was on the team? So they present themselves as sort of the lone hero that did the work of presenting themselves as a as a core contributor to get to a great outcome. So I'd like to see that level of thinking in terms of collaboration.

Table of contents

1. Exposition: Start Your Stories the Right Way

Exposition is where you introduce your narrative's setting, characters, and any required backstory. In the case of UX/UI design case studies, you will explain the project, its goals, and your role in it.

The Inciting Incident

A major element of the exposition is the “inciting incident”—the earliest event without which the rest of the story wouldn’t happen. Your incident might be as simple as “My employer assigned me the project.” However, you should add dramatic flair in the form of motivation.

Show what motivated you to take on the project, and use that motivation to introduce the project engagingly. Perhaps you wanted to create an exercise app, as you enjoy fitness and going to the gym (i.e., you have a personal motivation).

Even if you didn’t have a choice, you still need to show:

  • Why your employer wanted to create the app.

  • Why you cared enough to put it into your UX design portfolio.

For example, your employer might have recognized a gap in the market for a niche cooking app. Your motivation could be that you saw an opportunity to design a solution that would meet user needs in a unique way.

Project Goals

The project goals should also fold into the exposition. While goals and motivation are closely linked, they are not always identical. For example, the personal motivation behind a front-page redesign for an e-commerce site might be to improve usability. Meanwhile, the project goal would be to increase conversions and sales. Where possible, include specific, measurable goals so you can share a clear result in your resolution.

The Characters

Think about the characters in your project. You are the main character, but you must also introduce the key people you worked with. When you include the whole “cast,” it highlights:

  • What you did (and didn’t do) so that hiring managers can better evaluate your skills.

  • Your team spirit and willingness to give others credit when they deserve it.

Illustration of different stakeholders in a design project, including managers, marketing, development, and other designers and researchers.

Consider all the stakeholders involved in your project—these are your secondary characters. Use this opportunity to show hiring managers how well the main character (you) works with others to solve problems.

© Interaction Design Foundation, CC BY-SA 4.0

2. Rising Action: Reveal Your Strategies

With the stage set, it’s time to shift your story into action mode:

  • Outline some of the challenges you faced: Challenges will provide conflict and make your story interesting. For instance, you could have had a tight budget or timeline to work with.

  • Explain your design process: If, for example, you used the five phases of design thinkingempathize, define, ideate, prototype, and test—then briefly explain what you did in each one. Make sure it’s clear what steps you took to reach the final product, as well as why you took them.

  • Take your reader through the beginning stages of your design process: If it’s an end-to-end design project, tell them about the user research stage. Include photos, sketches, or screenshots of the deliverables you created, such as personas and user journey maps.

Illustration of the sketching and wireframing area of a portfolio.

Make sure you include deliverables, such as sketches and wireframes, in your portfolio. These UX deliverables show how the project progressed and add to the rising action. Visual elements also make your case studies more aesthetically attractive, which increases engagement.

© Interaction Design Foundation, CC BY-SA 4.0

3. Climax: The Peak of the Pyramid

The climax is where you reveal the most exciting events of your project and show off your problem-solving abilities. While your final designs are essential, it’s the climactic moments that led to them that show hiring managers what you're capable of.

Highlight something about your project that will intrigue hiring managers. Something that will stick in their memory. For example:

  • A tough decision that you or your team had to make.

  • An unexpected user insight you uncovered through user research that forced you to change the direction of the project.

  • A sudden or time-sensitive challenge that you capably solved.

  • A novel idea or unexpected solution to the problem.

  • A brainstorming session you moderated that resulted in a solution to a previously unsolvable problem.

Your UX case studies should be concise, so you can’t show everything. Hiring managers may only have five minutes to review your portfolio. Think about the events of your project that will best contribute to a meaningful and compelling story. Every event needs to drive your story forward, just like in a book or a movie.

4. Falling Action: Everything in Its Right Place

By now, your story is almost ready to reach its final conclusion. Your user insights, decisions, and ideas come together to inform the final iterations of your product:

  • Show how you converted sketches and ideas into wireframes and high-fidelity prototypes.

  • Take your reader through your user tests and summarize the key feedback you gathered from users.

  • Present your photos, screenshots, and sketches of UX deliverables to support the story.

Illustration of a sketch, wireframe, mockup, and prototype of the same mobile app. They get progressively more detailed with each stage, from a rough sketch to an interactive, detailed prototype.

Your sketches, wireframes, mockups, and prototypes contribute visually to your design narratives. Show sketches in the rising action and final prototypes in the falling action and resolution. UX deliverables guide potential employers through your design decisions and make the outcomes more understandable.

© Interaction Design Foundation, CC BY-SA 4.0

5. Resolution: The Final Outcomes

The resolution is your opportunity to showcase the end results of your project. For an end-to-end design process, this will be your final prototype or product. If you’re a specialist, such as a UX researcher, this could be the final report of your research findings. Try to show your end results—for instance, in the form of screenshots of your final app.

Explain how your work has achieved its goal. Link it back to the main problems or goals you outlined in your exposition to give readers a sense of closure.

Include specific business outcomes if possible. Remember, hirers and companies care about the value you provide. Use business- and revenue-oriented outcomes as much as possible. For instance, if you’ve created an app, how many people have downloaded it and how have they rated it on the app stores? If you’ve improved a site's usability, has its conversion rate increased?

Finally, include your personal take away points. A good story is an emotional one! Self-reflection can include:

  • How did you feel about your end product?

  • What have you learned?

  • If your project was not as successful as you expected, what were the possible reasons?

  • Are there any follow-up actions you’d take, given that design is an iterative process?

A UX Tragedy, After All?

You might think a great UX case study has to end with amazing results, but that’s not true. For one, a great result today might not look so great a few years later. For instance, the app you worked on might be part of a trend that falls out of favor within a year or two.

What’s most important to a recruiter is how you overcome constraints and challenges to produce your results. While incredible results are excellent for your UX case study, don’t be afraid to present your project even if it didn’t succeed. More than anything else, they want to evaluate your mind and how you work.

In this video, Don Norman, Founding Director, Design Lab, University of California, and Co-Founder, Nielsen Norman Group, explains why designers should embrace failure in the 21st century:

Show Hide video transcript
  1. 00:00:00 --> 00:00:34

    The word "failure" – it's a bad word. There are many cultures where failure is  considered *so* bad that basically someone who fails that may change their whole life. If you are in a company and you do something and it fails, you may never recover; or if you do  something that fails, you do something bad, you can never recover – and that's *wrong*!

  2. 00:00:34 --> 00:01:02

    There's the company IDEO, a design company in California. It has this philosophy about fail fast, fail frequently. They're trying to say failure is a good thing because failure is how you learn. But the word "failure" is a negative. I remember I was in Korea and I was talking to some students, and one student who I became friends with was telling me how

  3. 00:01:02 --> 00:01:31

    he wasn't doing well, et cetera, et cetera, and... But I tried to learn what he had worked on. And it turned out that he had once designed a golf bag – a bag that held golf clubs. And it won a prize. And then a company said, "We really like that." And the company started manufacturing it. And I said, "I don't understand. It sounded to me like that was a great success; why are you so unhappy?"

  4. 00:01:31 --> 00:02:00

    Well, because the product *didn't sell well*. And so, eventually it was removed from the market; so, he considers it a failure. And I said, "Wait a minute. You succeeded. You did this brilliant thing as a *student*. And this company came and just looked at it and said, 'That's wonderful!' and they manufactured it, and it didn't sell well. That's the company's fault, not your fault." But, no, to him it was a life-defining moment and he really never recovered.

  5. 00:02:00 --> 00:02:32

    "Failure" – that word; horrible. I have friends who have just the opposite view. If you don't fail at things, you're *not trying hard enough*. How do I know you're trying something that's new and innovative and different that will change the world? Well, it means that because occasionally it didn't make it – it failed –  because if you're not failing, you're not trying. You're not trying the extremes; you're not trying outrageous ideas which often are the most positive ones.

  6. 00:02:32 --> 00:03:00

    So, failure ought to be a great thing; so, I think that IDEO shouldn't say fail fast, fail frequently. I think they should say, "Learn fast, learn frequently." And I like to say that scientists *never* fail. And here's why: because I'm studying this important  phenomenon, and so I spend a year or even two years trying to study it and doing this and studying that; in the end, I say, "That's not working.

  7. 00:03:00 --> 00:03:33

    I think I'm going to try something different." They don't say, "I failed; I'm a failure." They say, "That didn't work." because they learned a lot along the way, they never got to their goal, but they don't count that as a failure. And that's how we should all be. But even when you've had a really unhappy case, even when you really did fail, you should realize that that's OK. *We all fail.* And we should learn from it and go on to the next thing and the next thing. And the more failures we have, actually, the better we're going to be in the future

  8. 00:03:33 --> 00:04:02

    because we've learned so much. And remember, you only fail  when you *push the envelope*. And it's pushing, pushing, pushing – the extreme – that eventually leads to great rewards because if you want to be innovative, you have to be failing, if you will, or maybe learning, *all the time*. In Silicon Valley, there are many startup companies.

  9. 00:04:02 --> 00:04:32

    And oftentimes people start a company for the first time and don't make it. Ninety percent of the companies that start fail. In fact, it's a higher percentage when you learn that a lot of them don't even get started *enough* that you counted them as a start. So, most of them don't make it. And you know what might people who – the people who support these early startups say? "Yeah, we see these promising people starting something, and we'll get them money to do it,

  10. 00:04:32 --> 00:05:03

    but we expect they're not going to make it." But when they come  back the *second time* and say, 'Oh, we have some new ideas,' we say, 'You failed the first time; good. You've learned a lot, haven't you? You're more likely to succeed now because you've had that experience. You know the sort of things you have to think about.'" You just watch extreme sports. Watch these people on skateboards doing flips, doing this, that and the other. Or watch skiers, and it looks wonderful, right? Any gymnast, any athlete.

  11. 00:05:03 --> 00:05:30

    But, actually, they have spent thousands of hours refining that and they often fail and sometimes they injure themselves badly along the way. But that's how they get better and better and better and better. We look at the real issues. We focus on people. We think of it as a system. And we do it and we're not afraid to fail,

  12. 00:05:30 --> 00:06:03

    but we're *careful* – we don't want  to do a 10-billion-dollar project and fail. We want to divide that project into small hundred-thousand-dollar projects, that if *those* fail, well, they're not fit— We *learn* from those, but by doing many of those, we build up to the larger one, and more likely to have success. That's the argument I want to make. So, actually in the financial community that supports these startups, having a failure is considered a *positive* sign.

  13. 00:06:03 --> 00:06:06

    Think about that.

Video copyright info
David M. Kelley by Jonathan Chen (CC BY 2.0)
https://www.flickr.com/photos/wikichen/9375796736/

The Take Away

Storytelling is what makes your UX case studies engaging and memorable. Use Freytag’s five-part dramatic structure to craft compelling and powerful UX case studies:

  1. Introduce your project, role, motivation, and goals in the exposition. Make sure to include the “inciting incident.”

  2. Explain your design process and challenges in the rising action.

  3. Highlight the pivotal events and findings of your design process in your climax.

  4. Show how your work, insights, and ideas fell into place in the falling action.

  5. End with a meaningful and thoughtful resolution. Highlight business-centric outcomes where possible.

References and Where to Learn More

Freytag’s five-part dramatic structure was first published in 1863 in German in his book Die Technik des Dramas (“Technique of the Drama”).

Want to create a portfolio that gets you hired? Take our course, Build a Standout UX/UI Portfolio: Land Your Dream Job, and learn how to showcase your skills, tell compelling project stories, and impress employers.

Combine Freytag’s Pyramid with Aristotle’s 6 Elements of Drama to Transform Your UX/UI Design Case Studies into Page-Turners.

Find out how to Design with Intent and Craft Your Portfolio with Visual Storytelling Tools.

Discover more about Freytag’s Pyramid in MasterClass’s definition.

Learn more from Don Norman in our course, Design for the 21st Century with Don Norman.

Images

Hero image: © Interaction Design Foundation, CC BY-SA 4.0

Get Weekly Design Insights

Join 315,762 designers who get useful UX / UI Design tips from our newsletter.
A valid email address is required.

Topics in This Article

649 shares

Open Access—Link to us!

We believe in Open Access and the democratization of knowledge. Unfortunately, world-class educational materials such as this page are normally hidden behind paywalls or in expensive textbooks.

If you want this to change, , link to us, or join us to help us democratize design knowledge!

Share Knowledge, Get Respect!

Share on:

or copy link

Cite according to academic standards

Simply copy and paste the text below into your bibliographic reference list, onto your blog, or anywhere else. You can also just hyperlink to this article.

Teo, Y. S. and Newhook, J. (2024, December 18). Freytag’s Pyramid: Craft Compelling UX/UI Design Case Studies the Easy Way. Interaction Design Foundation - IxDF.

New to UX Design? We're Giving You a Free eBook!

The Basics of User Experience Design

Download our free ebook “The Basics of User Experience Design” to learn about core concepts of UX design.

In 9 chapters, we'll cover: conducting user interviews, design thinking, interaction design, mobile UX design, usability, UX research, and many more!

A valid email address is required.
315,762 designers enjoy our newsletter—sure you don't want to receive it?