Course Title: ART436 Digital Media IV
Term: Spring
Course Description
Major, minor, elective credit. Prerequisite: ART 326 or permission of the instructor. This course introduces interactive page design and development techniques using web and mobile app creation software. Aesthetic design principles for page layout, type design, imaging and development using an authoring tool will be applied for creative products to construct user experience. Students will publish files and optimize them for size and quality. Lab Fee.
​
COURSE LEARNING OBJECTIVES:
-
Student will be able to research appropriate reference material for interactive creation through the use of flow charts, storyboards, concept sketches and written creative briefs.
-
Student will be able to apply critical thinking, problem solving and creativity using interactive graphic software on an advanced level.
-
Students will be able to create detailed concept sketches based on research findings.
-
Students will explore and demonstrate abilities in the interpretation of the User Experience (UX) and User Interfaces (UI) for the target audience.
​
COURSE LEARNING OUTCOMES:
-
Project process includes performing research, flow charts, concept sketches, and written creative briefs for professional video presentations.
-
Project process includes introductory technical skills sets for building interactive media.
-
A sketchbook of concept development, flow charts and research notes will represent growth in ideation and application of research findings for interactive end-user presentations.
-
Project process includes identification of proper User Experience (UX) and User Interfaces (UI) for the target audience and deliverables.
​
Final Digital Portfolio
All art and design students are required to establish and maintain a Digital Portfolio in which all artwork created during your time at Converse is documented. Documentation techniques will be covered in the class and students expected to document all drawings created in the course. The work and portfolio will be reviewed and graded for accuracy and quality.
​
PROJECTS
Application Logo Design
You have been hired to create a logo of a gig business. The symbol may be a simple illustration or shape that represents the company’s purpose and business. Once the final logo has been designed and completed you will apply that design to the app, website, social media advertising, brochure, postcard and apparel.
Select 1 of the following Freelance/Gig Jobs
-
Dog Walker
-
Private Art Teacher
-
Private Music Teacher
-
Baby Sitting
-
House Keeper
-
Tutoring
-
Personal Chef
-
Running Errands
-
Yard work
​​
Using Adobe Illustrator you will explore rough designs for the logo before composing your final design solutions.
Steps to Success
​
Part 1
-
Select: Business Type.
-
Sketches: Develop and present rough sketches in class. There should be a minimum of twenty (20) rough sketches for the logo.
-
Include: Icons/symbols that represent your logo and a font mockup.
-
Execution medium: Pencil and paper.
​​
Based on the responses of your instructor and classmates, continue to refine and develop the rough logo design in digital software (Adobe Illustrator) from the thumbnails you created in Assignment 1 into three separate variations. These designs will be created in grey scale – no color at this time. Present roughs on a multiple page PDF file.
-
Refine: Refine the original logo designs from assignment1.
-
Digital Sketches: Develop and present smooth rough digital sketches in class. There should be a minimum of three (3) versions of the logo.
-
Include: Icons/symbols that represent your logo and a font mockup.
-
Execution medium: Abobe Illustrator
​
​​
​
​
​
​
Part 2
-
In the course project, you are creating a logo design for a gig company. Identify the target audience. Using you Persona’s explore color harmonies that represent the identified target market of men, women, or young people.
-
Select three sets of color harmonies, with a maximum of three colors in each set.
-
Using these sets, generate three separate color studies for each logo design. You may use Adobe Illustrator's Live Color feature to complete this assignment or Illustrator's Swatch Libraries. Discuss why you think your chosen color harmonies will appropriately represent the final illustration to its target audience.
-
A color study is not intended to be a finished rendering of the illustrations. Think of it as a Thumbnail in color. Your task is to try colors you would not normally attempt, or maybe even think of in a daily situation.
Letter Head, Business Card, Envelope Design
In this assignment, you will adjust your logo and create a full set of collateral material. The collateral materials will include a Business Card, Letter Head and Envelop design
User Persona Designs
A user persona is a made up representation of our ideal customer for our App. As a UX Designer, you’ll start the design process by conducting some user research and identifying exactly what they need or want from the product you’re designing for your brand. A persona is generally based on this user research and incorporates the needs, goals, and observed behavior patterns of your target audience. We will be making these personas up from scratch, and make it much easier for ourselves in the future when we are asking ourselves “how do we attract this type of customer?”. Using these personas, we will craft our marketing design to attract these types of users.
​
“Persona is simply a representation of your most common target audience. It’ll help you standardize needs and get solutions faster.”
Project Journey Map
As you move towards completing the process of how to make a customer journey map, you'll realize that every step is equipping you to deal with one of the biggest hurdles that brands face: earning your customer's trust.
​
Moments of Truth are crucial points in the customer journey. These are instances wherein a customer's opinion about your brand are formed based on their experiences.
​
A customer journey map is a visual overview of how customers interact with and experience your website, products, or business across multiple touchpoints.
​
By visualizing the actions, thoughts, and emotions your customer’s experience, a customer journey map helps you better understand them and identify the pain points they encounter.
A customer journey map can have a very narrow focus and only look at a few, specific steps of the customer experience (for example, a product-to-purchase flow on a website), or it can take into account all (wide) touchpoints. Each version has its advantages:
-
A narrow focus will allow you to zero in on an issue and go into incredible problem-solving depth
-
A wide focus will give you a broader, holistic understanding of how customers experience your business
UX Storyboard
As you move towards completing the process of how to make a customer storyboard, you'll realize that every step is equipping you to deal with one of the biggest hurdles that brands face: earning your customer's trust.
Assignment Overview
Visual benefits
-
Images on a UX storyboard can speak more powerfully than just words; they add extra layers of meaning. High-level stakeholders or people outside of the design team will process information presented this way much more easily.
​
Emotional engagement
-
A UX storyboard focuses on problems and situations rather than features, just like personas or journeys do. But since it does so in a more engaging visual form, people emotionally relate to it more easily.
​
Memorability
-
Storyboards let us understand the flows and problems at a glance. Presenting them visually keeps these stories and flows in sight.
UX App Flow Chart
This phase helps to visual explain the flow of the applications interactive pathway.
UI Prototype
​
Visual benefits
-
User interface (UI) modeling moves from requirements of UX into the look and feel of the final design. You will convert your storyboard and wire frames into a mock up that appears to be a functioning application. A prototype contains all of the brand elements such as color and typography. It also includes images and illustrations.
-
The mock up should contain moderate interactivity. The functionality may be created in Adobe XD.
​
Promotional Application T-shirt Design
Create a T-Shirt illustration according to the specifications below. The illustration should be saved as a vector graphic (Adobe Illustrator file) and as a PDF. The reason to save it as an Adobe Illustrator file is that you may make changes, if necessary, and show it in case your instructor requests to see the vector image.
​
The first image should be the base illustration and type for a back imprint. This image should not contain any additional effects, such as gradients. Place on the left side art board.
​
The second design should contain a pocket imprint of the logo. Place on the right side art board.
Social Media Banners Ads
In this assignment you create social media ads to fit into two different platforms.
Instagram and Facebook. The designs will promote, inform and link to the gig’s web site.
​
Design an Instagram Newsfeed Ad
-
File format GIF
-
Square images should be 1080 x 1080 pixels
-
The ad must be animated
Design a Facebook Ad
-
File format JPG or PNG
-
Landscape image ad sizes should be 1200 x 628 pixels
-
Leave about 14% (or 250 pixels) at the top and bottom of the image free from any important information, like logos, text, or key image elements. The profile icons may cut off the elements or other action buttons users have.
Tri-Fold informational Brochure For App
Tri-fold brochures are one of the most commonly used marketing materials, but can be one of the most challenging to design. There are many details to consider when laying out a tri-fold brochure, including paper size, fold lines, content layout, and file preparation.
Design a 2-sided promotional brochure for the same gig/freelance company you created a logo for. You should use a combination of personal and stock photographs.
-
In you rough design you may flow “Lorem Ipsum” body copy into a variety of sections.
-
The final design will contain meaningful and appropriate body copy.
-
Make sure to use real headlines to indicate each section.
-
Use graphic elements such as lines, curves, boxes and etc to enhance the design.
-
Your design must marry with the online application. Suggested sections;
-
What we do.
-
How our services work.
-
Who we are.
-
TV Commercial Advertising App
You will create a 10-second television commercial to promote your gig/freelance company. The final output should be viewable on a standard HDTV as well as a mobile device and social media. The focus is on layout, appropriateness and diverse approaches for detailed storyboarding.
​
-
Create a scripts for graphics, on-screen typography, logo and voice over
-
You will select a sound bed of music, make a voice over and apply Foley sound effects that support the narrative as well as graphic assets
-
Create a storyboard
-
Create a final video Premiere
-
Include;
-
Live action or Still image shots
-
Logo
-
Music
-
Voice Over
-
Foley
-
-
Final rendering should be 1,920x1,080 - 72 DPI
​