Field 2 Design » design

CSS Coding tip

admin — Fri, 05 Aug 2011 23:15:12 +0000

I see too many people styling the list of links, aka the nav bar, at the wrong level.
Styling should target the youngest generation as much as possible. Consider this html:

Home

About Us

UL is the grandparent, LI is the parent, A is the child.
I commonly see this css:

ul.nav, ul.nav li {margin:0;padding:0} //reset the default list spacing browsers
ul.nav li {float:left;width:100px;height:30px;line-height:30px}

Much better is:

ul.nav, ul.nav li {margin:0;padding:0} //reset the default list spacing browsers
ul.nav li {display:inline}
ul.nav li a {display:block;float:left;padding:0 24px;height:30px;line-height:30px}

This enhances the usability of the nav bar. The user does not have to click specifically on the text to navigate the site, but instead she can click anywhere in the block around the text. There are additional advantages to this method that I will explain at some point.

Bottom line: target the youngest child in any block of code with your css, and move up a generation only when necessary.

NEA Logo udate

admin — Wed, 16 Feb 2011 23:29:10 +0000

Looks like the NEA is finally using their new logo:

http://www.nea.gov/manageaward/logos/index.html

Congrats to Hoon Kim and Why Not Smile

http://whynotsmile.com/

I still think, as do many in the design community, that the whole contest thing was a bit odd, at the very least, and downright unethical at worst. Since the contest launched last spring, the NEA has said nothing about the winner and/or the process by which the logo was selected. In any case, I think the new logo is spot-on and hits the target. See my older posts on this topic for a link to my entry, which in retrospect seems a bit overcomplicated.

Didn’t win the NEA logo Contest!

admin — Wed, 14 Apr 2010 14:32:05 +0000

So after waiting in the dark a while, I got this email yesterday:
“April 13, 2010
Subj: Notification of Contract Award RFP 10-06 to Propose a Design for an “Art Works” logo for the National Endowment for the Arts (NEA)
Dear Prospective Offeror,
The Federal Government, National Endowment for the Arts would like to thank you for your proposal in response to our Request for Proposal RFP 10-06 to Propose a Design for an “Art Works” logo for the National Endowment for the Arts (NEA).
Unfortunately, your proposal was not selected for award. The Federal Government, National Endowment for the Arts would like to provide you with the following information regarding the solicitation/award. Specific information pertaining to the award is listed below.
Number of proposals received: 559 The total estimated contract price: – Why Not Smile LLC, in the amount of $25,000
Name and address of offeror receiving the award: Why Not Smile LLC 10 Jay Street, Suite 801A Brooklyn, NY 11201
The Federal Government, National Endowment for the Arts (NEA wishes to thank you for the time and effort you devoted to participating in the subject solicitation and encourage your organization’s participation in future procurements.
Again, thank you very much for your cooperation and assistance in this acquisition process. Sincerely,
Latonca M. Harris
Latonca M. Harris Contracting Officer”

Oh well, 1 in 559 is pretty tough odds. Congrats to the winner, I’m looking forward to seeing the end result.

NEA Logo contest entry

admin — Tue, 09 Mar 2010 23:32:24 +0000

So last month I spent a bunch of time working on a logo design in response to Uncle Sam’s RFP: http://artsbeat.blogs.nytimes.com/2010/02/01/wholl-design-the-new-nea-logo-it-could-be-you/
. Regardless of what I think of spec work, I love high scale design competitions. Too much design is born from who-you-know and schmoozing.

Here’s my scrapbook file:

and the final entry:

JOMA machine website

admin — Mon, 26 Oct 2009 19:42:23 +0000

This is one of my favorite designs. My brother-in-law owns a precision steel machine parts manufacturing company near Reading, PA. He’s Swiss, well his parents are anyway, so I thought I’d go heavy on the helvetica and grid.

Click here to see website

The BBPress icons

admin — Fri, 28 Aug 2009 15:07:33 +0000

Here’s some recent icons done for BBPress:

Gallery 3 icons

admin — Fri, 28 Aug 2009 15:00:14 +0000

I’ve been working on icons for the upcoming release of Gallery 3 (http://gallery.menalto.com/). Here they are:

Sample icon file for wordpress plugins

admin — Sun, 31 May 2009 19:47:59 +0000

icon_effect.zip

You can download this file and use it as a starting point when designing plugin icons, so that they resemble the default set in WordPress’ admin area. Copy and paste the effect applied to the rounded rectangle shape to your own vector shape in Photoshop.

Comment icons

admin — Fri, 03 Apr 2009 01:22:45 +0000

OK, dilemma here. Does the pointy part of a comment bubble icon face left or right? Consider:

versus:

so, which one says “Comments” more directly?

To clarify, here’s the one in the WordPress admin (I designed it):

And here’s the one on digg.com:

I kinda wish now that I had made the point face left, like in digg.com, but maybe not…

The extra icons

admin — Wed, 03 Dec 2008 05:00:25 +0000

I did a ton of icons for the project icon contest, here’s a chart of ones that didn’t make the cut:

the losers