We collect information and set goals for the project. We analyze the market: your customers and your competitors. We look at Google Analytics.
There are no shortcuts. We need to talk a lot in the beginning, so we ask you to allocate enough time for this.
Then we take your ideas and your content and start creating.
A proper website starts with proper copy. On the web, the text is an integral part of the design. For corporate, business websites, landing pages, etc., written content is in most cases the skeleton of a website, so we start with the copy.
The semantics are closely connected to the visuals that go with them. The length of the headers, the structure of the text and the layout go hand in hand. Then our copywriters and our designers work together to create and polish the text. Wireframing fuses together the draft of the text and the skeleton of the design. With wireframes, we see what the content will look like to the end user and how it is perceived. Here we ensure that we’ve covered everything and that all the information is discoverable.
When we start filling your website with text, you see it right where it belongs: in the mockups of the website.
If you choose to provide your own content, it is useful to have this finalised as early on in the project as possible so that we can produce our design specifically to fit around it.
Yes, we do internal SEO optimization, which is a joint effort of our marketing team, copywriters and developers. This part has an effect on the copy and includes several steps: keyword research and writing the copy in accordance with that, writing title tags, meta-descriptions, image tags, etc. We promise Google will find you.
Our primary language is English. This means that our work process and the deliverables should be in English. If your website needs other languages, we will be happy to work with your copywriter or translator, unless the text is right-to-left or hieroglyphic – we can’t guarantee what we don’t understand.
Our first step is to define the visual concept.
We start with a moodboard, where we gather visual references that reflect the look and feel we are aiming for. We discuss it with you to see if the direction we’ve chosen fits the brand. Then we create a concept design for a few key sections. We take a chunk of the website — usually the homepage — as a playground, on which we develop the style. Once you are happy with the concept, we make the rest of the website.
We use a variety of visual instruments that may help us spotlight your product, team or brand: typography, 3d, motion graphics, photography, illustration, explainers and even technical drawings. Once you confirm that you are happy with the design, we pass the project on to our dev team.
We listen to your feedback and iterate on it to achieve the best results. Eventually, it becomes our reference for the rest of the website. Once we have the concept ready and approved by you, we move on and design the rest of your website. The last step is to create adaptive designs that show how the website will work on any screen size — mobile, tablets and desktops.
For each page we create graphic content: illustrations, 3d imagery, we select and retouch photo materials.
In most cases, our websites are not static. We come up with interesting effects and animation, and pass on our ideas to our development team for further implementation.
Finally, we deliver designs for the whole website and every screen size. Once this is done, you have a complete understanding of how your website will look and function. The designs are created in Figma (our favourite collaborative design platform) and accompanied with specifications and comments for developers.
Graphic content is an integral part of website design. We hate using stock imagery. Every business is unique and generic images are not a way to reflect this uniqueness. In our team, we have illustrators, 3d artists and photographers who can create custom images for our projects. Depending on the style, we engage different specialists.
If needed, we organize photo and video shoots of your team or your product. If you need a photo/video production and are located in a different country, we can fly our production team to you (this is a good approach if we need to take photos of your team) or, if we need to take photos of your product, you can send it to us and we will shoot it here.
Not every website requires information architecture as a separate step. For landing pages or simple corporate websites that show content in a linear way, this step can be skipped. It may be enough to think through information arrangement at the wireframing stage.
But for something more complex, like big corporate websites, e-commerce platforms, media resources – wherever users will need to navigate through complex data, filter, sort or compare things, this step is crucial.
First, we cover the basics:
We collect all the pieces together – your content, ideas and requirements.
Then, we architect:
The deliverables include flowcharts that reflect the structure and navigation and descriptions of other aspects of the information architecture. The next step is to gather all the technical specifications for the project, which will become the blueprint for the future website.
We can implement your design ideas for maximum impact – unconventional layouts, complex animation (GreenSock, SVG) and 3d visualisation (WebGL, three.js).
Laconic and fast landing pages. WordPress development for media platforms, corporate websites and brand promo sites. We offer various e-commerce solutions for online stores.
PSD/Sketch/Figma to HTML – we can turn your design into a fast-performing and SEO-optimized HTML/CSS/JS markup.
We work with HTML5/CSS3, Sass, Scss JS ES6, Vue,js, React, Bootstrap & Foundation.
We work with a secure and reputable web hosting company – https://getflywheel.com/
We use strong, complex passwords to protect against brute force attacks. Passwords should be complex, containing uppercase letters, lowercase letters, numerals, and special characters.
We keep our web software up-to-date and maintained.
SSL encryption on every page. SSL allows sensitive information such as credit card numbers, social security numbers, and login credentials to be transmitted securely.
Regular backups of all sites.
Protection from Cross-Site Scripting (XSS), Cross-Site Request Forgery (CSRF), Session Hijacking, prevention of SQL Injection Attacks.
During the testing process, we use PixelPerfect to conduct a static check (verification) of layout designs for compliance with the website in development. We make sure that every part of the design is on the site, including fonts, indents and colors.
Functional Testing. We make sure that every element is functional – search, forms, inputs, subscriptions, filters. We check both front and back end.
We check the website’s usability, making sure its design and solutions make it easy to use.
We check its compatibility with all known browsers and platforms. We check responsive views on different devices and resolutions.
Optimization. HTML & CSS validation check. Page load speed, site performance, Google, SEO Features – titles, descriptions, image alt text, the presence of h1 tags.
We use WordPress for most websites, so you can easily edit your website by yourself. All you need to do is log into your admin panel and add content or make edits there.
WordPress is the CMS (Content Management System) of our choice. It is very popular, easy to use, and highly customizable. It suits most landing pages and business websites.
For more complex projects, we can build custom systems using PHP.
We offer two options: Shopify and WooCommerce. Each of them has its advantages and disadvantages, we are equally good at both of them and will gladly help you make the right choice.
Your website is a key communication tool for your business. It sells and educates. It explains and promotes. It helps you build a relationship with your customers.
That’s where SPAI comes in. We cover everything website-related, from design and illustration to copywriting, development and support.
First, we find out as much as we can about you and your business. How it all started, the path you went through, your aspirations and what brought you to us. What you want to achieve with your new website.
Then, we formulate a concept — which will be our Northern star both visually and verbally for our next steps.
Words are the pillar of web design. Our designers and copywriters work together to find the best way of delivering your information, both through visuals and words.
Once the wireframes are ready, we write down technical requirements for the website.
At this stage, we design every element and detail of the website: the style, the fonts, the movement. We add photography, video, illustration and 3d, and we make sure everything looks great on every device.
A website can be anything from an idea pitch to a full-fledged encyclopedia of your business. Information strategy defines how to organize the information so that it reaches your customers in the best way. We anticipate questions they might have, how and when to address them.
We have a killer set of front and back-end skills at hand. Our knowledge of interactive 3d, animations and visual effects allows us to implement the most daring ideas into lightweight and stunning websites that work on any device. Our websites are fast-loading, flexible and easy to manage.
Read More
When building e-commerce solutions, our goal is to create a product presentation that works as well as a professional salesperson offline. We have many tricks up our sleeves: we use 3d, videos, controllable image sequences accompanied with killer creative copy and a seamless purchase experience. As you may have already noticed, we focus on niche products, novelties and mono-brand stores, rather than on big e-commerce sites with hundreds or thousands of items.
Enjoyed our portfolio?
Let’s talk
SPAI would like to use cookies to store information on your computer to improve our website and to enable us to advertise products and services which we believe may be of interest to you. Some of the cookies we use are essential for parts of the site to work and have already been enabled. To find out more about online behavioural advertising or about the cookies we use and how to delete them, please refer to our Privacy Policy. By closing, you’re agreeing to use of cookies in line with our Cookie Policy.
Necessary cookies are absolutely essential for the website to function properly. This category only includes cookies that ensures basic functionalities and security features of the website. These cookies do not store any personal information.
Any cookies that may not be particularly necessary for the website to function and is used specifically to collect user personal data via analytics, ads, other embedded contents are termed as non-necessary cookies. It is mandatory to procure user consent prior to running these cookies on your website.