Recent articles
Two first steps on web designing »
Some days ago I made a public question to my favorite web designers.
Unfortunately I did not get the feedback I expected.
Yesterday I got an email from Dave Shea (thanks!), who kindly pointed me to some clever, and logic, issues to get a better feedback from designers.
So, it would be great if you, everybody into web design, could tell us:
What are the two first steps you take when starting a web design project?
A quick and simple answer is enough, for example, in my case is:
Logo and color palette.
Of course you can elaborate and include more steps.
Regards!
En: Design Web | Por: Alexis | @ 9:23 am
12 Comments
Leave a comment
Line and paragraph breaks automatic, e-mail address never displayed, HTML allowed: <a href="" title="" rel=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <code> <em> <i> <strike> <strong>
Assuming the job has been established, I have an outline of the project, and we’ve agreed to commence work… The very first thing I do is sit down with a sketchpad and see what comes out of it.
Nothing beats free-flowing drawing, where you can easily reject ideas that aren’t working without spending time polishing them to see if they’ll work with a bit of gloss. It’s tempting to try and force something that probably isn’t the best solution when you’re in Photoshop; much more difficult to do so on paper.
Comment by Dave S. — 7/13/2004 @ 11:31 pm
First two steps taken directly from my Design Process article:
1. Discovery phase: Any project, no matter how big or small, can benefit from research and planning before the work begins. Design is no exception. If discovery begins before the exploration commences, the probability of finding a successful direction for the project only increases. The amount of time spent on this phase is usually proportional to the overall scope and planned duration of the project.
2. Competitive Analysis: Another helpful task in the process involves looking at pre-existing ideas and executions created by peers, mentors, heros, and/or competitors. Competitive analysis identifies the strengths and weaknesses of those existing designs. It can reveal gaps which still need to be filled and shortcomings which should be met. The ability to study what others have designed for the same (or similar) problem lends a sizeable advantage, since a great deal can be learned from their successes and failures.
So before any type of design exploration begins, a little advance research and analysis can go a long way to propel you down the right track.
Comment by Doug — 7/15/2004 @ 2:00 pm
Thank you Dave and Doug, very good ideas!
Comment by Alexis Bellido — 7/15/2004 @ 2:12 pm
I usually go through some sort of a discovery process, usually meeting with the client, finding out what they expect from their site. If they have a site already (most of our clients have had at least one site), I find out what they thought was successful on their current site, what they thought was unsuccessful, and what they just plain didn’t like.
I look at the logo and their “corporate colors” for the look and feel of the site. I also look at one kind of industry they are in. For instance, a site for a Bank will have different presentation requirements (and expectations) than a site for a Travel Agency.
I also look at their competitor’s sites, whether they give us a list of sites or we do quick Google search for them.
Most of all I try to listen to what the client wants and deliver it in a way that I am comfortable in doing.
Comment by Jeremy Flint — 7/16/2004 @ 2:08 pm
I agree with Jeremy, but I also look at creating a content only page without any design, so I can establish the priority of the content as I want it to appear when it’s degraded. Then I start sketching and messing with wireframes.
Comment by Ben Vaughan — 7/16/2004 @ 3:12 pm
Yeah, my process for actually creating the site now is to completely markup as much as I can structurally, then go back and write the styles for it.
There are a few times that I will need to go back and add a DIV or something to that effect, but usually i can get just about an entire site (or at least a template page) created structurally before i even apply my design.
Comment by Jeremy Flint — 7/16/2004 @ 3:28 pm
Hi, I was re-reading Doug’s article and he has a good point there. I remember reading it many months ago and starting to play with the napkin sketches he suggests.
This post also inspired me to revisit Dave’s garden, long time I did not go there, great designs.
Color palette continues being an important step for me, but if I have to go back in time I think that getting the “feel” of the project would be the first thing to do, of course this includes research.
I think this post and, specially the comments, will be an excellent resource for every web designer, later I think we will be able to talk (I’d prefer to do it in another future post to keep this one focused in one subject) about implementation details.
Comment by Alexis Bellido — 7/16/2004 @ 5:07 pm
In the education market (as it probably is in the small business market) I don’t always have an established logo, typeface selection, branding or even imagery to work from. Often, I’m given a preliminary first tier navigation set, some artistic direction suggestions and little more. As a result step one is to determine typeface and color options in Photoshop. On a tight budget with little alloted for photography broad conceptual exploration isn’t an option so the simple typographic approach is best.
Because the education market often requests the same site features (news, calendars, galleries) I have a general understanding of the designs requirements even though there may be no project-specific requirements defined yet. Step two is to take the colors and type ideas that evolve out of step one and explore page layouts and grid options on paper before returning to Photoshop.
I guess with that said, I’m more of a stylist than a designer at this point. Working within a vertical market, the ideal design and hierarchy have often been established by previous projects. What’s left is making that design unique.
Comment by Shaun Inman — 7/17/2004 @ 12:03 pm
The Design Process
Everybody who designs hopefully has a process. What’s yours? I’ve also done a google search that brought some other process unrelated to web or print, but some to manufacturing and other industries –quite interesting! Here’s one from Douglas Bouma…
Trackback by Life is… — 7/18/2004 @ 11:20 pm
I use these for screen and print projects:
First: Typography
It doesn’t matter to me if the source is an organization’s brand/logo, or if I have free reign to determine the appropriate typographic tone for the project, but I always begin with typography. Everything seems to flow more naturally once the typographic style is in place.
Second: Color
Where typography sets the style for me, the color scheme controls the emotion, the feeling, the abstract qualities of a design that can make it come alive.
We can’t have control over those elements on every project (most of them even) because of existing brand requirements, logos, or even “favorite colors of the CEO” (ran into that one this week), but that’s where I prefer to start.
Comment by Dan Rubin — 7/20/2004 @ 11:47 pm
You have noticed an important issue Dan: Typography, is a whole field in itself. I think it deserves its own post.
Thanks for your visit Dan, these comments are turning into a very helpful resource of ideas.
Comment by Alexis Bellido — 7/21/2004 @ 9:36 am
It’s all a bit one man gang around here isn’t it?
Here is a different answer to the masses.
Working in a company, logo and colour pallete are still steps ahead of any large project. Working in a 3 man team one cannot just go off on their own and start.
All the posts here are not really from the start. When you start building a house do you do so without plans or consultation?
#1 make a list of all jobs to be done - ie content gathering, collecting print material, migration of servers and so on.
#2 Go through the list and assign one of the team to the job.
Comment by Marc — 7/21/2004 @ 6:58 pm