In this video Emmanuel Henri goes through some research for inspiration—looking at colors, shapes, and flows that inspire you.
- [Instructor] Any UX project must start from somewhere. And some research and inspiration is usually the place I start. Again, the idea of this course is to bring you through the steps of defining and creating the visuals for your UI. I'm assuming at this stage you've identified your business objectives, your personas, scenarios, and use cases are defined. If any of this is completely strange to you, take the appropriate UX courses in our library. So for us, we'll assume we're building a signup flow that could be used for a fictive company called H+ Sport Supplements and Active Wear.
We'll be designing this signup flow for mobile. If you've done any of the Sketch projects in our library, you're familiar with the process and feel free to skip it. So let's get some inspiration by researching the web for colors and potential ideas for a design. Again, feel free to completely use different colors and designs for your own project. So where I typically go for inspiration and research is Pinterest. So what I'm going to do is typically do a search under what exactly is the company or the type of application I want to do.
For example, if I would do a search under sports and soccer. And here, as you can see, this is a design that I've used in a previous course and it's the same colors that we're going to use in this course. So I would go about and research the colors that I like and so on, so forth. I would also do searches under what I want to do, so signup and then mobile. And then I could get some ideas here. So this is really cool. And put this in my inspiration board. And once I have all the items that I need, I would create an inspiration board inside of Sketch.
So go to the Exercise Files and click on Resources and open the purchase-flow.sketch file. So this is something that we've done in a previous course. If you haven't done the purchase flow course, we're pretty much doing the same thing we're doing in this course, but instead of doing signup, we're doing a purchase flow. So what we're going to do is kind of copy the exact same style. So if I take a look at this here, these are the inspiration board and the mock-ups that we're going to update in a future video but basically what we want to copy is the inspiration board.
So what I'm going to do is literally copy this file and then delete everything else and then get started from there. Feel free to keep this, this is in the Exercise Files, and get some inspirations from the previous designs, but we'll build this one from scratch. So what I'm going to do is literally go back to the Exercise Files and then do Option click and paste this here and then change this to signup-workflow. And then I will open this file, and then I'll delete the symbols and then the designs and then keep the inspiration.
So now I've got all the research that I've done from previous courses, and here we have all the colors that we're going to follow in this course. So you can save this file and then move on to the next video.
- Finding inspiration for your project
- Demonstrating initial mockups with Balsamiq
- Creating the welcome and sign-up screens
- Exporting assets to InVision Studio
- Adding simple transitions and complex animations
- Using the InVision collaboration tools