AnimeCoffee - Landing page built with bricks

Showcase
1

Desktop - 2
Desktop - 21920×1331 113 KB

Hello guys!

I’ve had an incredible experience working with Bricks. Today, I’d like to share with you another one of my recent projects using this tool: a landing page for Anime Coffee.

Link of project: Anime Coffee - O primeiro restaurante temático de anime no Brasil
Soon I will post here the link to the complete presentation of the project

Anime Coffee is a network of anime-themed cafes and hamburger restaurants located in Brazil that is launching a franchise system. They called me to develop the their landing page, which was initially created in Figma and then transferred to Bricks.

There are still some adjustments we plan to make to the page to improve the user experience and make it more fluid and fast. The landing page was launched yesterday and we’ve already collected many qualified leads. :smiley:

21 Likes
2

Nice website! I liked the colors… very matching.
Didn’t like the picked font.

I see you have designed the page on the ID level, No classes??? Using utility classes too???
This doesn’t seem right, my friend. This is not efficient, Even if it is a one-page website.

Simply this is not scalable and maintainable. Take care of your client :slight_smile:

2 Likes
3

I used utility classes to speed up the development of some site elements, but I also created semantic and meaningful classes to style repeating elements on the page. I know it’s important to keep the code organized and scalable, so I avoided using utility classes exclusively. Additionally, the project is still evolving and we’re working to improve the site’s performance, fluidity, and UI. However, the client is very satisfied with the final result and we’re getting a high conversion rate. :smiley:

4 Likes
4

Very nice project! Can you tell how implement the nice .js smooth scroll library? Thanks and good work!

1 Like
5

You can use Bricksforge or Motion.page for gsap stuff (or lenis).

3 Likes
6

Thank you.

I implemented it using bricksforge.
But you can also implement it manually, just follow the official documentation of lenis.

And I used motion.page for most of the animations.

2 Likes
7

Well done. Loved the animations used and the colors.

1 Like
8

Great website. Thanks for sharing! Love it. The colorschema etc. :+1:t4:
What would I change? Only the footer. There is screen property waiting to be filled with useful stuff.

1 Like
9

Really nice work. I want to know what hosting plan and company are you using? Thanks in advanced

1 Like
10

This website uses hosting that is chosen by the customer, Hostinger on the Business Web Hosting plan.

11

great stuff! could you show how you did the horizontal scroll with bricksforge please?

1 Like
12

I used motion.page for horizontal scroll

13

Very different, bold, and creative. Brilliant work!!

1 Like
14

Great Website good animations that will be great if you can share some of your technics on getting it done

1 Like
15

This looks great! If you submit it to www.wpshowoff.com I will get your site added to the site.

16

That’s a really well-put together site with slick animations. Love the card design!