joshreisner / poverty-history

0 stars 2 forks source link

ICPH Homepage #152

Closed neongolden closed 11 years ago

neongolden commented 11 years ago

Hi Josh,

we have come to a homepage design decision.

Here are the designs and a couple explanations:

  1. Text above the title and navigation sample implementations are: http://happycog.com/

In general the text should move to the center with the navigation and title, when the browser window gets smaller. If possible make the boxes flexible in width and height, then the text can wrap around further if necessary.

  1. the colour blocks Inspiration for the page was something like http://minimalmonkey.com/ But, in an ideal world we would like to have the blocks stretch over the full width and be flexible accordingly. when the user hovers over one column the image should get the full colour value and enlarge slightly, sort of this, but without the text overlay of cuz http://tympanus.net/Tutorials/OriginalHoverEffects/index.html the 4 links guiding the user to different pages, like the timeline, the map, the story article the intro show up.
  2. the 'news' 2 input text fields, both for free content, arrows left and right would allow for more than one item, the text of the next item might move in from the left of right

Let me know how you would like to have the images cut, and what I can do to help you on this page.

The content for the links is in the dropbox --> Content/home

B

icph_13-08-02_home_top1

icph_13-08-02_home_top2

icph_13-08-02_home_top3

icph_13-08-02_home_hover

![Uploading ICPH_13-08-02_home_hover exp.png . . .]()

joshreisner commented 11 years ago

Thanks, looks good! I have a few questions to start:

  1. the text above the nav -- does it start off invisible but you find it if you scroll up? should it be on every page or just the home?
  2. does that text link somewhere? and does it always say the same thing?
  3. the bar -- is it transparent like the bar on other pages? if so, is it transparent even in the new part? if it's transparent, should the five home page images go all the way underneath up to the top?
  4. the color blocks - are the images slightly transparent with a full color background, or is there an overlay? it'd be great if we could make the "off state" with css so we only needed one image.
  5. insights: where do those link to? also the font heading looks lighter than we have. should we ask jeff to add that weight to the font package?
neongolden commented 11 years ago

Hi Josh,

here my answers

  1. Text, the other way around, text is there when you load the page and scrolls of, fixing the nav at the top, have a look at the example I posted.
  2. From my understanding it links nowhere and is just always the same information (jeff, do you have a different understanding?)
  3. It can be transparent, but the images should start below or exact on the edge, still underneath the drophsadow, no need to have them in the background.
  4. I made the picture transparent (I think 60% opacity to let the bg shine through) hope that works in css?
  5. font, let my know... The link would also be flexible according to the content
joshreisner commented 11 years ago

Ok sounds good. Could you email me the JPGs to use for the columns?

Also, any idea on my question about where the Insights should link to? @jtancil?

Given that ours is not a one-page website like Happy Cog's lovely website, there's no reason for the top to ever scroll out of view. Was the idea that this should be on every page?

jtancil commented 11 years ago

Sent from a mobile device

On Aug 6, 2013, at 11:19 PM, Josh Reisner notifications@github.com wrote:

Ok sounds good. Could you email me the JPGs to use for the columns?

Also, any idea on my question about where the Insights should link to? @jtancil?

Given that ours is not a one-page website like Happy Cog's lovely website, there's no reason for the top to ever scroll out of view. Was the idea that this should be on every page?

— Reply to this email directly or view it on GitHub.

neongolden commented 11 years ago

Hi Josh,

here the images as png and jpg. I made them 320px wide, let me know if you need them in a different dimension.

era1 era1 era2 era2 era3 era3 era4 era5 era5 era4

neongolden commented 11 years ago

And they are also in the dropbox/production/final designs/home

jtancil commented 11 years ago

Looks like all that's left is:

joshreisner commented 11 years ago

Hey @jtancil time to have them start entering links for the carousel. They should go to "Links" in the sidebar in wp-admin.