Most professional environments elect to create a design presentation with an introduction, a few concepts, and executions. In my experience, this is a fantastic way to explore different ideas, and also to make sure that your ideas are coherent. Additionally, in a professional setting, it allows the client to react to different pieces, and to help facilitate a conversation around your work. While there are a bounty of different ways of presenting work, in this class we’ll work on one system. Once you get the hang of it, feel free to explore other ways of sharing your work.
Tool: InVision
Invision is a prototyping tool, however, I mostly use it to share presentations. For prototypes, we’ll use Sketch, but we’ll talk about that later.
If you haven’t already, create a login for InVision. It should be free.
I’ll show you a few examples of presentations I’ve created using InVision.
Tool: Craft Plugin
You can use InVision and Sketch independently, but I use them together. To do so, you’ll also need to download The Craft Plugin. This plugin allows you to sync your sketch art boards directly into InVision, creating a more efficient workflow.
You’ll know it worked when you see this toolbar on the right of your screen:
Invision w/o craft
If you don’t end up using the craft plugin, export your artboards from Sketch as 2x jpgs, using the suffix @2x. Then upload them into your InVision prototype.
Tool: Sketch Cloud
If you organize your pages from left to right, you can also simply use sketch cloud to make a presentation.
It’s a good idea to have several different directions(visual and conceptual) for any kind of project. This helps you try different things out and also helps you land on a less expected result. I’d suggest having lots of ideas and then narrowing it down to 3 which feel distinct from one another. If you’re not sure where to begin, you can follow the below outline:
Concept Introduction
Give your concept a name and introduce it, maybe with a couple sentences.
Visual References
Collect a few visual ideas for the concept. The type of imagery can be from a variety of sources(film, photography, books, etc.) but should ideally inform the concept and not so much the execution. Better designers work with ideas. While it’s good to look at other design work, I’d avoid using other designer’s work in a mood board setting. This is because this is another artist’s execution of something, and you want this visual storytelling to be your own!
You can also include play screens. What I mean by that is, you can include small detail exploration(perhaps how type might work with an image, or maybe an exploration of a headline, body copy, and a button) that aren’t part of the actual website design, but can still inform the viewer on some of your systematic thinking.
Design Work
Present your work. InVision and Sketch Cloud make it easy to look at an image as though it were actually online. Remember to make your page as long as you need it to be
Coming Up with a Concept
Figure Out Your Intention
It’s easy to be overwhelmed if you’re just consuming without thinking. Before you begin digging, have an idea of what you’re after.
Tool: InVision
Tool: Craft Plugin
Invision w/o craft
Tool: Sketch Cloud
Content
Concept Introduction
Visual References
Design Work
Coming Up with a Concept
Figure Out Your Intention