AUDIO/VIDEO SELECTION

WIREFRAMES -- BLOG BLURBS & PHOTOS

WIRE FRAMES - VIDEO/AUDIO

Color Schemes

HOME / SECTOR Design 2 Andrew Zahn

COLOR Andrew Zahn

Wireframe Ideations: Andrew Zahn

HOME

VIDEO / PHOTO

ARTICLE

AUDIO

Brian class sketch

Final Design Info

Media mobilizing - the network of organization - overarching

gray, black and red

All for the taking - housing and development

Our City Our Voices - immigration

Youth and Education

Labor Justice - new labor, traditional labor organizing (taxi drivers, hotel workers, day laborers)

Media Justice - media policy, locally and nationally especially broadband internet, radio, public access tv

next week:

set of wireframes - home page, sector page, article, video/photo, audio

color palette - mediamobilizing.org, allforthetaking.org, phillylabor.org, phillyeducationjustice.org, ourcityourvoices.org, and media justice  (see descriptions above)

Resolution size: 960 x 600 pixels (Size of design layouts) W/ Full Bleed , ie, no margins

Andrew Zahn MMP Design 2(smaller)

Andrew Zahn MMP Design 1(smaller)

Wireframe - Video/Audio Page

Color and White Space

ColorSchemer Gallery:
http://www.colorschemer.com/schemes/

This is a really extensive list of web friendly color schemes that hopefully will provide inspiration as you think through the different areas of organizing/sectors on the site and appropriate color schemes.

Web.Without.Words
http://webwithoutwords.com/blog/

This site makes an interesting display of the layout of different web pages by removing the words from each of the pages. It is an example in whitespace, and helps show how different pages are arranged.

Also, for a more explanatory take on white space in web design look here:
http://webdesigntuts.com/web-design/using-white-space-effectively-in-web-design/#what

Project Photos

Site Sketches

Wireframe sketches

Brian's Links

Useful links - Sectors of Organizing and Media

Sectors of organizing
Network Home Page - http://mediamobilizing.org/
Labor Justice
All for the Taking (Housing and Development)
Our City, Our Voices / Nuestra Ciudad, Nuestras Voces
Youth and Education
Philly Media Justice - No page yet
Media Mobilizing Project -

Video
http://www.youtube.com/user/media4movements
http://mmpvideos.blip.tv/

Radio
Labor Justice Radio - http://laborjusticeradio.podomatic.com/
On Blast (Youth Produced) - http://onblast.podomatic.com/
Radio Tlacuache - No page yet

Photographs
http://picasaweb.google.com/mediamobilizing

Major Partners organizations (Our Network)
Philly Student Union - http://home.phillystudentunion.org/
Unified Taxi Workers Alliances - http://www.twapa.org/

MMP Call out 1

Main MMP Links

MMP website

http://allforthetaking.org/

http://ourcityourvoices.org/

http://phillylabor.org/

http://phillyeducationjustice.org/

http://mediamobilizingproject.org/

Important Design/Inspiration Links

STYLE/AESTHETICS --

http://www.okayplayer.com/

http://libraries.imjohnwaller.com/

http://www.hotmeteor.com/

http://www.studiomikmik.co.uk/

http://www.markdearman.com/

ORGANIZATION GROUPS/IMAGES

http://tumis.com/

http://www.ospaaal.com/

http://designforsocialimpact.com/fs.porthome.html

http://cimarrones.org/

http://peoplesproductionhouse.org/ (MMP's FRIEND)

MMP Links

Youtube

Picasa

Design Inspiration

http://www.hotmeteor.com/

http://www.studiomikmik.co.uk/

http://www.markdearman.com/

New Elements

The following is a preview of the new aesthetic elements that will be incorporated in the new webpage design.

MMP Original Homepage Critique

MMP Original Homepage Critique

The homepage has no clear navigation.
There are small colored buttons (color-coordinated?) at the top of the page that link to other spaces in the webpage, but provides no information about the page the user is about to visit. (Suggestion -- tool tip?)

The homepage is very congested, and the information architecture is confusing and unclear.


The page scrolls down, with a right hand bar navigation that is the length of the page.

This right hand navigation is too much navigation for a single unit.

A restructuring of the navigation bar, including what kind of information to link to and where to place it throughout the site, is necessary.


The page has no footer. You have the option to scroll through previous posts. Posts are organized in a dated "blog-like" content. There could be better navigation of these "blog-content"/updates posts, organizing the posts by date, content, and what organization they belong to.

There is a small, easily overlooked button that asks for feedback at the bottom of the page. This feedback unit should have more focus placed on it. Feedback is key in this project.