I’ve long been a fan of Jesse Bennett-Chamberlain’s design work, and appreciate how openly he talks about his design process. Jesse was responsible for the recent redesign of the ExpressionEngine website, and over at Digital Web he gives us a warts-and-all walk through of the project. The article provides a fascinating insight into the workflow and problem solving methods of a talented web designer.
One thing that stands out to me about Jesse’s process is his use of wireframe mockups. While many web designers are content to scribble a rough sketch of the site layout and then leap straight into a full blown design, Jesse starts his designs by creating very accurate greyscale wireframe mockups. This approach seems to work very well for him, and you can observe how the strong grid structure and content organization of his wireframes are carried through into the final site.
Another tip I gleaned from Jesse’s Digital Web article is the source of the beautiful icons he uses on the site. They are created by Icon Drawer, and retail for $84, which seems very reasonable for a collection of 140 top notch icons.
Jesse’s article is the first in an ongoing Digital Web series called “The Working Designer”, in which leading web designer’s walk the reader through their design process. It is sure to be a fascinating series, so keep an eye out for future installments.
译文:
背后的故事--谈Jesse Bennett-Chamberlain的设计
我一直很喜欢Jesse Bennett-Chamberlain的设计作品，吸引我的还有他开诚布公的讲述设计过程的性格。Jesse最近正全力以赴的为ExpressionEngine网站重新设计版面，而他在《Digital Web》杂志上的连载文章毫不掩盖的告诉我们整个项目进行的过程。文章向我们展示了一个天才设计师工作以及解决问题的方式、方法。
看了他的文章，给我留下深刻印象的是Jesse在设计过程中使用了线框模型(wireframe mockups)。大部分网页设计师都会潦潦草草的绘制一幅网站布局草图，之后就直接着手去做了。而Jesse则一开始就会创作非常精细的灰阶线框模型（greyscale wireframe mockups）。该方法似乎很受用，你可以发现他的线框模型的网架结构和内容组织一直贯穿了整个站点设计。
我从Jesse在《Digital Web》的文章中获悉的另一个小窍门就是他在网站上使用的漂亮的图标。他们是由Icon Drawer创作的，零售价为84美元，对于能够一下子获得140个notch icon来说是十分值得的。
Jesse在《Digital Web》上发表了题为“工作中的设计师（The Working Designer）”的系列文章，现在还在连载中。他是首个在杂志上讲述整个设计过程的顶尖设计师。这一定是个很棒的连载，好好关注接下来的文章吧。