Development Process for Building a Website
The Novicell approach to scoping a digital project
When making digital solutions for our clients, we go through a well-planned, standard process from research, planning and scoping all the way through to designing, developing and launching.
In this article series, we will take you through the entire process of scoping a digital project by describing each phase and including examples from one of our recent website development projects with the investment management company and our client, 7IM.
The series consists of five articles:
- The First Meeting
- The Scoping Workshop
- From Workshop to Development
- Website Ready for Content
- Website Ready for Launch
Step 1: The first meeting with the agency
Article one is about the first meeting. Here, we get together with you as the potential new client for the initial discussion about the project to better understand your needs and give the first rough estimate.
Getting to know you and your needs
You need a new website and you have made contact with a potential web agency. You will want to meet the people who will be designing your new website, and the agency will need to have information about your company to get a feel for how they should start those designs. That is the purpose of this initial meeting.
If the web agency you have reached out to is Novicell, prior to the meeting we will ask for permission to access your website traffic data, among other things, to get as much information as possible, such as how your website is currently performing. Some companies prefer to send us a brief stating their needs – it depends on which stage you are at when reaching out to us.
During the first meeting, we will ask some questions to identify challenges, wishes, must-haves and nice-to-haves. Typical questions include:
- What is the most important thing a user can do on your site?
- What is the most important thing the site can do for your company or organisation?
- What is the primary purpose of the site?
- What types of content should be on the page?
- Are there any other systems that the website should be integrated with?
The first meeting is often seen as a meet and greet where we not only discuss the project, but also get to know each other and establish a good relationship. This is important, as we like to see ourselves as a partner who can help you grow your business rather than someone who can simply build a great website.
First meeting with 7IM: Demo and ballpark estimate
7IM, an investment management business that helps financial advisers and individuals to manage their capital to meet their financial needs, had recently been working with a new customer experience focus across the whole organisation. They were looking for a new website that could raise awareness of their new products and services, and align these initiatives with a refreshed look and feel that is coherent across the key offerings and distribution channels.
7IM were running on a Sitecore solution that they wanted to upgrade for the new website. However, based on their brief and the information we gathered, we were able to demo a new Umbraco CMS solution at a following meeting. A solution they later decided to go with.
We have come a long way since the first meetings, and seeing a realistic demo already at this stage was very beneficial and convincing. We decided to change platform and, because of Novicell’s comprehensive and transparent scoping process, we have been able to see very clearly the direction we were heading right from the beginning.
- Zoe Baird, Head of Digital, 7IM.
Presentation of the ballpark estimate
An important outcome of the first meeting(s) is gathering enough information to be able to present a ballpark estimate. This estimate is a rough idea of how much it would cost to build the new website, based on the information that we have at the time. As such, the estimate is only an indication of what it might cost.
Even though we spent the first meeting talking, asking questions and, on some occasions, demoing the potential new website, there is still a lot of information that we don’t have at this stage. We are only at the very beginning of knowing the client and what the project requires. The more details, the more precise the estimate will be. Therefore, the first meeting will also include a proposal for a scoping workshop.
Next step – scoping workshop
The scoping workshop is a must in our website development process. The aim is to define the scope of the project and to capture the requirements. This will be your guarantee that what you see is also what you are going to get. This very thorough approach enables us to scope the project in great detail and identify the most significant risks and any needed mitigating actions that will help us deliver a successful project.
After the first meeting with 7IM, we presented a ballpark estimate that was approved, and we agreed on doing a scoping workshop. In the next article, we will cover the scoping workshop – what it is, the outcomes, and why it is a crucial part of a development project with Novicell.
The scoping workshop we did with 7IM was an online workshop. You can read more about that experience and online workshops here.
Step 2: The Scoping Workshop
The next step in the web development process is the very important scoping workshop. This is typically the second or third meeting between you and our team of experts.
The purpose of the scoping workshop
The aim is to ensure the project team is in sync and understands the project context and work to be done. We do a lot of scoping workshops with clients to get to know them, their business, and their needs and goals. The aim is to define the scope of the project and to capture the requirements.
The scoping workshop serves as a part of the web development process, but it is also a separate exercise that will leave you with a comprehensive report – or battle plan, as we like to call it – for your project. We recommend scoping sessions to all our clients as they allow us to understand, challenge and design your business idea better.
Before the workshop
Before the scoping workshop we ask you to gather the most relevant people that should be involved in the project. It is important that the team is available throughout the project. Ideally, we would like to have the following people in the session:
- A decision maker
- Project owner
- Brand manager
- Tech lead
- Project manager
After the initial meeting with our client 7IM, we met up for a scoping workshop. Prior to the scoping workshop, which we did online, we asked 7IM to send information about their business, competitor analysis, target group description etc. This way we had a lot of information beforehand so we could go straight to the challenges and opportunities ahead.
In the workshop
In the workshop we go through all aspects of project planning from time and cost estimation to scope definition. This thorough approach enables us to scope the project in great detail and identify the most significant risks and any needed mitigating actions that will help us deliver a successful project.
Don’t worry if you don’t have anything ready yet at this point. The whole purpose of this workshop is to identify everything that we need to know to be able to give a realistic estimate of the project.
If we don’t have the information already, we will ask you questions in the workshop such as:
- KPIs and PIs
- Must-haves and nice-to-haves
- User stories, audiences and personas
After the workshop – the handover report
In the days after the scoping workshop, we provide you with the workshop handover report. The report, being a comprehensive document, covers the following issues discussed during the scoping workshop: deep understanding of your project, including your personas’ and project’s pain points, and our recommended solution for what we can do to make your project succeed.
The handover report will also include an estimate. The estimate will, at this point, be quite accurate as the scoping workshop will have given us a good understanding of your needs and the scope of the project. In the report, we also include a timeline for when different actions are put into place.
The scoping workshop meant a lot for the project going forward. In the workshop we identified all our needs and wishes and generated a lot of ideas that have contributed to the excellent solution that we ended up with. Moreover, the scoping workshop and meeting the team at Novicell was good for building trust and a good relationship from the beginning.
– Zoe Baird, Head of Digital, 7IM .
Technical data workshop
In some cases, the handover report will also include a proposal for an additional technical data workshop. This is typically the case if your solution requires, for example, integrations to your CRM, ERP or perhaps an existing product. The technical meeting will help us better understand your data, and how to integrate between the different solutions.
Next step – from workshop to development
After the workshops, we move on to the development phase. This starts with a final estimate of the development and the client giving us the go-ahead. In the next article "Step 3: From Workshop to Development", we describe the first actual development steps, including user stories.
Step 3: From workshop to development
Once we have given you the handover report, it’s time for you to decide whether you want to proceed with the project. The time from delivering the handover report up to where the contract is signed is usually between two to three weeks. As with everything else, we want to be thorough but effective, and once you give the go ahead, we are all set and ready to roll!
Timeline, solution description and budget
The next step after signing the contract is for us to do a detailed timeline and overview of hours. This is based on the findings and recommendations in the handover document and our different specialist teams’ (eg. Development, Digital Performance, Design etc.) estimations for the project and tasks.
We also prepare a detailed plan based on sprints, centred around demos. The purpose of this plan is to provide a clear overview of the dates on which the specific demos will take place so the client knows exactly what needs to be tested and when.
In this phase of scoping the digital project, we also make the Solution Description. This is a very comprehensive document outlining all the features that the digital project contains. Here we take all the things we have discussed as needs and wants during the workshop and turn them in to actual development tasks. The Solution Description contains titles for every feature together with a User Story that summarises the feature, describes the purposes and specifies how this is achieved.
As well as evaluation and aligning how the project is proceeding in regard to tasks and timelines, we also closely monitor the budget. Every week we send a budget report to the client showing the hours that we are spending and highlighting if there is any risk or indication of going over.
Close collaboration between client and agency
The solution description is created in collaboration with a team of selected stakeholders on the client’s side. In the process with 7IM, this team consisted of a project lead, content editor, designer, and QA tester. All four of these roles were advised to read and approve the solution description to ensure that it meet all of their needs. They also all attended demos to ensure we were on track.
- During the pre-launch stage of the website, we have had weekly calls with our Project Manager which has been a massive help. Running through the tasks, budget used, budget remaining has helped us keep on top of costs and keep the website on budget. Using Umbraco is easy, but it has been made even easier with the recorded Teams demos that our Project Manager has created during solution hand over. It does not only keep Novicell on track but also makes sure that we are on track when we need to complete testing.
Kieran Cardozo-Smith, Digital Product Manager, 7IM.
Transparency and no bad surprises
Transparency and being at the cutting edge of every project we do is in our DNA. During the development phase, which can last up to 2-8 months depending on the size of the project, we have weekly meetings with the client where we go through the status of the project and the things that need to be signed off. In these meetings we also agree with the client what we are doing for the upcoming weeks and when demos will take place, all visible on digital timelines so everyone involved in the project – on client and agency side – knows exactly what is going on.
When the development work has finished, the website development phase has reached a point where content editors can add content. This is the final step before the website is ready to be launched.
Step 4: Website Ready For Content
The majority of the development work has now been completed, and it is time for the client’s content team to start adding content into the CMS.
When initially scoping the project, we ask the client to share high-level information architecture so, right from the start, we can plan and develop according to the content that needs to be on the site. As such, when we reach this stage, there is not much to consider or do beyond adding the content.
Before and during the content being added to the CMS, the Project Manager at Novicell uses demos to show the client’s editor team how to work in the CMS. Our SEO team will also have reviewed the content in regards to navigation and structure, and they will recommend which content the client should migrate.
For 7IM, we SEO checked and supported the following:
- Page migration
- Content structuring
- Meta titles and descriptions
- Redirect mapping of new pages
We also provided technical support regarding how the content is structured, did a final review of which pages should be included in the sitemap, and redirects the mapping of the new pages.
The SEO review is important for generating traffic and improving conversions. By reviewing the structure of the content and the content itself, we help the pages rank higher so they can earn more relevant traffic from search engines.
Read more about Novicell’s SEO services.
Adjusting and improving
As the content editors add content, our development team will work alongside them to finish off the last details.
Even though we have been planning for the content since the beginning of the project, and despite the demos that have taken place, there will, occasionally, still be elements that the client wants to add or change. For that, we set aside some hours in the timeline and budget so there is room for making the project perfect.
About the CMS experience:
We are really impressed with the Umbraco CMS. It so easy to navigate and use as a content editor copared to our old CMS, and because of the easy uploading process, even persons outside the editor team can now add content if needed. We are really happy with the design and style – the nature of how the modules sit and look. It is so much better than our old website.
- Ben Kingwell, Website Content Associate, 7IM.
Next step – website ready for launch
Once the last bits of development are finished and the content has been added to the website, it is time to launch and evaluate. This is the final step in scoping a digital project.
Step 5: Website ready for launch
We have now reached the final phase of the web development process and the website is ready to be launched. In the weeks leading up to the launch date, Novicell’s development team has checked that all technical aspects, such as the quality of the code and infrastructure of the hosting, are working, and together with Novicell’s Digital Performance Team have made sure that the site is optimised for reach and conversion.
Here are some of the most important things we look at before launch:
- Security – is the site and hosting configured for optimal security?
- Domain – is the DNS set up correctly?
- Cookies – is the site cookie compliant?
- Redirects – launching a new website from an old one typically involves redirecting content and making sure high value external redirects end up in the correct place.
- Canonical checks – are URLs set up correctly?
- SSL certificate – has the SSL certificate been set up, allowing correct usage of the secured protocol https?
- Index – have all index-blocking features been disabled, so that search engines can index the site
- Sitemap check – make sure sitemap is correctly updated and submitted to search engines.
Support during launch
Launching a new website – whether it is brand new or an upgrade of an older website – is a huge achievement, and it can feel overwhelming and stressful for some clients. With our thorough, standardised process, the launch is fairly simple and easy most of the time. As soon as we launch, we make sure that everything is working as it should, and if something comes up we are there to support the client.
We can either take full ownership of the launch, or work together with the client’s IT team. Most often it is a joint effort between Novicell and the client, and in that case we are available throughout the entire launch with guidance and checklists.
Brand-new site for financial advisers
Together with the dedicated team at 7IM, we launched their new website for financial advisers in December 2020. The entire project, from scoping, designing, developing to launching, took eight months. The solution is based on Umbraco with Novicell's Premium on top, and new features have been rollen out, like the Retirement Income Service Calculator.
The new platform has been welcomed by 7IM’s clients and 7IM themselves:
- The process of building the new website has been exceptional. It has been a huge task and project, but it has been smooth and a really good collaboration with Novicell all the way through. We have never felt like we were a client, but more Novicell being an extension of our digital team. The aim was to deliver an unrivalled experience through our new and revamped website. Based on the phenomenal feedback we have gotten from clients, stakeholders and many more, we believe we have succeeded.
Kieran Cardozo-Smith, Digital Product Manager, 7IM.
After launch – continuous collaboration
Once the new website is up and running, we start to look at how it can be developed further. Among other things, we look into speed and performance improvements and new features and functionalities. This is done in monthly meetings together with the client where we discuss the upcoming months and what needs and wishes they have for the site.
We are already working on the next steps for 7IM, looking at the roadmap for 2021 and the functionalities they would like to add. One of the things we will be focusing on is developing more interactive tools, like the income calculator, to engage with potential leads.
Even though the launch of the website is the official final step of the process, the work is never complete. Websites are meant to be updated continuously, and an effective website is a dynamic one. It should always be changing and improving over time based on analytics, marketing efforts and audience needs.
To see other digital projects that we have done, go to our case study page here. You can also read the full case study with 7IM here.