June 30, 2024

June Update [V2.4]

Image of the author of the blog.
Jordi Espinosa
Founder

Introduction

Hello everyone!

Welcome to the June update. If you're new and don't know how this works — every month at Koala UI we release an update where we incorporate new layouts, fix things, and improve others.

As every month, I bring you this month's update.

Before starting with this month's update, from Koala I want to thank all the new users who are joining us every month. It makes us very happy to see the new websites you are launching thanks to what we are creating at Koala.

What’s new in June?

We’re introducing social buttons

This was something you had requested a lot (in fact, thanks to everyone who fills out the form at koalaui.com/feedback. If you have any suggestions, you can leave them there every month, and we will incorporate them little by little.

The social buttons are normal buttons, like the default ones, but we have focused them on the use of Login with Apple & Google. (In future updates, we will add Pay with Google & Apple in the same category of Social Buttons).

Introducing “Legal Pages” + new 8 pages in it

We are introducing legal pages. These pages are usually used for all legal matters on a website: Cookies, Privacy Policy, Terms and Conditions… and everything you already know.

As a consumer, you rarely consult these pages, but as a business or organization, you are required to have them according to American and European legislation.

Until now, they did not exist in Koala, and our users created them from blog content.

Welcome blue theme! Introducing a new theme!

We are big fans of customization, and we want you to have as many possibilities as possible to create web pages.

Until now, our brand has been based on orange, and it will continue to be so, but we wanted to introduce a new theme for two reasons:

  • This way, you know how you can create more themes in Koala, even if you already planned to incorporate a new one. Some users wanted to create new themes and didn't know the correct way. We have created this new theme to show you how we would configure a new color in Koala UI if you want to incorporate new ones.
  • We give you new possibilities for imagination.

6 New Testimonials Sections

We love testimonials, and we know it's a fundamental part of a website's conversion. In the end, Koala exists for this reason, to improve conversion and SEO with pre-built sections. Testimonials are part of social proof and are crucial elements that determine the purchase of a product, thanks to seeing people's opinions.

Users are influenced by the actions of others.

New Pricing Items + New Pages

Like testimonials, pricing sections are the main sections that convert a user from a user to a client or consumer.

We had enough variants to carry out conversions on the web correctly, but we wanted to add new designs to increase the possible variations.

We have introduced:

  • 3 new entire pricing pages
  • We have improved the comparison tables.
  • We have introduced tooltips in each section of the table.

Introducing Product Pages + Login Modals

So far, at Koala, we have focused on designing marketing-related pages. For a few months now, we have been testing how Koala can work with Product aspects, and the tests have gone great, so we decided to expand to Product.

As part of the first iteration to product pages, we introduce the login modals, which can also be incorporated into marketing pages.

We have prepared designs for unique pages with the modal and others where the modal will be a popup triggered by a button.

New changes to FAQs section and pages

As part of offering new possibilities to our users, we wanted to add a new element to the FAQs. This element, like all elements — we at Koala always build sections with additional elements so that later you can choose with true or false whether to visualize it or not.

That's why you can see a Newsletter input and a button just below, giving the possibilities for you to play with toggles.

That's why we added the “Overlay” element, which will be a thin layer above that will show the effect of “there is more content”. This has a property of pointer-event: none so that it has no possible interaction, only visual.

Changes to Dark Mode

We have improved dark mode and made changes to the texts and background to give it a cleaner feel and more differentiation between main and secondary texts.

We have changed from gray 300 in secondary texts to gray 500.

2 New Templates

This month, we launched Aspire and Calaix.

Aspire, a template made for those who have studies or consultancies, we have focused on marketing, but it can be for anything.

Calaix, a template made to document code.

Less shiny but relevant aspects

  • We have reduced the gap in the “button group” elements from 16px to 8px.
  • We have added real content in some sections. (This is something we will be doing eventually, we did it from the beginning to be able to launch sooner).
  • We have changed the spaces between cards that have a container or outline, from 24px between them to 32px. (2 rem).
  • In the testimonial samples, before you could see “logo” + “rating”, and now you can only choose between those two. Either logo or rating. This generated a stack of accumulated things that was not optimal.
  • In the pricing tables, we have removed the “-” and replaced them with ❌ in cases where there is no benefit included.