The Process of Designing a Website

I don’t want to give away all my secrets. But today, I will be sharing with you the process in my point of view on a normal basis with clients and the team here at Atilus.

1. Learn About the Client

Here at Atilus we take the time to learn about you (the client) and apply a professional industry design to your business/brand. One of the best ways to learn about a client is to have a questionnaire ready. Asking questions allows you to define who the client is and who they want to be.

For example, “Why do you want to have a new website, or have your current site redesigned?” “who do you want to be, how do you want to be portrayed?”.

This is also a good time to ask about branding elements such as colors, current logo (possible upsell opportunity.) There are examples of these questionnaires all over the internet and every designer is different so it may be worthwhile to create your own custom set of questions.

2. Draft Wireframes

The next step in the process is to draft wireframes based on the information you have learned. We use an online tool called Wireframe | CC. This tool allows us to draft and easily share the basic outline of what we are envisioning for the site design.

3. Share Wireframes & Ideas with Team to Confirm

Once the wireframes are complete, it’s time to share with your colleagues. Have a short 15-minute meeting and go over what you have created and explain each page to them one by one. If your team has any questions or changes to the wireframe, make sure you make them before sending the wireframes off.

4. Send Wireframes to Client and Get Approval

Now that the wireframes have been tweaked, primped, and cleaned, you should be ready to show them to the client and (hopefully) get approval. Approval is important because the wireframe is the backbone of the design. Without approval, you won’t have much to fall back on if the client shifts direction during the design phase. If they have any changes, make them as long as they make sense. If they come back with feedback that doesn’t make much sense… it is your job to call them out and say “Well, this doesn’t make sense because of so and so”. The designer must be the authority and be able to explain why things are the way they are because otherwise, you will get pushed around by the client.

5. Begin Homepage Design

This is where the real magic begins. Now take out your filled-out questionnaire sheet, meeting notes, wireframes, open photoshop and begin! Make sure to review everything you have so that you don’t miss a beat here. You have the tools and the drive. Soon enough, the project is brought to life

6. Share with Team and Fix Any Issues

A lot of the time, your teammates have important things to say regarding a project so make sure to always keep an open mind when receiving feedback. Be sure to be able to explain and back certain decisions that you have made during the design so that everyone understands. If there are issues, find ways around them. If something like this happens, I always think to myself “there is always another way”. There usually is!

7. Present to Client & Review

Here is the moment of truth! This is the meeting you show the client what your 8hrs of work looks like! This may sound weird but when you show the client the design, look at their face. This is the first impression, and you can catch how they feel about it at first glance by their expression. They may love it or they may hate it. Either way, you must cater to them and address the issues they have. Remember, be open-minded! Document the issues they have with the design during the meeting and figure out ways to best fix them.

8. Make Final Changes & Get Approval

After the changes/issues have been properly documented. Begin working on them immediately, it is best to work on these things when they are fresh on your mind. Then submit your work again to get approval.

9. Begin Inner page designs

All of the inner pages are not always designed out because it can be time-consuming, but it is always good to have at least 2 or 3 designs to have something here to show so that the client has a clearer idea of what to expect. Some pages can be quite unique based on what is needed so be sure to include these types of pages in your inner page designs. Just like with the homepage design, you are to review this with your team to make sure everything makes sense. Two heads are better than one!

10. Review & Send to client

A meeting is not always necessary with these since they already have a homepage design. However, I would send to the client and ask for approval or if they wish to make any last changes before development begins.

11. Package Up Design and Share with Development Team

Cut your designs up! This means images, icons, logos, and much more. Provide to the development team a style guide displaying fonts, font sizes, colors, and any other branding elements. After your team is brought up to the same page as you, your job doesn’t end here. You must guide the development team along the vision that you have shared with the client. Sometimes you will even need to help code depending on how big your team is. Nevertheless, it is your job to ensure that the vision is exactly or as close as possible to the design files.

Lastly,  just remember that it is important that you take steps of approval when doing design work because it allows your team and the client stay on track. It forces the client to be more involved and think about who they want to be on the internet. When items are approved, it decreases the chance of a project moving backward. Projects can move backward easily and it’s important to try to do all you can to prevent such notion from happening.