Go back
Go back
Calculate anything
Apex is an "everything calculator" where you can get answers and comparisons for almost anything. You can compare dog years to human years or calculate the stillbirth risk in a given country. We built this product in collaboration with Evrim Agaci.
Evrim Agaci
5 Weeks
Cross functional
Product Designer
Evrim Ağacı is the largest popular science organization in Turkey. It collects the most exciting news and creates original content about all branches of science, especially evolutionary biology, in a way that is accessible and understandable by everyone.
As Turkey's most comprehensive and reliable popular science and education organization, it significantly educates the public and carries this responsibility incredibly well.
The project's goal was to create a sleek-looking calculator that almost anybody can use for various needs. There were some other websites doing a similar job out there, but they were difficult to use and not engaging for the user.
My mission as a product designer was to create something that people would want to discover further and have fun while doing so. So, I aimed to create an immersive, modern-looking product with illustrations and animations.
Our central vision for this product focused on showcasing the wide range of calculators and making it extremely easy to calculate something. So, while crafting the wireframes, I constantly focused on the job to be done and placed the calculators within reach at all times.
We had our first milestone meeting with the stakeholders after the wireframes. This way, we ensured that we aligned on everything before proceeding to the UI.
Interfaces should not contain information that is irrelevant or rarely needed. Every extra unit of information in an interface competes with the relevant units of information and diminishes their relative visibility. Ensure that the visual elements of the interface support the user's primary goals.
There are a few online calculators where you can make certain calculations. But they're all very outdated in style and do not abide by basic usability rules in most cases. Plus, none of them supported Turkish.
So, we embarked on this journey to make the coolest multi-calculator in Turkish. Created the perfect balance between dark and light spaces, we achieved a modern effect supported with bold colour selections.
The hero area has a perspective grid background inspired by the 80's cyberpunk visuals. The aim was to create a technological feeling with an artistic touch.
A sliding typography block presents the variety of calculators Apex has. The user can select any topic from this block and start calculating.
-The colour scheme creates a light, stylish look matched with bold dark areas and cool gradients.
-Illustrations were created to enhance the experience.
-Bold typographic elements are selected to support the vision for the design.
-The main focus was kept on presenting the variety of calculators you can find.
-We combined the calculation area with enticing content to enrich the user's experience.
-We made it possible for the users to develop and publish their own calculator ideas.
The landing page is pretty simple for a reason: to direct the user to the calculators and encourage them to try it out for themselves immediately.
We also decided to explain how calculators work and give some guiding hints about them.
Users can discover further calculation topics on this page with the help of some category filters and a live search.
Since this is an open-source project, we knew that the number of calculators would increase in time, so it was critical to give some control to the user over the listing page.
The variety of calculators needed a modular solution where different inputs would be included or excluded in different topics.
Also, we wanted to provide an extra layer of control over the results. As a result, the user could change the metrics or add advanced settings for their calculations with the final design.
I was responsible for writing the guiding content for this project, such as labels, headlines, descriptive texts and even the hero content. The main content was provided by blog writers working with Evrim Agaci.
Collaborating with another designer, the mobile versions of the initial concept were prepared accordingly.
With the perfect combination of light, dark and neon, we established a playful yet nifty color scheme.
The font used in this project is Outfit, carefully selected from Google Fonts. It's a A beautiful geometric sans. Outfit is a variable font family carefully crafted & and designed for computer screens.
The design impressed the stakeholders and became a loved product instantly. It was one of the many successful collaborations we made with Evrim Agaci.
Next Project
