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: 

Step 1: The first meeting with  the  agency 

Article one is about the first meeting.  Herewe 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. 

Hear about the first meeting in the video below and read on and learn  more about  what to expect from it.

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.  Ware 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.  

Hear what a scoping workshop is and why it's a important part of the web development process in the video.

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:  

  1. A  decision maker 
  2. Project owner 
  3. Brand manager 
  4. Tech lead 
  5. 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  
  • Features  

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 actualdevelopmentsteps, 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! 

Hear about the process from the scoping workshop to the development work starts in the video.

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.  

Next step – website ready for content 

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.

SEO guidance    

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:   

  • Sitemap  
  • Navigation  
  • Page migration 
  • Contentstructuring 
  • 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 mappingof 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’sSEO 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 oldonetypically 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'sPremium 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. 

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: 

Step 1: The first meeting with  the  agency 

Article one is about the first meeting.  Herewe 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. 

Hear about the first meeting in the video below and read on and learn  more about  what to expect from it.