User Interface (UI) and User Experience (UX) Design

​Apply best practices in user interface (UI) design and user experience (UX) to create a design prototype. Learn technical tips and tricks to apply the technical workflow of UI and UX using current design and prototyping tools such as Figma. Working on applied projects to identify key user needs, students work individually and in groups to develop design decisions that inform a web or app user interface prototype development. Students are assessed through a combination of individual assignments and a group project.
Prerequisite(s):

• No prerequisites are required for this course.

Information architecture is an extensive discipline involving the organization, labeling, navigation, and searching systems for web and interactive products that enable users to find and manage information more successfully. This foundation course addresses issues such as how web usability, user experience, and search engine optimization integrate into an effective information hierarchy. Students will construct mobile and web sitemaps, task diagrams and wireframes. A combination of lectures, in-class discussions, hands-on exercises, group work, student presentations, and tool demonstrations will be used throughout this course. Students will be assessed by a combination of quizzes, term project, group and individual projects.
Prerequisite(s):

• No prerequisites are required for this course.

The course teaches User Interface Design (UI) and User Experience (UX) as a strategic area of development for new media. This involves assessing the technical needs of an interface and the appropriate delivery platform. By understanding the power and limitations of Interface Design and User Experience tools and how to work with them, students will create prototyping systems that effectively employ colour, layout, and typography to receive user feedback. The students will learn about design methods, design process, testing and inspections of user interfaces as well as prototyping in three levels of fidelity both on paper and digitally. Students will be assessed by a combination of quizzes, group and individual projects.
Prerequisite(s):

• MDIA 2533

​This course focuses on building UI elements using various design applications. Students will be introduced to the guidelines for building UI elements, utilize their knowledge in several design applications to create UI components and finally export them in the proper formats. Students will be evaluated by a series of assignments and term project.
Prerequisite(s):

• MDIA 2540

​Graphic designers require web design skills as well as traditional media skills. In this course, students will be introduced to the foundation of front-end development and code management, and become familiar with the basic tools of web design, including coding concepts to translate web design into code. Focusing on web standards as outlined by the World Wide Web Consortium (W3C), students will learn to hand code HTML 5, CSS3 (Cascading Styles Sheets) to control overall hierarchy, structure, functionality, layout and appearance of websites.​
Prerequisite(s):

• No prerequisites are required for this course.

Students collect their best work into a targeted interactive portfolio. During the duration of this course, students may start new projects or refine existing ones in specific disciplines to further develop their research, management, design and programming skills in a self-directed format. A personal brand and self-promotional materials will be defined by each student to reflect their qualities, values and professional accomplishments. Students present their portfolios at the end of the course. Students are be assessed by a combination of individual projects and a group peer critique.
Prerequisite(s):

• No prerequisites are required for this course.

​Effective graphic design is essential to daily life as it informs, instructs, warns, and entertains us. Discover that design is a complex process involving research and analysis, concept development, critical evaluation, refinement, and execution. Students will focus on brainstorming and the creative process stage of design process and its relationship to visual problem solving. Hone critical thinking strategies for effective graphic design by practicing what is learned in relation to print- and web-based communications. Execute simple, thumbnail sketches to create and record concepts—a skill paramount for advancing into creating digital content.​
Prerequisite(s):

• No prerequisites are required for this course.

This course will show you how effective graphic design is essential to daily life as it informs, instructs, warns, and entertains us. You will also discover that design is a complex process involving research and analysis, concept development, critical evaluation, refinement, and execution. Hone your critical thinking strategies for effective graphic design by practicing what you learn in relation to print- and web-based communications. This is accomplished by creating a compelling concept for an ad, assessing a brand, building a visual identity around the persona, and producing a memorable promotional piece for an event campaign. You will draw and sketch concepts by hand as this skill development is paramount for advancing into creating digital content.
Prerequisite(s):

• No prerequisites are required for this course.

​Vector Graphics are widely used to create logos and business charts or graphs, greeting cards, posters, web or app. interface elements, graphics for brochures or manuals, patterns, clothing, and in fine art. Producing high quality vector graphics is a must-have skillset for any graphic designer. Students will be introduced to the foundations of vector graphics, including understanding anchor point types, creating paths and geometrical shapes, object's properties such as Fill and Stroke, working with gradients, and how to organize objects in groups and layers. Students will also learn advanced techniques such as working with Brushes, Symbols, Type objects, Masking, Graphic Styles, Artboards, and exporting the results for variant purposes. Students will apply this knowledge in individual and team projects. Using the professional design process, students are tasked with researching each project topic, producing design sketches, executing a final polished design, and then critiquing each other.
Prerequisite(s):

• No prerequisites are required for this course.

In this hands-on course, you will create and design scalable computer graphics with Adobe Illustrator that require creativity and imagination. You will use multiple art boards, layers, and sub-layers to organize your artwork. As well, you will use drawing tools, drop down menus, and floating panels to create a series of projects. You will use the pen tool to draw precise, offset paths, and different path widths. We will emphasize both linear and radial gradients, gradient meshes and blends for visual effects, and the effective use of colour. You will use both horizontal and vertical alignment tools and distribute your artwork evenly. You will create canisters using 3D revolve, symbols, and mapping tools.
Prerequisite(s):

• No prerequisites are required for this course.

This hands-on course expands on the skills and knowledge that gained in Adobe Illustrator 1 by using different tools, drop-down menus, and panels to create a more complex series of projects. To complete the projects, you will use a perspective grid for creating 3D artwork that fades to a vanishing point. You will create a clipping mask, rotate objects around a fixed point, create patterns, use different drawing modes, use the scissors tool to cut and join paths, use pathfinder tools to divide graphics, and transform and move objects precisely on both a horizontal and vertical axis point. You will work with live corners, use key objects for aligning graphics, create colour groups, and use brushes to paint and spray graphics for visual effects.
Prerequisite(s):

• 50% in MDIA 1160

Photoshop mastery is essential to managing and producing a highly professional product. Students will create stunning images and composites for visual communication projects by exploring the Photoshop interface and an array of photo-editing techniques. The course focuses on fine image editing, retouching, and developing high-quality online and print image compositions. Students will learn how to create complex graphics that can be built in multiple layers for organization and independent manipulation. Students will come to understand the purpose of the application tools, work with layers, channels, paths, make selections, image manipulation/alteration, understand image size, canvas size and resolution, create masks, work with filters and layer styles, the pen, colourize, and create interesting type.
Prerequisite(s):

• No prerequisites are required for this course.

This course introduces students to the creative world of photo editing using Adobe Photoshop. The course starts with an overview of raster based applications, including image resolution and the co-relation between pixel dimensions, color depth, and image quality. Students will customize the Photoshop workspace, use the quick selection tool, use the quick mask selection tool, manipulate selections, save selections to channels, and perform tonal corrections with the spot healing brush tool and the content-aware fill. Students will create point type, create a clipping mask from type, create vector paths, use layers and adjustment layers, and paint with the mixer brush tool.
Prerequisite(s):

• No prerequisites are required for this course.

This course covers advanced compositing techniques, including painting with the mixer brush, adding a background, matching colour schemes across images, and blending multiple pictures to create a panorama. Students will select different brush settings and create a custom brush preset. The course also covers applying layer styles, adding adjustment layers, using layer effects and blending modes. Students will manipulate an image with Puppet Warp, create type on a path, warp point type, design with paragraphs of type and work with type styles. Other topics covered in the course include straightening and cropping images, using the spot healing and brush tools, repairing areas of an image using the clone stamp tool, applying gradients to layers, and working with masks and channels. Students will also prepare files for the web by creating slices and export HTML and images.
Prerequisite(s):

• 50% in MDIA 1180