The Process

 

  1. 1. Creative Strategy & Discovery

    Our objective is to connect with an organization in an effort to understand internal processes, audience demographics and business objectives in an effort to translate that into a creative strategy.

    1.1. Initial Free Consultation

    We offer a free consultation to find out roughly what you intend us to do. We will provide you with a Website Planner. The objective of this document is to help us get to know your business - for instance, we need to find out:

    • Who you are and what you do
    • Who your target market/user is
    • Who your competition is
    • What design restrictions there might be
    • What deliverables you want from me
    • Timeframe and budget

    A more detailed consultation may be required.

    1.2. Website Analysis

     

    For website re-designs, the next step is to go through your website and list things that can be improved. The steps include:

    • Content Analysis (optimise copy for search engines and users, optimise graphics, etc)
    • Branding Analysis (colour schemes, demographics, logo re-design, etc)
    • Keyword Analysis (optimise for Search Engine ranking)
    • Signup Enticement Analysis (clarity, effectiveness, etc)
    • Usability Analysis  (user-friendliness, navigation, etc)
    • Markup Analysis (invalid markup, dead links, etc)

    1.3. Information Architecture & Site Map

    With your consultation, we list the relevant sections and subsections for your website. We list them on Post-It notes and stick them on the wall - this enables us to quickly and easily re-arrange them to create a logical layout.

  2. 2. Visual Design

    We design websites that stand-out from the crowd. We ensure the best presentation through elegant designs specifically targeted towards your industry and audience. Visual design can entail:

    2.1. Brand Identity Design

     

    We can also help with your brand identity design.

    The process can include brainstorming of name ideas, checking the availability of internet domains, experimenting with colour combinations and fonts.

    We can produce a selection of different logo designs for you to choose from. We can also mock-up letterheads, business cards, flyers, etc.

    2.2. Wireframe Design

     

    The information architecture is used as a basis for the wireframe designs (basic webpage layout designs).

    We start by first sketching the wireframes and then produce professional-looking wireframes with Adobe Illustrator. These are then passed onto you for acceptance.

    Once accepted, we can move on to creating mock-ups.

    2.3. Mock-up Design

     

    We already have the wireframes in Illustrator format which we can now use to create mock-ups. At this stage we have to always keep the following in mind:

    • Branding (ensure the design fits with the branding)
    • Demographics (ensure that the design suits the target audience)
    • Layout (grid design simplifies the development process)
    • Design simplicity (CSS will be used for styling, so need to keep it simple)

    Once you accept the mock-up design, we can move onto designing the details.

  3. 3. Functional Design

    At this point we list the necessary classes and functions that the website may require. For Joomla, we list the modules, components and plugins that need to be created. We also create database table designs and relationships at this stage (we require existing data from you at this point to help with the design).

  4. 4. Implementation

    4.1. Template Design & Navigation

    We can now start to create templates using HTML and CSS to reflect the mock-up design. With Joomla, we start by creating the templates, create the navigation menu structures. We will test the templates at this stage to ensure it looks good at different resolutions with different browsers.

    4.2. CSS Styling

    The pages are now styled with CSS and graphics.

    4.3. Content Creation

    At this stage the copy is added to the relevant pages.

    4.4. Graphic Creation

    Any required graphics are designed using Adobe Photoshop.

    4.5. Data-Entry

    The steps involved in the data-entry stage are:

    • Database table creation
    • Import of existing data or manual entry of new data
    • Products are entered into VirtueMart and images imported
    • Users created in Joomla/VirtueMart with necessary permissions

    4.6. Coding

    At this stage we can start to code the required components, modules, classes, plugins, etc. They can then be implemented into the pages at the relevant locations.

  5. 5. Testing

    We thoroughly test the website to ensure that:

    • the navigation flows intuitively
    • everything is laid out correctly
    • the pages work at different screen resolutions and with different browsers
    • all links are valid
    • the website meets your requirements

  6. 6. Delivery

    Once thoroughly tested, we will then deliver the existing website to you for acceptance. At this stage the design can be tweaked or improved.

    Upon acceptance, we can then add keywords and optimise your website for search engines. Once the website is finished, we upload the website to the web host and test it again thoroughly to ensure there are no problems.