- Dates
- Starts: 25-Aug-08, 10:08pm GMT
- Ends: 8-Sep-08, 10:08pm GMT
- Awards
- Award 1: $600, was awarded to RadicallyAwesome
- Award 2: $400, was awarded to summers
- Formats
- PNG, and JPG
- Contract
- Preview: crowdSPRING Contract
- Materials
- There are no materials for this project.
Creative brief
hi-- I'm building a site for finding real estate and looking for help with the graphic treatment. Specifically:
- a simple logo
- background image(s) and patterns
- graphics for navigation buttons
- choose fonts, color schemes and graphic treatments for HTML form fields.
the actual deliverables:
- a CSS file
- graphics files, including a CSS sprite -- PNG preferred
- an example HTML file (see below for HTML you can stylize)
please test
- on MSIE6,7, Firefox 3, and Safari
- at 800x600, 1024x768 and 1400x1050 (or something large)
note: the test page already supports different sizes
conceptually, I'm looking for a "french garden" sort of look:
- layout: a three column layout
- column 1 is fixed at 200px
- column 3 is fixed at 200px (but only shown on >1000px wide screens)
- column 2 is variable width, i.e. gets the rest of the space
- logo: a simple elegant logo in the upper-left corner. The actual
size can vary-- roughly 180x70 or so.
- background: I'm looking for something quite feminine:
- a background image of roses growing along the leftnav
(fixed at 200px to make it easy)
- some kind of soft pattern for the background
some ideas:
http://littlefrenchgardenhouse.blogspot.com/
http://www.sadieoliv...hgardenhouse/bg4.jpg
http://frenchgardenh.../fall/fall_toile.jpg
(this is the background for http://www.frenchgardenhouse.com/ )
http://www.frenchgar...frenchgarden_top.jpg
Here's the closest example of 'roses growing' I could find:
http://www.csszengar...=/154/154.css&page=5
which is obviously too dark and which doesn't leave room for
the logo.
- content background: I'd like a background behind column2 to highlight
it. The 'ripped paper' css zen garden example is OK, but perhaps you
can think of something better?
http://www.csszengar...=/154/154.css&page=5
One catch: since the content can vary in width and height, the
highlight-graphics have to stretch as well, i.e. have the center
of the outline graphics be repeat-able. I'll do this all in JavaScript.
- fonts: something like 'French Script MT' for navigational links,
something easier to read for the main body. I know-- normally,
you don't want cursive fonts on the web, but in this case, it's
just for the navlinks, which aren't the primary focus on the page. Please use only free/unencumbered fonts available online, i.e. so I can easily make more buttons myself.
- colors: please pick colors and design treatments for
- plain text, visited and unvisited hyperlinks
- HTML form entry fields:
- text input boxes and textarea's
- SELECT pulldowns, radio buttons and checkboxes
- lists of items (HTML ul/li elements)
- buttons: I'm looking for a button-set as a CSS sprite, for example:
http://maps.google.com/mapfiles/hpimgs6.png
the buttons I need are:
- "bubble" icon for google maps
- "x" icon for 'delete' this object
- printer icon for printing the page
- [+] or [>>] (your choice) icon for opening dynamic content
- [+] or [>>] (your choice) icon for opening dynamic content
- letter icon for sending email
- link icon for linking to this page
- bullet icon for lists of items (HTML ul/li elements)
an example CSS sprite file:
http://maps.google.com/mapfiles/hpimgs6.png
here's a dummy site you can stylize:
http://leswap.com:3000/
- Update 25-Aug-08, 10:37pm GMT
- oops-- if you don't write CSS, that's OK-- just submit screenshots. I can handle the coding. (but please make sure to handle the stretching requirements, as detailed above)
cheers!
adam