Design direction

[slgill]

Chris, Saad and I went through the site and here are our notes to help provide some direction on the design. We also included some of the features we liked from some of the other hack-a-thons.

Design Direction

• Work from mobile look and feel - peacecorps.gov/mobile
• Use top header for logo and color/texture
• Include logo and Peace Corps with “Mobile” | “Desktop” (to take users back to homepage from whatever device they came from)
• Consider depending on how it looks, if you need a bottom footer (use brown “hut” graphic – think about whether social media icons should be included here or probably better integrated into the section itself as you are going through it (e.g., viewing a job listing and option to “share”)
• Map: consider instead of “gray” perhaps more for a brown/tan /teal color scheme – something more in line with color palette of the website. For arrow (consider orange instead of green)
• Change regions (see new listing in Github) and connect the functionality (not apparent in the mock-up).
• Change “Which field are you interested in?” to “Which work area are you interested in?”
• Job listings: pick-up color palette. Include sector icons with each listing for fast view

ADDITIONALLY,
Please see list below from other hack-a-thon mock-ups that were interesting in how they presented actual job listing information and use of filter and icons.

Considerations based on Hack-a-thon prototypes (http://prezi.com/4tmjrjejipqh/berkeley-hackathon-update/):
· Quick view: positions open/application/notification date/departure date
· Ability to bookmark this job/saving/social icons
· Pop-up/window detail page (can you still bookmark?)
· Use of sector icons
· HeroKuapp.com) Not sure truncated project description works as well as short description (or appeal) to lead into longer description
· (Meteor.com) Pick-a-date slide ruler functionality interesting—need to use correctly
· (MIT) Guided Search and use of filtering system (box check without having to create new search each time)
· (Ops) Like brief description of sector
· (Corp Connect) – Like filtering capabilities

[Mc4llister]

Made the top items check boxes by putting the following code in front of each line, "- [ ]"

[kststudio]

@slgill Is it possible to get the Archer font? It's not a big deal because I can continue to use Georgia (desktop font) for now.

Can I also get the brown square box design that currently in the header of the mobile view?

[Mc4llister]

@kststudio Great question. Would we need log in credentials for things like bookmarking?

[Mc4llister]

Looking at the check boxes in the initial ticket, I believe we're set on the site being mobile responsive, yes? #3

The other open checkbox, the regions, is being discussed in #42, so we could likely just work on that ticket and close this one unless there are other items not yet covered? @slgill, anything you see missing?