From idea to website
Creating a new website for your company can be a large and resource-intensive job – a careful strategy with meetings, workshops and analyzes before you can even start designing. Or the project can be made smaller and more concrete. All this depends on the level of ambition, use and resources. Fortunately, there is a solution for every type of project.
Here is how Innocode works in creating a website from grain to grain. Depending on the size of the project and your business needs, the process can be adapted accordingly.
We usually divide larger web projects into three phases:
PHASE 1 – STRATEGY, CONCEPT and IDEA
- Current status and study
- Marketing strategy and brand platform
- Concept and idea work
- Further development
- Design (depending on the project)
PHASE 2 – PRODUCTION AND TESTING
- Design (depending on the project)
- Production
- Content and Quality Assurance
- Activation and implementation
PHASE 3 – after LAUNCH
After completion of phase 2, we usually have an ongoing engagement with our clients which may include:
• Help with SEO (search engine optimization)
• Content production and publishing
• Optimization and evaluation based on statistics
• Data analysis and follow-up
• Hosting
PHASE 1 – STRATEGY, CONCEPT AND IDEA
All projects start with a meeting and/or a workshop. You as a client have a wish or a vision. Maybe you know exactly what you want, or maybe you have no idea. That's why we always start every project with a question. Many questions. Here it can be done on your own, or together with us. We go through answers to many questions that may affect the project. This is to ensure that you will receive a delivery that meets or exceeds your expectations.
Some examples of questions we will discuss:
project framework
- The time aspect – what are you working on before the deadline?
- Budget and level of ambition - what & how do you want to invest in the project?
About the company:
- Tell us about your organization. Why do you do what you do?
- Company history?
- Tell us about your product/service?
- What are your goals for the project? What do you want to achieve?
- Target group?
About Design and identity:
- Do you have a graphic profile - colors, fonts, logo, visual elements and more?
- What language should we speak (tone of voice)? What colors and shapes do we have? Which language?
- What other pages do you like? Which pages do you not like? Why?
- Which words best describe your brand? Boring? Calm? Serious? Creative? Provocative? Creating security?
- What is the purpose of your website?
- What features do you need? Standard or custom?
- Structure and site map - which pages do you need?
- Which CMS/platform? (Innocode's go-to platform is WordPress in various forms, which we have worked with basically since the platform was launched.)
- And many many more…
METHODS:
We use a number of different methods in the research phase of a project, including:
• 6 thinking hats - A method used throughout the project to check that we have the right focus at the right time - that all aspects are evaluated.
• Kapers – Brand identity model with a focus on mapping your company's identity both internally and externally as well as setting the framework for the web project.
• SWOT - focus on the company's - strengths, weaknesses, opportunities and threats
• Start with WHY – We know that you will find the right solution if you ask the right questions. In our question phase, we have several questions that we can come up with in the idea phase of a project.
INSIGHTS AND ARGUMENTATION
Starting from the research phase of the project, we work with rational and emotional arguments for what makes your service special and how you should look and communicate. We often work based on the principle of:
• Reciprocity
• Scarcity
• Authority
• Commitment and consistency
• Consensus
• Liking
How can we use these principles to create the best website possible? What arguments are there for your target audience to interact with your brand on your website?
FUNCTIONALITY
A big part of a project is defining what functionality you want on your website. Do you have special needs that require custom development, or a simply standard website? This part of the project is documented in a technical specification.
UX
UX design (user experience design) is about how the user interacts with the page. It's about making navigation as simple and efficient as possible. We look at what needs the user has, and that the site meets all these requirements. In this phase of a project, we work with you as a customer, among other things, with wireframes.
UI:
UI design (user interface design) is about how your site will look. Colours, contrasts, graphic elements, fonts, images etc. are adapted and optimized according to the user's needs. It's about how your page should look. Everything is of course adapted to all screen sizes and types.
“Good artists borrow, great artists steal” - Picasso.
One of the many different definitions of creativity is: "You take two things that don't belong together and put them together into something new". What we mean by this is that an idea is not something that suddenly falls into one's head. We look for inspiration in all possible forms, preferably from places that are completely irrelevant in relation to your project - it's about looking outside the box.
As a customer, you are involved in the entire process and get to decide - You know your brand best and it would be idiotic of us not to listen to you. In the meeting after the research and idea phase, we usually present 2-3 directions that we like. We then also have a favorite that we believe is on the right track, but we discuss all directions with you. And together we decide the way forward.
CONTENT:
The content piece is a chapter by itself, but also a large part of an online project. It doesn't matter if you have the world's prettiest website if your content doesn't engage the user. Together with you, we help develop a content strategy, which we also implement together as needed - everything from copy, to images, and film etc.
PHASE 1: DELIVERY
• EXAMPLES OF TOOLS:
Teams, Basecamp, Invisionapp, Adobe XD, Adobe Photoshop, Illustrator, pen and paper
• EXAMPLE OF delivery:
Creative brief, wireframes, technical specification, design guidelines or finished design (design can also be included in phase 2 depending projects), strategy, communication and concept strategy.
PHASE 2: PRODUCTION AND TESTING
Implementation of plans. This can vary from project to project and could have been done in phase 1.
PRODUCTION/DEVELOPMENT/PROGRAMMING OF THE SITE
Depending on which solution you choose, as well as budget and ambition for the project, there are different ways to create the website itself. Either you want to use a page builder (template-based solution), Innocode blocks (Innocode's own Gutenberg blocks), or develop from scratch.
Our development department is located in Ukraine, and we have been developing websites of various shapes, CMS and sizes together for over 15 years.
THE PROCESS:
programming is usually performed in 3 cases:
1. Locally on the developer's computer.
2. Stage servers. As a client, you get access to the internal environment to see progress on this once we have reached the development phase.
3. Production server. When we get close to launch and are satisfied with the site on stage, the environment is moved over to the live website.
SYSTEM SOLUTION:
• Start programming in the selected CMS/platform
• Start server setup
• Examples of server and programming language: PHP 7.0.17, JavaScript, jQuery 1.12.4, HTML5
FUNCTIONALITY
Depending on the site's complexity and functionality, we either use ready-made modules/plugins, or develop our own plugins.
TESTING AND CORRECTION
This phase can also vary greatly from project to project. Some clients do all the testing themselves (along with us, of course), while others hire expertise from testing experts on accessibility, usability, content, etc. We then work with these parties to create the best possible solution.
After a site has been launched, we have a warranty period, during which you as a client can report deviations and errors. Everything that is reported within the warranty period is fixed at no extra cost.
SERVER IMPLEMENTATION AND GOING LIVE
Innocode is a certified Amazon-partner and all of our sites and applications are hosted on their Cloud Servers.
Delivery = launch
When everything is ready, the work continues. Now you have a new profile to replace the old one or implement from scratch.
We also implement profiles in all possible formats for both web and print, but that's another story.
EXAMPLE Tools:
Basecamp, Invisionapp, Adobe Creative Suite, pen and paper.
EXAMPLE Delivery:
The site is Live. System documentation. Training in CMS
PHASE 3 – AFTER LAUNCH
After the launch of the website, phases 1 and 2 of the project are considered finished. But that certainly doesn't mean you've conquered the internet and can rest on your laurels. Now the work begins with processing, conversion, optimization and more. Sometimes our clients do a lot themselves, other times Innocode do most of the work.
Some information that will come after launch:
• Technical: ongoing maintenance/development, updates of the platform
• SEO (Search Engine Optimization)
• SEM (Search Engine Marketing)
• Updating content: copy/images/text
• Webmaster / editorial meetings
• Tools: Creative Suite, pen and paper
Delivery phase 3:
Ongoing support and work with optimization and development of your digital product.
