Click on the image to read the detailed article
Recently, I built my personal portfolio website using Framer—with almost no coding experience.
The process? Effortless. Addictive. Engaging.
I kept coming back, tweaking, perfecting—without realizing how much time I was spending.
Why? Because Framer nailed the psychology of habit-forming products.
At the same time, I was reading this wonderful book titled “HOOKED: How to Build Habit Forming Products” by Nir Eyal. Having immense interest in diving deep into what goes behind making the products to keep users so “hooked”, this was the perfect book to go to.
The book not only explains the HOOKED model but also explains each stage of the model in great detail. It explains the origins of habits, why and how certain actions become habits and why certain actions do not. Not only that, the book also gives plenty of real life case studies which helped me understand how things said earlier in the book have been practically applied in real life products.
What is Framer?
Framer is an online design tool that allows users to create interactive and stylish websites and projects as per their wish. What makes this tool so special is that it is a No Code platform, i.e. a user doesn’t necessarily needs to know coding in order to make any project.
What is HOOKED Model?
HOOKED Model, is a framework which has been developed by entrepreneur, author, and behavioral economist Nir Eyal.
It talks about what drives customer behaviour in order to build products that customers use habitually. It describes an experience designed to connect the user’s needs to the company’s product frequently enough to form it as a habit.
The HOOKED model has 4 stages:
TRIGGER
ACTION
VARIABLE REWARD
INVESTMENT
1. TRIGGER
Trigger is the actuator of the behavior, i.e. the spark that a user feels which makes him want to do a particular action or achieve a particular result. For example, by looking at an image of a pizza, the viewer may be tempted to eat one for lunch. In this case that image is a Trigger.
It is of 2 types:
1. External Trigger: They are not inherently originated within the user but imbibed from the external environment.
2. Internal Trigger: They are inherently originated within the user.
What Triggers Made Me Use Framer?
I believe today, it has become all the more important to have an online presence, in whatever work you do. It not only helps you showcase your work to others, but constant feedback from people who view your work online, helps you constantly improve and learn. Keeping this in mind, almost everyone today aims to have a website either for their personal use or their business use.
However, making a website is not that easy, you need to have good coding and design skills, have a good understanding of responsiveness, how internet works, and efficient programming skills. Taking a freelance route might make it difficult for you to constantly update the website from time to time and may also be costly for many.
This has been a painpoint for many people which Framer set out to solve as it eliminated the need to code to design and create a personalised website.
External Trigger
Through Social Media and Youtube, I was introduced to a Framer advertisement which was short and crisp enough to catch my interest. On searching and watching the various tutorials and hands on videos made on how to use it, made me confident to give it a try. The trigger was strong enough for me to take the first step and hence I started making my first website.
Internal Trigger
Initially, it was a bit overwhelming to start as I lacked the structure and plan on how to proceed, but as I spent more time on the platform, thinking of how I want my website to look, things became clearer.
After a certain point, when I left off the work, the urge to explore various interactive tools acted as an internal trigger to keep me hooked to the process. This is because each time I used the platform, I was intrigued by finding either of these two things:
Some unique tool which made the website better such as Tickers and Slideshows
More efficient way to do something which otherwise took a lot of time and energy such as Components, and Styles.
2. ACTION
For any activity to be actionable, the “Doing” must be simpler than the “Thinking”
The Action phase in the HOOKED model is where users take the next step after experiencing a trigger. But for action to happen, it must be easier than thinking—meaning, the simpler a task is, the more likely users are to do it.
Framer removes friction and lowers the barrier to entry:
1. No-code, drag-and-drop interface – Makes website building seamless.
2. Figma integration – Allows designers to import and modify files effortlessly.
3. Auto-responsive design – Eliminates the complexity of manual adjustments.
According to the FOGG BEHAVIOR MODEL:
B=MAT (Behavior = Motivation x Ability x Trigger), action happens when:
Motivation is high (users want to build a website)
Ability is high (Framer makes it easy).
Trigger is present (ads, curiosity, or social influence).
When all three align, users engage effortlessly—turning a simple action into a habit.
This means that to initiate any behaviour, the presence of Motivation, Ability, and Trigger is essential. Absence of any of these will lead to inaction.
3. VARIABLE REWARD
This is the stage where the user finally gets what he is going through all this process for — The Reward. Not only that, the user also goes on to see the live changes to the website he/she is creating in the platform and feels great when the work finally starts taking a planned shape.
Variability is great because, if the user is amused with the results frequently, it enhances the chances that he’ll use the product again.
There are 3 types of rewards which a user experiences:
Social Reward
Refers to the search for social rewards fueled by connectedness with other people.
Framer amazingly provides the Reward of the Tribe as it allows users to invite their team members and collaborate on the same project. Also, the platform allows the community members to post various templates, and projects which through others’ likes and comments acts as a Social Reward
Material Reward
Refers to the search for material rewards and information.
Framer offers numerous components, plugins, and templates, to use in the marketplace, which helps the users enhance their projects and bring innovative ideas to life.
Intrinsic Reward
Refers to the internal or self reward the user feels after accomplishing or achieving a win. Through multiple small wins, the user is kept motivated and engaged in the process.
Framer’s user interface is simple to learn and start, which gives users a self confidence to start off with their project. As the user spends more time on the platform, he learns more and more new techniques which give them a high. Eventually, on completion of the project, the user ultimately feels proud of the work that he has done.
4. INVESTMENT
Did you ever wonder why street food often tastes better than most 5 star restaurants’ food?
It’s mostly because you see the food actually being prepared in front of you by the street vendor which makes you anticipate and hype up the quality of the final result. The bottom line is that you see the time and effort being put in to prepare the dish and hence you find it tastier.
Similarly with products, the more time and effort you as a user put into using a product, the higher you are going to value it.
This phase generally comes after the Reward phase as the user has just received a reward and is on a high, which makes it a better time to allow users to invest.
This phase works on the principle that since the user has just tasted the rewards he/she will get from using the platform, he/she will be willing to invest their time and effort further hoping to receive better rewards in the future. Once they do this, they store valuable information about them in the platform, which:
Makes it difficult for them to leave the platform,
Allows the platform to use and improve, and
Makes them want to return and re-engage with the platform in the future.
Once the user has invested, the platform may use that as a way to load the next trigger for the users to return to the platform.
We all receive those funky and fun notifications messages from Zomato, Swiggy or countless other apps, right? What are they?
They are nothing but triggers, a prompt to make you return and re-engage with their services.
How Framer Makes Users Invest ?
Framer autosaves user’s work instantly to the cloud which makes it easier for them to continue without bothering about losing their work. Moreover, the tutorial videos, help the users learn the platform better and thus enhance their skills to complete their work efficiently.
Framer allows you to create a library of your own by purchasing and accessing different plugins and assets from the marketplace. This not only creates another revenue channel for Framer, but also allows you to value the platform more as you have customized it to your convenience.
Therefore, Framer utilizes its Investment phase to make users commit effort to create personalised experiences, develop skills, and contribute to the community. This thus, increases re-engagement and repeated use of the platform.
Conclusion
Framer, thus, is a great platform which tries to bridge the gap between creativity and functionality. Through the Hooked model, Framer ensures that the users not only find it easy to start their projects but also stay engaged enough to stick through the process.
As the gap between technology and user experience narrows, Framer exemplifies through its platform how a thoughtful approach to design can shape the future of user experience and interactions.
