Utopia 513

Utopia 513 is a new generation of creators who really understand 3D graphics.

Our task was to develop a cool website that would show all the magic of 3D and how the guys from Utopia solve the business problems of clients with the help of 3D tools.

We understood that the main points will be to demonstrate all the information about the company, for which clients the interaction with Utopia513 will be a win-win situation, as well as cases and services. We combined all this with our branding, animated elements, as well as the magical vibe that the guys have and got a strong animated site. When you visit it, you understand that these guys are really creating unbelievable things in 3D and can solve any business problem with a creative approach.
"We create 3D magic" is the company's slogan, which the user immediately sees on the main screen. On the right, we have one of the main elements of our identity, namely the star, it is also depicted on the logo and is generally a branding element that you will see often. At the bottom, the user sees a show reel that will automatically expand to the entire screen when user scrolling, to view a collection of cool works in video format, as well as buttons, one of which immediately leads to the cases.
Here we see the showreel itself, as well as the "About Us" block with benefits, which contains a 3D sphere with the texture we use on the star and other elements. The user sees a block of services and cases on the main page with the option to switch to internal pages.
Moreover, when you hover the mouse over any of the services, one of the fragments of the work is immediately visible. As for the cases, they are made with signatures, which particular services were provided here + when scrolling, a wave-like animation was made for interactivity.

Let's go to the internal pages of the site

One of the cool, interactive elements is the team demonstration. All members of the team are made in 3D style + when user hovering the cursor, they animate, a small detail, but such small details add positivity to the user's interaction with the resource.

Now for a closer look at the two main internal pages, one of which is Service

The user sees a title for each service + a short description, as well as notes that provide answers to frequently asked questions or explain exactly what the user receives. Each service has attached cases highlights with text notes of which services were provided here. It is convenient and you can immediately see the result of the work to evaluate how well it corresponds to your request. Of course there is a CTA at the bottom of the page.

Cases

Each case has text signatures with the names of the services that were provided. There is also a convenient filter, so for users who know exactly what they need, it will reduce the time to search for relevant cases upon request.
It is also worth paying attention to the horizontal scroll, which is exactly what we implemented for the page of all cases, then when switching to a specific case, a more familiar vertical scroll occurs for the user and he sees a description of a certain job, all information, results.

Well, the details that make this site just like that.

I think you noticed that the background of the site is also slightly animated, as if shimmering, adding a magical atmosphere, and there is noise in the background, this makes the site more interesting and alive, while not affecting the usability and perception of the content by the user. And one of the elements that we adapted from the identity is the use of text animation in the form of a prompter, the moving line also adds some interactivity.