SitePoint Sponsor

User Tag List

Results 1 to 11 of 11
  1. #1
    SitePoint Enthusiast
    Join Date
    Feb 2009
    Posts
    46
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Question What is your design process?

    What is your design process?
    FREE Web Consulting:
    I critique websites for free & offer advice on improvements!

  2. #2
    Follow: @AlexDawsonUK silver trophybronze trophy AlexDawson's Avatar
    Join Date
    Feb 2009
    Location
    England, UK
    Posts
    8,111
    Mentioned
    0 Post(s)
    Tagged
    1 Thread(s)
    I first start by idea developing, I use a brainstorming method to pretty much put words up on the screen which describes the content of the website I am doing (words scattered about) then based on that I build a mock-up using wireframes to get the feel I want to emit from the design. Once I have this (and speaking with the client of course while doing this process if needed) I will take the wireframe and build it using HTML and CSS. Finally once it looks fine I will add all the functionality that makes the browsing experience much improved. This of course is a VERY basic and general overview but it’s pretty much the standard way to get stuff to screen which I've used for a while.

  3. #3
    SitePoint Enthusiast
    Join Date
    Feb 2009
    Posts
    46
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by AlexDawson View Post
    I first start by idea developing, I use a brainstorming method to pretty much put words up on the screen which describes the content of the website I am doing (words scattered about) then based on that I build a mock-up using wireframes to get the feel I want to emit from the design. Once I have this (and speaking with the client of course while doing this process if needed) I will take the wireframe and build it using HTML and CSS. Finally once it looks fine I will add all the functionality that makes the browsing experience much improved. This of course is a VERY basic and general overview but itís pretty much the standard way to get stuff to screen which I've used for a while.
    What do you mean by using wireframes when creating mock-ups, is there a tool you use for "wireframing"
    FREE Web Consulting:
    I critique websites for free & offer advice on improvements!

  4. #4
    Follow: @AlexDawsonUK silver trophybronze trophy AlexDawson's Avatar
    Join Date
    Feb 2009
    Location
    England, UK
    Posts
    8,111
    Mentioned
    0 Post(s)
    Tagged
    1 Thread(s)
    Wireframing is the process of essentially planning your design out with a series of images (frames) and connecting the different elements of that design together (the wire), you draw out components you would like to include, then place them in a document flow you think would best suit the content and design. Finally you take all those separate parts, join them together like a jigsaw, shuffle them about to apply the finishing touches and voila! You have yourself a model of a website you can start creating by using HTML and CSS to structure and style to match the model. Think of it alike to building a model of a building in architecture before you physically start applying the bricks and mortar.

    PS: I use pen and paper to do my wireframing however you could always use something like Visio or another "mapping" product for creating schemas.

  5. #5
    SitePoint Enthusiast
    Join Date
    Jun 2007
    Posts
    52
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    First I use pen and paper. Then I make the html-design and then I add the css code and the images.

  6. #6
    SitePoint Member microedge's Avatar
    Join Date
    Mar 2009
    Location
    Liverpool, UK
    Posts
    6
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Good question. My design process is as follows.

    1. No JPEG or PDF mock ups (these never work), any mock ups are always in the browser,
    2. Work out usability and navigation first,
    3. Use web standards (XHTML & CSS) - for the mock up and layput,
    4. Produce 3 variations of mock up for client to view (based on their needs),
    5. Send links to client for approval,
    6. Changes are quick and easy to amend when deciding on final design.
    7. Add code, database to start population of website as required,
    8. Check for validation and accessibility,
    9. Send link to client to approve,
    10. Website goes live.

    Steve Williams
    Website Designer
    Skype: micro-edge

  7. #7
    SitePoint Enthusiast
    Join Date
    Feb 2009
    Posts
    46
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    what CMS do you guys use for clients
    FREE Web Consulting:
    I critique websites for free & offer advice on improvements!

  8. #8
    SitePoint Member microedge's Avatar
    Join Date
    Mar 2009
    Location
    Liverpool, UK
    Posts
    6
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I have my own custom built CMs in PHP & ASP that I tweak to clients requirements.

    Srupal and Wordpress are probably the most popular open source CMS.
    Website Designer
    Skype: micro-edge

  9. #9
    SitePoint Addict RussAdams's Avatar
    Join Date
    Jan 2009
    Posts
    214
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    My first step is a hot shower. It is amazing how much my creativity gets flowing in the solitude and relaxing environment of the shower. After that, I just go where the creativity leads me.
    WebDesign.fm - my web design blog
    Web Design Inspiration Do Follow Blogs


    Follow me on Twitter - Russ Adams

  10. #10
    SitePoint Guru hgilbert's Avatar
    Join Date
    Dec 2004
    Location
    London
    Posts
    839
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Hypnagogic Hallucinations.


  11. #11
    Follow: @AlexDawsonUK silver trophybronze trophy AlexDawson's Avatar
    Join Date
    Feb 2009
    Location
    England, UK
    Posts
    8,111
    Mentioned
    0 Post(s)
    Tagged
    1 Thread(s)
    Quote Originally Posted by hgilbert View Post
    Hypnagogic Hallucinations.
    NO NO NO! The BLINK tag has ganged up with MARQUEE, they wonít stop chasing me... SOMEBODY HELP!


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •