What Do You Need to Have a Good One
Your website is your major assisting tool in reaching your business goals. It is essentially the most important representation of your business so, regardless of the website complexity, it is crucial that it works properly.
If you are not a developer, you are going to delegate the website development task to the internal or external team. Naturally, you will need a tool to help you monitor the process and evaluate the results. In other words, you will need a set of specific rules and metrics to ensure that the web development team deliver the desired results.
This set of rules and metrics is presented as Website Design Documentation.
Documentation is a must as it provides easily accessible information on a product and gives answers to important questions pertaining to:
The benefits of website design documentation include:
Every website is a result of some idea and time/resources investment in this idea. So, the process of website creation highly depends on these factors. To get the best results, you will need some specific type of website design documentation that fits the process.
There are 2 common website development approaches:
There are certain characteristics that define each type of website design documentation development approach.
The effective website documentation within Fixed Scope approach is created by:
At this stage, key participants are Business Owner (BO) and Business Analyst (BA).
BO needs to formulate core functionalities of the website. To formulate core functionalities correctly, BO answers the following questions:
Below, there is Web Browser Market Share page of Statcounter website that can be an illustrative example for understanding this point in detail.
Who: web developers, marketing specialists, ecommerce websites owners;
What: information about web browsers popularity.
Once the core functionalities are defined, user experience (UX) and user interface (UI) specialists join the process for accomplishing the next stage of outlining wireframes.
Wireframes are interfaces for the core functionalities delivery. For example, to deliver the websites popularity info, there should be an interface with such components as:
Business Analyst helps specify the functionalities for different wireframes for different user roles.
UX and UI Specialists help divide those functionalities by wireframes and create mockups of those wireframes.
Important: Each wireframe needs placement on some web page. Basically, collection of wireframes placed on some number of web pages is your website structure.
Wireframes placement is UX/UI specialists’ competence.
As a result, you are going to complete the ‘top level’ of your website design requirements:
After wireframes are created, the next step is to describe how each element of the wireframe works and looks like. Let’s use the element from our example as a reference.
As a result, you are going to complete your website documentation structure:
In other words, you have a collection of specs for the wireframes that:
Now that you have the website design documentation structure, you can collect all the information in one document using the same structure as illustrated on the infographic above.
Note that at this stage you can add requirements regarding usage of some particular technologies, libraries etc., and Business Analyst is the person that assists you at this stage.
Important: any changes regarding the website functionalities after the documentation creation require its update (new user/page/wireframe specs)
This approach works with the Agile methodology that does not imply any well-defined documentation. The project is divided into parts so you can be involved in the development process, follow every step of the project and make changes to any specific part without harming the project in general.
In this approach, we start with creating a user story. A user story is an informal, natural language description of one or more features of a software system written from the perspective of an end user.
Key participants of this stage are BA, Project Manager (PM), Back-end developers, Front-end developers, designers, QA, and, of course, BO.
User stories are often written on index cards or sticky notes on walls or special online programs to facilitate planning and discussion. When everyone is involved in the process it is easier to divide the work in sprints. One sprint usually takes 1-4 weeks, and within this set period of time a certain functionality is to be delivered.
With work divided into sprints, the team works over functionality so that it does not intersect, and sprints do not overlap.
At the stage of UX (user experience) design, the team defines the goals, objectives, and strategy for the UX. During this phase we specify website users and their design requirements.
The scope of questions that we address at this stage:
A story map is a technique that takes a user-centric perspective for generating a set of user stories. Let’s explain how the user stories are created with the example. Say you want to create a website where your customers will be able to search for restaurants, place orders or get food delivery, like this one https://new-york.eat24hours.com.
For this particular case, the beginning of your story map for this feature looks like this:
The tasks for the sprint to cover this functionality are placed in the backlog. The time to complete the task should not exceed 12 hours. There are 2 types of backlogs:
In the story map the team and the Product Owner can define what functionality will be in the MVP or the 1st version of the product, what elements will be added in the next versions. By adding and moving elements on the board for our example project we soon received a Story Map.
Each sprint has the following checkpoints:
At the end of each sprint, the released product is demonstrated by the development team. At this stage, you evaluate if it meets the Acceptance criteria.
The team holds a retrospective meeting to sum up the sprint results, determine the tasks for the next sprint and craft the improvements for next development projects. When you choose Agile approach for your project, you pay per sprint completion (practically speaking, for the functionality developed in that sprint).
The web design documentation is crucial for setting up the website environment. It puts software development into context of business needs and specific requirements and provides the information mandatory for optimal maintenance and support of the software.
Documentation focuses the user’s attention on advantages that software can provide and, thus, by enriching the user’s experience, it facilitates the business process bringing benefits to the Business Owner as well.
I posted this project and within minutes guys from CodeIT bid on the project. I asked a few questions through Skype to feel confident that they could do the job. I felt comfortable with the knowledge and skills and accepted their offer. I am usually hesitant to hire from offshore. Not because of the work quality but, usually the language barrier and working hours. Guys from CodeIT was available during NY working hours and after pre-screening on Skype, I could tell they know English well.
This was the biggest project I’ve made so far and CodeIT helped me and our company through it in a perfect way.
Working with one very skilled project manager and multiple developers and testers with him made our project fly in a very short period of time, and with a super high quality!
This was our first project, and I am so happy that it had a smooth run and a successful resolution.
I sincerely hope that this is just the first step in our long and mutually amiable partnership.
Thank you CodeIT team for being so thorough and professional.
I wanted to personally thank you for your hard work on this. Working with CodeIT turned out to be a really pleasant experience for us.
Since the beginning, your team seemed to be really well structured and everyone understood its role and responsibilities.
Also, the quality of the work CodeIt delivered was exactly what we expected it to be.
This really facilitated our daily work and help us to keep the client happy.
I hope this first experience working together help us to build a long-term partnership.
I have worked with CodeIT for over a year now on a complex application development project and they have been excellent. They have been flexible with scaling resources up and down as I’ve needed it, their project managers have been extremely responsive and I hear from them every day and never have to wonder where they are as I have with past outsourcing projects. Highly recommended if you’re considering outsourcing software development.
CodeIT has been working for us for one and a half years. We are ending the project now because it is complete. CodeIT built our platform from scratch and also provided further development and support for the rest of the contract. They are very strong in several areas: back-end development (specialising in Zend Framework); front-end development; server administration; project management. Their project managers speak excellent English and are courteous and professional. Their developers are fast and skilled, and up to date with the latest technologies. Their expertise helped us to build a highly reliable website which can serve a heavy load of traffic. Finally, they are all very nice people, and I cannot recommend them highly enough.
Collaboration with CodeIT gave my business great prospects for its expansion and scaling. Together with CodeIT professionals, we grew our product line from three to fourteen products within only one year. I can rely on these guys to get a high-quality product on time.
Feel free to contact us. We will answer all your questions and provide you with fast and thorough feedback.