Read Time: 5m, 46s

What We’re Actually Doing to Your Website

January 30, 2014

What do the terms “designer” and “developer” actually mean? And how do these designers and developers actually put together your end product?

Michelle from our marketing team interviews lead developers Chris & Manie to unravel the creation process of your new website.

Q1.Can you tell us what the terms “development” and “design” actually mean?

A.Development and Design aren’t the same thing, and they’re both complex creatures. There are actually two distinct components of development. The first is called “Front End Development” which is concerned with the visual aspectof website. It deals with content, layout and design. The Primary development language is CSS (Cascading Style Sheets).

The second component is “Back End Development”, which deals with more complex programming that happens ‘behind the scenes’ such as online shopping carts and search functionality.

Design is involved in creating a visual representation of the site in a design program and is not involved in coding the site.

Q2. Can you explain the process the Design/ Development team goes through in building a website?

A. The process that we go through for building a website is broken up into 3 stages; Design, Bid and Build. The design phase is where all of the conceptual work and planning occurs. The Bid phase is where the project build requirements are solidified and build costs are finalised. The Build phase is where the planning is executed and the final (or phase 1) product is built. After the first 3 stages are complete, we like to go into an improvement cycle where we analyse performance, identify areas that could be improved, then further develop and roll out those improvements.

Design Phase

First we host a scoping meeting with the client. This is where one of our designers and developers get the opportunity to sit down with our client face to face to discuss the project.  We run through all of the functional requirements as well as visual design elements to go with it. This includes all of the ‘must have’ and ‘nice to have’ items. They can be refined in the Bid phase based on the Build budget. We like to ‘think big’ to start off with as that can pave the way for future iterations of the site. While this is a conversation format, it is also conducted in a logical systematic way to turn an often broad idea into something more specific.

After the designer and developer have everything they need, the designer sets up a series of wireframes to go along with a return brief and site map to ensure they are on the same page as the client. Wireframes illustrate the proposed layout and the return brief explains the elements presented as well as ideas for usability and design along with working reference websites. The site map is usually created by the designer in collaboration with our marketing team and the developer that was at the workshop.

Once wireframes, sitemap and return brief are agreed and signed off by the client, we move to the Mock-up phase.  In this phase our designer turns those wireframes into a design that reflects the clients brand and online goals.  This starts with a mock-up of the home page to get a look and feel for the rest of the sites pages. Once this home page has been finalised and signed off by the client, our designer puts the other feature page mock-ups together for approval. These usually include a standard content page, product pages, listing pages etc…

Our developer works with our designer through the mock-up process to determine how each of the designed elements will be built and implemented according to design. This is presented in a ‘Functional Specifications’ document. The purpose of this document is to create a set of instructions for the developer executing the build to follow. This will ensure that everything planned and mocked up can be achieved and explains how.  This also gives us a specific cost associated with each element, and will allow the Bid phase to be most accurate.

Once mock-ups are approved, the front-end developer designs a CSS (Cascading Style Sheet) style guide for the website. The style guide separates out key elements of the design which need to be consistent across the site. This may include colours, font and heading sizes & styles etc.

Bid Phase

The bid phase is where all components detailed in the Mock-ups, Return Brief, Site Map and Technical Specifications are costed up and delivered as the project scope.  This includes all of the ‘must have’ and ‘nice to have’ options. Through discussions with the client and referring to the overall Build budget, the first phase of the build is planned. This will usually include all of the ‘must have’ items and can often be an eye opener as to what ‘nice to have’ items can be included.

After the Bid phase has determined what will be built and how much it will cost, we can refine the scope and put together a build plan and timeline.

Build Phase

This phase initially has little involvement from the client other than compiling content through the help of their Account Manager while the development team get to work on a testing site.  Once the testing site is built and loaded up with content, it is checked for quality assurance against the scope of the project and build plan before it is handed over to the client to review.

There is usually at least one round of minor changes allowed for in the scope of the project and the client has the opportunity to compile a list with the help of their Account Manager for minor changes they would like to see implemented on their working site before launch.

Once these changes are completed and the client has approved the test site, deployment will start. We backup the original site add security features and add in tracking code for tools such as Google Analytics and webmaster tools. We have an extensive checklist of standard items as well as a custom checklist of project specific features that are tested and checked off as working on launch of the site.

Q3. How do you ensure the customer gets a great website they are happy with?

A. We have a very tight process and the client’s approval is required at each stage. Our briefing process is also very thorough with an in person meeting with the client and all of our design/dev team who will be working on the project involved. Rigorous testing helps ensure there will be no issues once the site is launched.  In adding all of this up, we need to make sure we have a website that our client is delighted with.

 

LOGO_Dando_800x100_Insights
Dando INSIGHTS is a monthly publication that takes the best of our learnings and…
insights and collects them into a series of easy to digest downloadable PDFs.

Share On

Sign up to our newsletter

  • This field is for validation purposes and should be left unchanged.