512 storyboards and prototypes

7/29/2019 512 Storyboards and Prototypes

1/13

Concurrent Design: Putting Design Plans into Development Action

1

Table of ContentsMessage Design ............................................................................................................................................ 2

Interface ........................................................................................................................................................ 3

Flowchart of WBI Beginning Spanish 1a ....................................................................................................... 5

Storyboard for Beginning Spanish 1a ........................................................................................................... 6

Streamlined Storyboard ............................................................................................................................ 6

Detailed Storyboard Sample ................................................................................................................... 10

Technical Concerns ..................................................................................................................................... 12

Questions ................................................................................................................................................ 12

Technical Solution Summary ................................................................................................................... 12

Formative Evaluation Review ..................................................................................................................... 13


2/13


2

Message Design

Message and Visual Design for WBI Beginning Spanish 1a

FEATURE/PRINCIPLE APPLICATION IDEAS FOR LESSONS

1. Text Elements Written clearly and concisely. Succinct directions for how to use WBI, LMS, and how to progress

through practice exercises, and assessments.

Scrolling will be as minimal as possible. White space used effectively so page will not appear crowded,

difficult to read, or complex.

2. GraphicalElements:

Buttons, icons,

tables, charts

Buttons located consistently on Web page. Icons are relevant to content or function. Tables and charts used to organize information. Include return link to WBI.

3. Media: photos,video, audio,

graphics, and

illustrations

Media is relevant to content. No blinking text will be used. Graphics size will be consistent with intended purpose and Web

page size.

4. Simplicity Web page will be easy to read.

Web page text will read like a book, left to right, top to bottom. Avoid overcrowding General text colors will be limited to three: black, dark gray, and

brown

Longer pages will use links and buttons to move to differentsections.

5. Balance Pages will vary in symmetry, but still remain consistent. Text and figures will be used to organize information on the page.

6. Emphasis Important information and due dates will be bold and written in the

same contrasting color (dark orange). Infinite verbs will be all upper case letters. Spanish words within English text will be italicized. Headings of sections will be bold type.

7. Harmony (orUnity)

Consistent theme and color scheme will be used. The same icons will be used throughout the Web site to identify


3/13


3

related content.

Interface

The interface for the WBI Beginning Spanish 1a will rely on a metaphor that relates to

building a house: foundation, walls, windows (and doors), (living) space, and decoration. The

chosen graphics and icons will relate to this theme and will be used on all Web pages

throughout the course. Text, graphics, and media will be used to present content and

information. Blinking text will not be used and scrolling will be kept to a minimum. Pages will

have sufficient white space so as not to appear cluttered or difficult to read.

Pages will employ the same four colors: black, white, and brown with important

information emphasized in dark orange. Colors will be applied consistently throughout the WBI

site. Colored building icons will be used, for example a hammer will imply vocabulary building, aruler will imply assessment items, etc. Unit links will be located in a navigation bar across the

top of the page, while unit content and information buttons will be located on the left side of

the screen in a menu format. Content, assignments, directions, and information will be to the

right of the menu and below the units navigation bar. A sample proposed interface follows:


4/13


4

HomeGeneral

InformationUnit 1 Unit 2 Unit 3 Unit 4 Unit 5

Introduction

Vocabulary

Grammar

Assignments

Assessment

(Sample icons found athttp://office.microsoft.com/en-us/images/?CTT=6&ver=14&app=winword.exe)

Content presentation, Activities, Directions, etc.

will display here when icon is opened.Instructor email

and contact

information

Additional links

of interest.

Links relevant

to Unit/Paso

Back/Forward

Unit number, title, sub-title, and PasoUnittheme

icon

Unit

/Paso

navigation

buttons
http://office.microsoft.com/en-us/images/?CTT=6&ver=14&app=winword.exehttp://office.microsoft.com/en-us/images/?CTT=6&ver=14&app=winword.exehttp://office.microsoft.com/en-us/images/?CTT=6&ver=14&app=winword.exehttp://office.microsoft.com/en-us/images/?CTT=6&ver=14&app=winword.exe


5/13


5

Flowchart of WBI Beginning Spanish 1a


6/13


6

Storyboard for Beginning Spanish 1a

Streamlined Storyboard

Title of Page Text Summary Navigation /Sites Other/Comments

Title Page Welcome

Course Overview

Course Goal

Instructor introduction

Course Home link

Unit Home links

Syllabus link

Help link

FAQ link

LMS link

Participant informationlink

Announcements from

the instructor link

Reunimos! (Community

news and socializing)

Course theme visual

Instructor email, and

other contact

information

Navigation/

Directions

WordPress blog set up

instructions

GoogleDrive setupinstructions

Audacity setup

instructions

LMS setup instructions

Assignment submission

expectations

Netiquette information

and expectations

Participation

expectations

Course Home link

Spanish Keyboard

Transformation link

WordPress Blog Login

link

Shared GoogleDrive link

Audacity link

LMS link

Netiquette link

Course theme visual


other contactinformation

Syllabus (Currently being

developed)

Course Home link Course theme visual


other contact


7/13


7

information

Each unit page

will have the

following pages

Course Home link

Unit Home link

Forward buttonsBack Button

Unit theme visual

Unit title

Instructor email, andother contact

information

Other useful sites links

related to unit.

Unit

Introduction

Introduction

Unit overview

Unit objectives

Vocabulary Themes (A &B)

Course/Unit Home links

Forward/Back buttons

Slide-show link

Video linkPaso A & B navigation

icons with captions

Unit theme visual

Unit title


other contact

information

Paso A

Instructions

Paso information

Progression of activities

Assignments and due

dates

OJO! (Look close/pay

attention!) comments

Course/Unit/Paso Home

links


Paso activity navigation

icons with captions

Paso practiceassignment answer links

Unit theme visual

Unit title and Paso


other contact

information

Vocabulary A Vocabulary themes (3)

Instructions

Practice assignments

due dates



3 audio/visual

vocabulary presentation

links

Practice assignment links

Unit theme visual

Unit title


other contact

information

Grammar A Essential Question

Paso A Objectives

Instructions


due dates



3 Grammar lesson links


Unit theme visual

Unit title


other contact

information


8/13


8

Assessment A Quiz directions and

information


Formative Quiz link

Unit theme visual

Unit title


other contact

information

Long-term

project

Directions for this

portion of the project

Submission directions

and due date


Overview of project link

Sample project link

Submission link

Unit theme visual

Unit title


other contact

information

Sample project link

Paso BInstructions

Paso informationProgression of activities

Assignments and due

dates

OJO! (Look close/pay

attention!) comments

Course/Unit/Paso Homelinks


Paso activity navigation

icons with captions

Paso practice

assignments answer

links

Unit theme visualUnit title and Paso


other contact

information

Vocabulary B Vocabulary themes (3)

Instructions


due dates



3 audio/visual

vocabulary presentation

links


Unit theme visual

Unit title


other contact

information

Grammar B Essential Question

Paso A Objectives

Instructions


due dates



3 Grammar lesson links


Unit theme visual

Unit title

Instructor email, andother contact

information

Assessment B Quiz directions and

information


Formative Quiz link

Unit theme visual

Unit title


9/13


9


other contact

information

Paso C

(Chapter 4 only)

(Will follow the same

structure as Pasos A & B)

Unit Wrap-Up

activities (see

below)

Review of unit objectives Course/Unit Home links


Wrap-Up activity links

Unit theme visual

Unit title


other contact

information

Listening

assignment

Listening instructions

Listening assignment

and due date


Listening audio/visual

link

Submission link

Unit theme visual

Unit title


other contact

information

E-pal

assignment

E-pal assignment

instructions

E-pal assignment and

due date


Submission link

Unit theme visual

Unit title


other contact

information

Oral

presentation

Presentation

instructions

Presentation assignment

and due date


Submission link

Unit theme visual

Unit title


other contact

information

On-Campus

Activities

Description of on-

campus discussion

Activity preparation cues

Course/Unit Home links Unit theme visual


other contact

information

Questions or expected

activities of on-campus

visit

Unit Final Evaluation directions Course/Unit Home links Unit theme visual


10/13


10

Evaluation Evaluation due date Evaluation link Unit title


other contact

information

Course Wrap-Up

activities

Review course

objectives

Course survey link Course theme visual


other contact

information

Travel abroad links

Continuing course link

Final Course

Assessment

Final Test information

and Directions


Course Final Test link

Course theme visual


other contact

information

Detailed Storyboard Sample

Screen Instruction:Text: Century Gothic

Text Color: BlackOJO! Color: Dark Orange

Message Block: BlackBack/Next/Link icons: BrownNew information: Dark grayLink color:DefaultBackground: Light gray


11/13


11

HomeGeneral

InformationUnit 1 Unit 2 Unit 3 Unit 4 Unit 5

Instruccin

Vocabulario

Gramtica

Tareas

Evaluacin

Unit 1: Laying the Foundations The Building Blocks of Spanish

Paso 1

Introduccin (Introduction)

Have your ever thought about what it takes

to build a house? Learning Spanish is very

similar. You must have a solid foundation. A

solid foundation ensures that a house will notcollapse, and so a solid foundation of basic

Spanish vocabulary, grammar, and culture

helps you not fall apart when presented with

a situation that requires you to speak in

Spanish.

In this lesson you will begin to build your

Spanish foundation by beginning to read,

write, and communicate in Spanish. You will

also hear how Spanish influences the worldaround you, increases your opportunities,

meets the growing need for bilingual

speakers, and how it can help you better

understand English. And finally, you will begin

to explore the Spanish speaking world.

(Insert slide-show 1.a)

(Insert video 1.a)

Mrs. Shannon

Foster

Keyboard

Transformation

Digital Dialects
mailto:[email protected]:[email protected]:[email protected]://edtech.adobeconnect.com/_a768376479/keyboardtransformation/https://edtech.adobeconnect.com/_a768376479/keyboardtransformation/https://edtech.adobeconnect.com/_a768376479/keyboardtransformation/http://www.digitaldialects.com/Spanish.htmhttp://www.digitaldialects.com/Spanish.htmhttp://www.digitaldialects.com/Spanish.htmhttps://edtech.adobeconnect.com/_a768376479/keyboardtransformation/https://edtech.adobeconnect.com/_a768376479/keyboardtransformation/mailto:[email protected]:[email protected]


12/13


12

Technical Concerns

Questions

Questions About the Server Questions Related to Website Support

How do I access to the development server?

Is the production server different than the

development server?

How do learners access the server?

What will my URL be?

How can the LMS be used?

Are there other policies that I need to know?

When is the site backed up?

Are there server access hours?

Who will provide help when problems arise?

Technical Solution Summary

General Technical IssuesWBI development and production are on the same server.

Access is available from any home computer with dial-up, T-1, or DSL.

Learners have access to the schools computer lab during school hours and weekends from 10:00 am to

2:00 pm MST.

There are some visuals and video, but most are small enough to download efficiently with any of the

above access.

Access to systems is available from 1:00 am until 12:00 am MST. The sight is backed up every evening

from 12:00 am until 1:00 am MST.

Server CapabilitiesThe Technology Co-Op that Westside Junior and Senior High School is associated with will be responsible

for technology support.

Learners will be entered in by the Business Manager or School Counselor when all required learner WBI

registration forms are completed.

Cross-Browser FunctionalityTwo primary browsers will be used to access instruction: Firefox and Google Chrome. A minimum

version will be established.

ADA Requirements

Because of the nature of a second language course, ADA requirements will be met on astudents need


13/13


13

to access basis based on an official IEP.

Copyright Issues

Copyright materials will have authorized documentation with express permission for use on file for use

of materials.

Materials created by the instructor will maintain copyright ownership.

Use of Editors

The developer/instructor will use an editor to develop the WBI.

Formative Evaluation Review

The initial field trial will commence following the development of the WBI course. Feedback from the

subject matter expert, instructional design expert and end-users will be taken into consideration and thecourse will be adjusted to the best of the designers abilities.

512 storyboards and prototypes

Documents