Processes
Download
1 / 68

Processes - PowerPoint PPT Presentation


  • 94 Views
  • Uploaded on

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

loader
I am the owner, or an agent authorized to act on behalf of the owner, of the copyrighted work described.
capcha
Download Presentation

PowerPoint Slideshow about ' Processes' - marv


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

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

Production


Postproduction

Postproduction


Project management 101

  • What is a project? multimedia project into one, unified finished 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 multimedia project into one, unified finished project

  • Planning

  • Execution

  • Monitoring and Controlling

  • Closing

The 5 Basic PM Steps


Initiation

  • Identify stakeholders multimedia project into one, unified finished project

  • Create a project charter – document that outlines:

    • Scope

    • Assumptions

    • Constraints

    • Budget

    • Schedule

  • Seek approval from the project sponsor - greenlight

Initiation


Planning

  • Form a team multimedia project into one, unified finished project

    • 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 multimedia project into one, unified finished project

    • 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: effective and efficient manner

    • 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: effective and efficient manner

    • 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 effective and efficient manner

  • 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 effective and efficient manner

  • Design

  • Development

  • Launch

  • Post Launch

Web Design Process


Planning2

  • Requirements analysis effective and efficient manner

  • Project charter

  • Site map

  • Draft SOWs and Contracts

  • Secure servers, hosting, file structure, etc.

  • Identify necessary resources

Planning


Design
Design effective and efficient manner


Multimedia design

Multimedia Design effective and efficient manner

Visual Communication: Elements and Principles


Visual communication

  • effective and efficient mannerThe 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 effective and efficient manner

  • 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


“The medium is the message.” effective and efficient manner

Marshall McLuhan


“Content is king.” effective and efficient manner

Bill Gates


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

Steve Jobs


Principles of design

  • Unity Design is how it works.”

  • Emphasis

  • Perceptual Forces

Principles of Design


Unity

  • The “perceptual glue” that holds a design together Design is how it works.”

  • 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 Design is how it works.”

    • 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

Emphasis


Methods of emphasis

  • Contrast Design is how it works.”

    • 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 Design is how it works.”

  • Figure-Ground

  • Psychological Closure

Perceptual Forces


Balance

  • Symmetrical Design is how it works.”

    • 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 - Ground


Psychological closure

Psychological Closure


The development phase

The Development Phase information is provided

Putting it Together


Development phase

  • Setting up environment/framework information is provided

  • 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 information is provided

  • 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

  • information is providedIf 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 information is provided

  • 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 information is provided

A little less important

Nowhere near as important

Create Visual Hierarchies


Create visual hierarchies1

  • Effective visual hierarchies have 3 traits: information is provided

    • 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 information is provided

A little less important

Nowhere near as important

The more important something is the more prominent it is


Editor demo

<h1>Header 1<h1/> information is provided

<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 information is providedproximity: 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




Bottom line

Bottom line… information is provided



Format text to support scanning
Format Text to Support Scanning information is provided


Format text to support scanning1

  • Use plenty of headings information is provided

  • 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


ad