Processes
This presentation is the property of its rightful owner.
Sponsored Links
1 / 68

Processes PowerPoint PPT Presentation


  • 65 Views
  • Uploaded on
  • Presentation posted in: General

Processes. Moving from inception to final product. Preproduction Production Postproduction. The Three “Ps”. Preparation phase Involves: Problem identification Needs assessment Idea generation Concept development Research User/audience analysis Budgeting Scheduling Staffing

Download Presentation

Processes

An Image/Link below is provided (as is) to download presentation

Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author.While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server.


- - - - - - - - - - - - - - - - - - - - - - - - - - E N D - - - - - - - - - - - - - - - - - - - - - - - - - -

Presentation Transcript


Processes

Processes

Moving from inception to final product


The three ps

  • Preproduction

  • Production

  • Postproduction

The Three “Ps”


Preproduction

  • Preparation phase

  • Involves:

    • Problem identification

    • Needs assessment

    • Idea generation

    • Concept development

    • Research

    • User/audience analysis

    • Budgeting

    • Scheduling

    • Staffing

    • Resource allocation

  • ESTABLISH THE SCOPE OF THE PROJECT

Preproduction


Production

  • The individual pieces of the project are acquired or produced

  • The assembly process

  • Your idea begins to take shape and become tangible

Production


Postproduction

  • Brings together all of the individual elements of a multimedia project into one, unified finished project

  • Usually a collaborative process between the client and producer (and other stakeholders)

Postproduction


Project management 101

  • What is a project?

    • A temporary endeavor undertaken to create a unique product, service or result

  • What is project management?

    • The application of knowledge, skills, tools, and techniques to meet the project requirements

Project Management 101


The 5 basic pm steps

  • Initiation

  • Planning

  • Execution

  • Monitoring and Controlling

  • Closing

The 5 Basic PM Steps


Initiation

  • Identify stakeholders

  • Create a project charter – document that outlines:

    • Scope

    • Assumptions

    • Constraints

    • Budget

    • Schedule

  • Seek approval from the project sponsor - greenlight

Initiation


Planning

  • Form a team

    • Identify roles and responsibilities

    • Set clear goals and objectives

  • Create a WBS (Work Breakdown Structure)

    • A visual representation of scope and activities

    • Allows for deliverables to be tracked and controlled

  • Estimate costs and establish a budget

  • Create a schedule

    • Best to frame schedule around actual deliverables

Planning


Planning1

  • Form a team

    • Identify roles and responsibilities

    • Set clear goals and objectives

  • Create a WBS (Work Breakdown Structure)

    • A visual representation of scope and activities

    • Allows for deliverables to be tracked and controlled

  • Estimate costs and establish a budget

  • Create a schedule

    • Best to frame schedule around actual deliverables

Planning


Execution

  • Ensures that planned activities are carried out in an effective and efficient manner

  • Relies heavily on the plans laid out in the “Planning’ phase

  • Involves:

    • Keeping team dynamic positive and cohesive

    • Proactive problem solving

    • Regularly referring to project plan (charter)

Execution


Monitoring and controlling

  • Must monitor:

    • Schedule progress:

      • On schedule? Adjustments needed?

    • Budget:

      • What has been spent? What remains?

    • Scope:

      • Is the scope appropriate? Does it need to be expanded or compressed?

Monitoring and Controlling


Monitoring and controlling1

  • Must control:

    • Actions to ensure project remains on schedule

    • Actions taken when adjustments need to be made

    • Change management! (article)

Monitoring and Controlling


Closing

  • Formal sign-off

  • Deliverables are handed off

  • Deliverables are reviewed and accepted (often some back-and-forth)

  • Final sign-off completed

  • Documentation finalized

Closing


Web design process

  • Planning

  • Design

  • Development

  • Launch

  • Post Launch

Web Design Process


Planning2

  • Requirements analysis

  • Project charter

  • Site map

  • Draft SOWs and Contracts

  • Secure servers, hosting, file structure, etc.

  • Identify necessary resources

Planning


Design

Design


Multimedia design

Multimedia Design

Visual Communication: Elements and Principles


Visual communication

  • “The transmission of ideas and information through visual forms and symbols.”

  • Involves the psychological and cognitive processes that affect how we perceive visual stimuli

  • Objective realities of sight vs. transmission of culture and meaning

Visual Communication


Content and form

Content

  • The stories, ideas, information, etc. that we transmit and exchange with others

  • Involves the “What”

  • Critical to the success of your message

Form

  • The manner in which content is designed, packaged and delivered

  • Involves the “How”

  • Critical to the success of your message

Content and Form


Processes

“The medium is the message.”

Marshall McLuhan


Processes

“Content is king.”

Bill Gates


Processes

“Design is not just what it looks like and feels like. Design is how it works.”

Steve Jobs


Principles of design

  • Unity

  • Emphasis

  • Perceptual Forces

Principles of Design


Unity

  • The “perceptual glue” that holds a design together

  • Maintains a sense of visual harmony

  • “The whole is greater than the sum of its parts.”

  • Viewer should be able to see the big picture without being distracted by individual elements

  • Elements of design should exist in harmony rather than competing for the viewers attention

  • Humans naturally want to organize visual information into meaningful clusters

Unity


Unifying principles

  • Proximity

    • Objects are more likely to be perceived as related when they are position close together

  • Alignment

    • Position objects along a common edge or implied line

  • Similarity

    • The brain will group objects together when their style attributes are similar and uniform

  • Repetition

    • Repeating visual elements strengthen the overall unity of the design

Unifying Principles


Emphasis

  • A good design must have a primary focal point

  • Quickly guide the viewer’s attention to the main subject or message

Emphasis


Methods of emphasis

  • Contrast

    • How different is the focal element from the surrounding landscape?

  • Color

    • The human eye is attracted to the warm color regions of a design field first (warm, neutral, cool)

  • Depth

    • Foreground and background

  • Proportion

    • Scale or size of an element relative to others in the field of view

Methods of Emphasis


Perceptual forces

  • Balance

  • Figure-Ground

  • Psychological Closure

Perceptual Forces


Balance

  • Symmetrical

    • Objects of similar shape, color, and size are weighted equally on opposite sides of the frame

    • Associated with tranquility, elegance, traditional and conservative appeal

  • Asymmetrical

    • Strategic arrangement of elements with differing size, color and tone

    • Can appear more visually interesting and dynamic

Balance


Figure ground

  • Figure: the element that appears in the foreground

  • Ground: everything else behind it

  • A good contrast is inviting and prevents viewers from feeling overwhelmed

Figure - Ground


Psychological closure

  • The mental completion of a visual pattern when only partial information is provided

  • Filling in the gap

  • This extra measure of sensory activity can provide a deeper more satisfying experience

  • Asks your viewer for active engagement with the subject matter

Psychological Closure


The development phase

The Development Phase

Putting it Together


Development phase

  • Setting up environment/framework

  • Building (coding) templates, schema, themes, etc.

  • Distribute your content throughout your site in appropriate areas (simple and usable!)

  • Testing of interactivity and functionality

Development Phase


User centered design ucd

  • A process, a philosophy

  • Built upon the concepts and principles of simplicity and usability

  • Should not require users to adapt to the interface

  • Rather…it accommodates users’ existing behaviors

  • Creates a seamless, intuitive and natural interaction experience

  • Involve the user as much as possible along the way

User Centered Design (UCD)


Take advantage of conventions

  • “If it ain’t broke, don’t fix it.”

  • Follow existing conventions – the widely used, standardized design patterns

  • Where things are, how things look, how things work

  • Conventions evolve differently for different types of sites (blogs vs. e-commerce, etc.)

  • Following conventions reduces user cognitive workload!

Take Advantage of Conventions


Be mindful

  • Designers are often reluctant to follow convention

  • It is easy to underestimate the value of conventions

  • Innovation: value > learning curve

  • Rule of thumb:

  • Innovate when you know you have a better idea but take advantage of conventions when you don’t.

Be Mindful


Create visual hierarchies

Very important

A little less important

Nowhere near as important

Create Visual Hierarchies


Create visual hierarchies1

  • Effective visual hierarchies have 3 traits:

    • The more important something is the more prominent it is

    • Things that are related logically are related visually

    • Things should be “nested” visually

Create Visual Hierarchies


The more important something is the more prominent it is

Very important

A little less important

Nowhere near as important

The more important something is the more prominent it is


Editor demo

<h1>Header 1<h1/>

<h2>Header 2<h2/>

<h3>Header 3<h3/>

<h4>Header 4<h4/>

<h5>Header 5<h5/>

<h6>Header 6<h6/>

Editor Demo


Things that are related logically are related visually

  • Recall the idea of proximity: objects are more likely to be perceived as related when they are grouped together

  • Group things together under headings

  • Display them in the same visual style

  • Put them in a clearly defined area

  • Web MD

Things that are related logically are related visually


Things should be nested visually

Things should be “nested” visually


Things should be nested visually1

Things should be “nested” visually


Bottom line

Bottom line…


Break pages into clearly defined areas

Break pages into clearly defined areas.


Format text to support scanning

Format Text to Support Scanning


Format text to support scanning1

  • Use plenty of headings

  • Keep paragraphs short

  • Use bulleted lists

  • Make it obvious what is clickable

  • Make use of negative space

  • Don’t let headings float

Format Text to Support Scanning


  • Login