Art Work
Portfolio Assignment
Please do the following exercises. Create an online portfolio website (if you don’t already have one) to deliver these exercises. Most people use squarespace. You’re welcome to password protect your assignments, but make sure to give us the password when you turn it in.
Step 1. Respond to some design work
A critical part of the design process is learning to recognize, collect, and communicate about good design.
Please show us three examples of what you’d consider good design. These examples can come from anywhere, but please include at least one example of a digital product. Include screenshots or photos from each example, and articulate why you think it’s good.
Design is difficult to communicate about, but learning to do so enables you to improve your own work faster and analyze team members’ work more effectively.
Pro tip: Target a couple paragraphs of reflection for each example. If you need help with design vocabulary, start here or here.
Step 2. Show your design work
If you have prior digital product design experience and a portfolio, please send a link along with your three responses to design. If you have no prior digital product design experience, please complete the following assignment.
Assignment: Create a mockup of a multi-page signup and checkout flow.
You will be creating a wireframe and high fidelity mockup of a signup and checkout flow for a monthly subscription vegetable delivery service, aiming to help alleviate the food desert problem. Don’t spend much time on naming the company, but feel free to get creative here if you’d like.
Assume your user has just tapped the “subscribe” button on an iOS or Android mobile device. You will need to conceive of the flow from the first screen of the checkout process through the end, including requesting an email and password. You can create the flow in any order you choose, but make sure to include your reasoning in your presentation.
Here is a list of articles about web form design to use as reference throughout the process (there’s a lot here, but only read what helps you create the best experience possible). At minimum, make sure to capture the following details in your signup form:
• First and last name
• Mailing address
• Email address and password (including a password strength meter)
• Credit card details
Include any other details you think are necessary for a successful subscription signup process. Look at other signup flows around the web for inspiration. Google “mobile patterns” to find websites that provide some inspiration.
The final deliverable needs to be a digital file, but you should start with pen and paper, and include this work in your presentation. Make sure to show your work and process that led to the final version.
Pro tip: use one of the clickable prototyping tools (listed below) to turn your designs into a prototype that can be interacted with. This final step shouldn’t take more than 10-15 minutes, and helps to illustrate the flow between screens.
The purpose of this assignment is to demonstrate your ability to rapidly learn new techniques and software, and to understand how you think and tackle new problems. You won’t be assessed as much on the quality of the final product as how you approached it based on your background and experience. It’s completely okay to be an absolute beginner at this. We accept people with and without prior design experience.
This assignment is relatively non-prescriptive because there is no single correct way to complete it. We are very open to creative solutions. We expect that you will lean heavily on google throughout this process, which is both expected and completely normal for professional designers.
Depending on your level of familiarity with this process, this assignment can be completed in as few as 4 – 8 hours, but may take significantly longer if you’re very new to the process.
Options for tools
I will include a couple options for software tools below, but it’s perfectly acceptable to use what you’re most comfortable with. Search google and youtube for tutorials if you’re new to any of these.
— Sketch: This is a relatively quick design tool to learn, and will allow you to do lo-fi wireframing or hi-fi design. You can use the trial version for this assignment. There are also numerousfree resources for Sketch that will speed up your design process, which you should absolutely take advantage of. This software become an industry standard in recent months.
— Photoshop or Illustrator: Perfectly acceptable to use for this assignment if you already know one or both, but if you’ve never used either, use Sketch instead. Illustrator is industry standard. Photoshop is occasionally still used, but is a terrible tool for web or mobile design. If accepted to the program, you’ll be required to use Sketch on a Mac computer.
— Wireframe.cc, Balsamiq, or UXPin: Simple wireframing tools that will let you quickly get your ideas onto the screen. Lo-fi only, free and trial versions.
— InVision or MarvelApp: Simple tools for creating clickable prototypes. Not required for this assignment, but will certainly enhance your final presentation.
— Flinto or Principle: Tools for creating animations to demonstrate interactions. Not required for this assignment, but will enhance your final presentation significantly.
— While these are just a few recommended tools, but there are many others out there, too, which you’re free to use.