Discover the best move websites created by professional designers. Get inspired and start planning your perfect move web design today!

Alurena, an online cosmetic store, offers a wide range of daily care products for all skin types.

Problem

When it comes to cosmetics, it can be difficult to fully understand a product's texture and feel without trying it in person. That's why the task was to create a gentle and inviting site that allows customers to understand what Alurena products are like and how they can benefit their skin routine.

Solution

The website was made in Webflow and featured stunning hover and scroll effects to enhance the user experience. We focused on showcasing product quality and effectiveness using webflow interactions. We want the customers to feel confident in their purchase and to see firsthand the positive results that the products can provide.

Result

We got a website where every woman finds the perfect solution for any skin problem she may have.

Allurena

Alurena E-commerce Website | Skin Cosmetics 

Welcome to Daily Interaction #135.

This demo showcases a project card animation on hover.

With this effect the title and caption move on hover. A "View Project" appears and moves down with an underline animation. There is also a cover overlay that moves and appears from the upper-left on hover.

This effect was achieved by creating a card wrapper and placing the color overlay inside of it with a position of absolute and full. Then a text wrapper was added to the card wrapper in the center with a heading, text block, and view project text block. The 'view project' text and underline were added inside of another wrapper. Then with interactions I had the different elements move and the underline scale.

Inspired by: https://www.everess.fr/

There will be no daily interactions for a while as I am currently working on a few other projects. Stay tuned for the new projects!

To view more daily interactions and premium content visit:
https://www.webdevforyou.com/

WebDev for You - Daily Interaction #135

WebDev For You - Daily Interaction #135

Move the cursor to the right or to the left :)

Individual

Follow Cursor

Welcome to daily interaction #111.

This demo showcases a product card with a zoom animation on hover. When the user hovers over the product image it scales up to zoom so the user can see more details about the physical product. This effect was accomplished by placing the image div inside of a wrapper with an overflow of hidden. When the user hovers over the image wrapper the image div scales up to double the size. Then with a 'mouse move over element' interaction I have the image move in different directions when hovering over the image wrapper. This allows the user to move around the image and see different parts.

To view more daily interactions and premium content visit:
https://www.webdevforyou.com/

WebDev for You - Daily Interaction #111

WebDev For You - Daily Interaction #111

Memberstack

Happy Friday, everyone! 👋

I had some fun recreating the wonderful Yeti Login Codepen by Darin S. The project is 100% Webflow and relatively simple all things considered. I broke the SVG into parts, added a hover-over-element interaction to the background, & hover in / hover out interactions to the email, password, and login fields. 

The "rotating" head effect is created by moving close-up elements slightly more than background elements. I.e. the nose moves 11px to the left or right, while the mouth only moves 9px. The blue face SVG moves 6px, and the body doesn't move at all. 

Here's the link to the original project https://codepen.io/m3eu/pen/VwYBbwO

If you have any questions, feel free to drop a comment below. Thanks!

Yeti Login

3D cells animation: move mouse on viewport + 3D camera.

3D cells

3D Animation for 404 Error Page

Welcome to Daily Interaction #106.

This demo showcases a reverse image effect on mouse move. There are two images facing the opposite direction on both sides of the screen and when you move your mouse on the x-axis the images get closer or further apart. It is a very simple effect, but I think it can be very effective. To use the same image and save on load time I flipped the right image horizontally on the y-axis within the interaction. Both the left and right image are in a wrapper with an overflow set to hidden. I then applied a 'mouse move in viewport' interaction to move both images in and out as the mouse moved on the x-axis.

Demo requires mouse or trackpad input.

To view more daily interactions and premium content visit:
https://www.webdevforyou.com/

If you'd like more information on how this interaction was accomplished be sure to join the Slack Community!

WebDev for You - Daily Interaction #106

WebDev For You - Daily Interaction #106

Notes

Moving notes on a page

America's Bottle Bill is an organization that aims to promote the implementation of "bottle bills" in the United States. It would require paying a deposit on particular beverage containers to reduce litter and promote recycling.

Problem.
The main problem that the website aimed to address was the need for more awareness and understanding of the benefits of bottle bills among the general public. The organization wanted a website that could effectively communicate the importance of these laws.

Solution.
We created an easy-to-navigate Webflow website to solve this problem. We added animations such as hover effects to make the website more interactive and engaging. We combined minimalist design with animations, for example, a counter of benefits from using Bottle Deposits. It allows focusing on the profits at once so the visitor will want to join the initiative.

Result.
The website effectively communicates the organization's message and encourages visitors to be involved in the campaign.

America's Bottle Bill

America's Bottle Bill Landing Page 

A professional and contemporary landing page template created especially for finance organizations are called Filllo: A Fintech Webflow Template. We tried to make it clean yet modern by keeping the current design trend in mind. It is ideal for building a cutting-edge website for your financial services business.
The beautiful hover, scroll, and button effects on this Webflow-created website will satisfy users and improve their experience.

Fintech

fintech-filllo

Copy of Paweł's Marvelous Site

pawels-marvelous-sitee-0be33e1f84ced425

Rotational parallax, mouse move in viewport animation. Sized for mobile.

Rotational Parallax in Viewport

Rotational Parallax Animation

An end-to-end social media agency, specialising in the hospitality sector. The team have worked with some of the best in the AirBNB and STR world, bringing in millions of views and hundreds of thousands of revenue. 

I was approached by Nate to give the agency a new home online (pun wasn’t intended).

Problem
Services and work were scattered, with no easy way to show prospective clients what the agency truly offers. Lead onboarding was cumbersome, done using DMs. The business needed a more professional and legitimate public face.

Solution
Landing page to showcase service offering and work. Single page format to keep leads focused, easy to find call to action. Punchy, but elegant visual design language that allows the amazing photography and video do the talking. 

Result
The website effectively showcases the agency’s work and services and encourages visitors to book a call. The company has seen an increase in lead conversions and has streamlined their sales process.

The Content House

Flowcraft

Exceptional coaching to move executives to new levels of leadership.

Unconditional

Unconditional Leadership

Move your mouse to move along the road into the sunset.
This is an iteractive project with a gaming feel.

Discover move websites built by the Webflow community

Discover move websites built by the Webflow community