Web design and Webflow development for Elektrado

tab_image
Region
England
Industry
IT Services
Platform
Web
Project volume
65 hours
Team size
5 people

Delivered by WarmDevs

  • UX/UI design
  • Motion design
  • Webflow development
  • 3rd party API integrations
Go to website
About the Project

Elektrado is a company that provides a T2R platform for tracking carbon footprint. It’s a cloud-based web portal that offers expert insight on measuring emissions produced by a client and advice on reducing energy consumption in a time- and cost-efficient manner.

They provide users with data compiled in visual dashboards and a tool to calculate and minimize the CO2 emission of a business.

Challenges & Solutions

Challenges

Solutions

Create a concise website on Webflow in a limited time
We defined a clear project scope, divided the workflow into sprints, and delivered the finished product on the set date
Develop a distinct website under limited resources while making the business stand out from the competitors
We solved the inquiry with a creative approach to UI design by creating an interface design that grabs the user's attention while keeping the presentation professional
Create a Blog page for the company to be managed by the client’s team
Webflow CMS integration solved the request and gave the independence to manage the Blog without the intrusion from a developer by incorporating low-code solutions
Incorporate an interactive form for users to schedule a call
With the use of some custom JavaScript, we created and integrated two separate forms for users to book a call and request an e-mail

Technologies
We’ve Used

Elektrado Client
Atanas Matov
Head of Sales | Elektrado
arrow_icon

The best professionals with whom I have ever worked! I have enjoyed the process from the very beginning to the very end. Professionalism was found in every process step, from the initial call to the final adjustments.

The team was there at all times to support me and answer all of my queries. I cannot believe how lucky I have been with them! The end results were simply phenomenal! Thank you so much!

arrow_icon

Get free consultation

Book a Call

Our
Process

arrow_imagearrow_group

In each project, we divide workstreams and determine milestones. Then we identify competencies needed to fulfill the tasks, calculate the work time of each expert, and approve everything with the client. After signing the contract, we allocate a separate team for the project. The project manager directs and supervises the process; he is the contact point for the client.

Project scope

Discovery
  • Kick-off meeting
  • Gather client requirements
  • Discussion and ideation
  • Set the project scope
  • Sign a contract
UX/UI design
  • Creating a brief
  • Creating detailed UX
  • Creating custom UI
  • Incorporating illustrations
  • Incorporating animation effects
Web development
  • Developing the website architecture 
  • Webflow platform development
  • Developing CMS for the Blog page
  • Optimization of integrations
  • QA and bug-fixing

3rd party API integrations
  • Developing a Scheduling page
  • Integrating Calendly
  • Creating a Contact us form
  • Adding social media handles

Discovery

Elektrado is a software solution for reducing energy bills. We met with the client for the initial kick-off meeting to start the discovery stage. The goal was to understand the client’s expectations, gather their requests, and define the requirements for the project. 

So tapped into our creativity and put forward a couple of ideas to achieve the best result with the available resource. We established the limitation for the time and budget of the product development. It gave us a concise frame to work within — still, we made a goal to make the most out of it. After some discussion, we established the scope, signed a contract, and moved on to the development.

UX/UI design

The website needed to be distinct from the competitors to make the client's business stand out. Under budget and time limitations, we solved the request by developing a professional yet clean UI design and a simple yet robust UX wireframe.

Animation effects incorporated into the web page's transition parts gently capture users' attention with smooth motion design. We focused on user engagement, adding unique illustrations visualizing the client's business's concept ideas. The dashboard illustrations made a visual presentation for the Elektrado proposal: how their tool presents the emission reduction, how a user can work with it to cut costs, and so forth. We incorporated an interactive slider on the webpage to let the users pick the payment plan and see the details of each package.

Overall, the webpage turned out to be illustrative with no excess noise —  images on the right visual points and motion effects to comfortably guide users through the information. The visualization and clean-looking presentation make Elektrado stand out in an appealing light, precisely as the client intended.

arrow_green
arrow_orange
arrow_green_reverse
arrow_orange_reverse
skiparrow in circle
ElektradoElektrado

Site map

Primary Color Palet
Case study Elektrado | Warmdevs
Typography: 
Poppins
Aa Bb Cc Dd Ee Ff Gg Hh Ii Jj Kk Ll Mm Nn Oo Pp Qq Rr Ss Tt Uu Vv Ww Xx Yy Zz
0 1 2 3 4 5 6 7 8 9

Web development

The development process was relatively straightforward: we needed to create the one-page website on Webflow, adding a few integrations along the way.

Our developer took the design and put it to work with the Webflow platform, making everything functional with the in-built editor and incorporating some custom JavaScript code and manual modifications where necessary. Aside from the Main page, we also added the CMS Blog page. The client can use it independently after the project's completion.

We incorporated all pre-defined integrations and optimized every feature for smooth performance. We performed QA testing and final bug fixing. After everything was checked and finished, we presented the result to the client.

We made the website live. The client received all necessary after-launch support to ensure they could operate their website without problems.

3rd party API integrations

There were several third-party integrations requested to be implemented by the client.

We incorporated:

  • Book a demo form. It’s a custom form on a separate page, with several steps leading to scheduling a meeting through the client’s Calendly.
  • Contact us form. A custom form that pops up over the main page when clicking on a corresponding button. Users type in their contact information through several input panels.

Delivered Value

arrow grouparrow bigger
  • The website was developed with Webflow for the client’s convenience, incorporating low-code solutions
  • The platform has a clean, professional, and appealing UI, as well as a solid, user-friendly UX
  • Unique illustrations were created and delivered for the client’s business’s specific needs
  • Animation effect was incorporated into the website to smooth transitions and increase engagement
  • The client received a CMS for the live Blog page that they can use, manage, and update entirely independently from the developers
  • The client received a custom Book-a-demo form incorporated into the website for their clients to leave requests
  • The Contact us form was incorporated onto the website to gather e-mail information from the users
  • The client received the most out of their request while keeping the project budget as limited as they intended
Elektrado Manager
Victoria Kravtsova
Project manager | Warmdevs
arrow_icon

The very proactive and enthusiastic client doesn’t seem tired of coming up with new ideas! We used a bit of time to catch the same wavelength, and the process became smooth sailing once we got in tune. We had no time to waste, so we worked hard on delivering the client’s request in full.

Ultimately,  we were excited to see the client happy — we couldn’t ask for a better result!

arrow_icon

Get free consultation

Book a Call
Book a Call

Case Studies

Let's scale your business today

Schedule a consultation with our representative to talk about development services with no obligations from your side. Take a part in a professional discussion that will provide you

A reply from our manager within 24 hours
Eye icon
Approved time of a meeting convenient to you
A folder icon
WA signed NDA provided the project information needs to be confidential
Graph icon
Defined project scope, specifically the requirements, deadlines, and cost estimation