Digital Media: From Ideas to Designs and Prototypes

This is a practical design course on perspectives, tools, and methods for going from an idea for a product or service powered by a mobile and/or web application to an interactive design prototype ready for handoff to a development team. We start with brainstorming and iteratively refining the core concept for your product or service, based on which we create the brand identity along with detailed personas and stories that capture why and for whom your product or service is developed. We then translate those personas and stories into storyboards that illustrate the application's experiential flow in real-world contexts in terms of concrete visual and interaction design elements. The design and development of a component-based pattern library for creating interactive prototypes with live data is a central focus of this course. We introduce a varied, growing collection of third-party component libraries that can help give your prototypes a professional and polished quality. We create prototypes with a visual design tool that also allows creating and enhancing components with code for imagining and realizing even richer interactions and experience flows. The work in this course is based on significant use of a mix of the following tools and technologies: Notion, Milanote, and Framer (with Figma, Play, HTML, CSS, Javascript, React, Next.js, Github, and Visual Studio Code).