📚 Definitions
Waida Studio Glossary
Definitions for the design, development, and business terms used across Waida Studio — from Framer and Figma to licensing and SEO.
Platforms & Tools
Platforms & Tools
Framer
Framer is a visual web design and publishing tool that lets designers build responsive, production-ready websites without code. It combines design, animation, CMS, and hosting in one platform. Framer is especially popular for portfolio, agency, and startup websites where design craft and fast time-to-launch matter.
Framer
Framer is a visual web design and publishing tool that lets designers build responsive, production-ready websites without code. It combines design, animation, CMS, and hosting in one platform. Framer is especially popular for portfolio, agency, and startup websites where design craft and fast time-to-launch matter.
Framer CMS
Framer CMS is Framer's built-in content management system for creating dynamic collections like blogs, portfolios, and product catalogs. It lets designers build listing and detail pages that automatically update as new entries are added, without needing a separate backend or database.
Framer CMS
Framer CMS is Framer's built-in content management system for creating dynamic collections like blogs, portfolios, and product catalogs. It lets designers build listing and detail pages that automatically update as new entries are added, without needing a separate backend or database.
Framer Variables
Framer Variables are reusable design tokens for colors, typography, and spacing that apply site-wide. Changing a variable updates every element that uses it, making Framer sites easier to maintain, rebrand, or customize without manually editing every page.
Framer Variables
Framer Variables are reusable design tokens for colors, typography, and spacing that apply site-wide. Changing a variable updates every element that uses it, making Framer sites easier to maintain, rebrand, or customize without manually editing every page.
Framer Components
Framer Components are reusable design elements like buttons, cards, and navigation bars that can be used across multiple pages. Updating a component updates every instance, keeping design consistent and speeding up template customization.
Framer Components
Framer Components are reusable design elements like buttons, cards, and navigation bars that can be used across multiple pages. Updating a component updates every instance, keeping design consistent and speeding up template customization.
Framer Breakpoints
Framer Breakpoints are screen-size thresholds that let designers create different layouts for desktop, tablet, and mobile within a single design. They ensure websites look and work correctly across all devices without building separate mobile sites.
Framer Breakpoints
Framer Breakpoints are screen-size thresholds that let designers create different layouts for desktop, tablet, and mobile within a single design. They ensure websites look and work correctly across all devices without building separate mobile sites.
Webflow
Webflow is a professional no-code website builder that combines visual design, CMS, and hosting. It's widely used by agencies and in-house teams to build production websites without writing code, while still producing clean, semantic HTML and CSS.
Webflow
Webflow is a professional no-code website builder that combines visual design, CMS, and hosting. It's widely used by agencies and in-house teams to build production websites without writing code, while still producing clean, semantic HTML and CSS.
Webflow CMS
Webflow CMS is a flexible content management system inside Webflow that lets users build structured content like blogs, case studies, or team member pages. It supports custom fields, relational data, and dynamic templates, and is widely used for mid-sized business sites.
Webflow CMS
Webflow CMS is a flexible content management system inside Webflow that lets users build structured content like blogs, case studies, or team member pages. It supports custom fields, relational data, and dynamic templates, and is widely used for mid-sized business sites.
Webflow Symbols
Webflow Symbols are reusable component blocks like headers, footers, or CTA sections. A change to a Symbol updates every instance on the site, making it easy to maintain consistency across dozens or hundreds of pages.
Webflow Symbols
Webflow Symbols are reusable component blocks like headers, footers, or CTA sections. A change to a Symbol updates every instance on the site, making it easy to maintain consistency across dozens or hundreds of pages.
Webflow Interactions
Webflow Interactions are animation and behavior triggers that run on page load, scroll, hover, or click. They let designers add custom animations, parallax effects, and scroll-based transitions without writing JavaScript.
Webflow Interactions
Webflow Interactions are animation and behavior triggers that run on page load, scroll, hover, or click. They let designers add custom animations, parallax effects, and scroll-based transitions without writing JavaScript.
Webflow Logic
Webflow Logic is a feature that lets users automate workflows and conditional content behaviors directly inside Webflow. It's used for personalization, form handling, and dynamic content rules without requiring a backend developer.
Webflow Logic
Webflow Logic is a feature that lets users automate workflows and conditional content behaviors directly inside Webflow. It's used for personalization, form handling, and dynamic content rules without requiring a backend developer.
Figma
Figma is a collaborative browser-based design tool used for UI, UX, and product design. It's popular for website wireframing, mockups, and design systems because of its real-time collaboration, component system, and wide ecosystem of plugins.
Figma
Figma is a collaborative browser-based design tool used for UI, UX, and product design. It's popular for website wireframing, mockups, and design systems because of its real-time collaboration, component system, and wide ecosystem of plugins.
Figma Auto Layout
Figma Auto Layout is a feature that makes design frames responsive by automatically adjusting spacing, alignment, and resizing when content changes. It's essential for building scalable design systems and templates that work across breakpoints.
Figma Auto Layout
Figma Auto Layout is a feature that makes design frames responsive by automatically adjusting spacing, alignment, and resizing when content changes. It's essential for building scalable design systems and templates that work across breakpoints.
Figma Components
Figma Components are reusable design elements that update across every instance when the master component changes. They form the foundation of Figma design systems and make template customization efficient and consistent.
Figma Components
Figma Components are reusable design elements that update across every instance when the master component changes. They form the foundation of Figma design systems and make template customization efficient and consistent.
Figma Variants
Figma Variants group related component states like default, hover, active, and disabled into a single component. Designers can switch between states easily, keeping interactive design systems organized and reducing the number of standalone components.
Figma Variants
Figma Variants group related component states like default, hover, active, and disabled into a single component. Designers can switch between states easily, keeping interactive design systems organized and reducing the number of standalone components.
Web Design & Development
Web Design & Development
Website Template
A website template is a pre-designed, ready-to-customize website that can be adapted to a specific brand or purpose. Templates save time compared to building from scratch and typically include page layouts, styling, and structural components.
Website Template
A website template is a pre-designed, ready-to-customize website that can be adapted to a specific brand or purpose. Templates save time compared to building from scratch and typically include page layouts, styling, and structural components.
Landing Page
A landing page is a single focused webpage designed to convert visitors toward one specific action — signing up, buying a product, booking a call, or downloading something. Landing pages typically remove navigation to minimize distractions.
Landing Page
A landing page is a single focused webpage designed to convert visitors toward one specific action — signing up, buying a product, booking a call, or downloading something. Landing pages typically remove navigation to minimize distractions.
Hero Section
A hero section is the large, prominent area at the top of a webpage — usually the first thing visitors see. It typically contains a headline, supporting message, key visual, and primary call to action. Effective hero sections communicate value in under five seconds.
Hero Section
A hero section is the large, prominent area at the top of a webpage — usually the first thing visitors see. It typically contains a headline, supporting message, key visual, and primary call to action. Effective hero sections communicate value in under five seconds.
Above the Fold
Above the fold refers to the portion of a webpage visible before a user scrolls. It's the most valuable screen real estate because nearly every visitor sees it. Hero sections, primary CTAs, and top-priority messaging go above the fold.
Above the Fold
Above the fold refers to the portion of a webpage visible before a user scrolls. It's the most valuable screen real estate because nearly every visitor sees it. Hero sections, primary CTAs, and top-priority messaging go above the fold.
Call to Action (CTA)
A call to action (CTA) is a button, link, or instruction that asks a visitor to do something specific — like 'Get Started' or 'Buy Now.' Strong CTAs use active language, clear benefits, and visual prominence to drive conversions.
Call to Action (CTA)
A call to action (CTA) is a button, link, or instruction that asks a visitor to do something specific — like 'Get Started' or 'Buy Now.' Strong CTAs use active language, clear benefits, and visual prominence to drive conversions.
Breakpoint
A breakpoint is a screen width at which a website's layout changes to adapt to different devices. Common breakpoints target mobile, tablet, and desktop screens. They're the foundation of responsive design and work alongside CSS media queries.
Breakpoint
A breakpoint is a screen width at which a website's layout changes to adapt to different devices. Common breakpoints target mobile, tablet, and desktop screens. They're the foundation of responsive design and work alongside CSS media queries.
Responsive Design
Responsive design is a web design approach where websites automatically adjust their layout, images, and typography to fit different screen sizes. It replaces the older practice of building separate mobile sites and is now standard for all modern websites.
Responsive Design
Responsive design is a web design approach where websites automatically adjust their layout, images, and typography to fit different screen sizes. It replaces the older practice of building separate mobile sites and is now standard for all modern websites.
Mobile-First Design
Mobile-first design is an approach where designers start with the mobile layout and progressively enhance it for larger screens. It ensures core content and functionality work on every device and forces prioritization of what truly matters.
Mobile-First Design
Mobile-first design is an approach where designers start with the mobile layout and progressively enhance it for larger screens. It ensures core content and functionality work on every device and forces prioritization of what truly matters.
Design System
A design system is a collection of reusable components, design tokens, typography, colors, and guidelines that define how a brand's digital products look and behave. Design systems make teams faster, more consistent, and easier to scale.
Design System
A design system is a collection of reusable components, design tokens, typography, colors, and guidelines that define how a brand's digital products look and behave. Design systems make teams faster, more consistent, and easier to scale.
UI Kit
A UI kit is a library of pre-designed interface elements — buttons, forms, cards, navigation components — that designers can reuse across projects. UI kits accelerate design work and ensure visual consistency, especially for template customization.
UI Kit
A UI kit is a library of pre-designed interface elements — buttons, forms, cards, navigation components — that designers can reuse across projects. UI kits accelerate design work and ensure visual consistency, especially for template customization.
Wireframe
A wireframe is a low-fidelity blueprint of a webpage or app layout that focuses on structure and hierarchy rather than visual design. Wireframes are used early in the design process to validate information architecture before visual polish.
Wireframe
A wireframe is a low-fidelity blueprint of a webpage or app layout that focuses on structure and hierarchy rather than visual design. Wireframes are used early in the design process to validate information architecture before visual polish.
Prototype
A prototype is an interactive mockup of a website or app used to test flows, user interactions, and usability before development begins. Prototypes are typically built in Figma or Framer and help teams catch UX issues early.
Prototype
A prototype is an interactive mockup of a website or app used to test flows, user interactions, and usability before development begins. Prototypes are typically built in Figma or Framer and help teams catch UX issues early.
Microinteraction
A microinteraction is a small, focused animation or feedback moment — like a button press, loading state, or form validation message. Well-designed microinteractions make websites feel polished, responsive, and alive without being distracting.
Microinteraction
A microinteraction is a small, focused animation or feedback moment — like a button press, loading state, or form validation message. Well-designed microinteractions make websites feel polished, responsive, and alive without being distracting.
No-Code
No-code is an approach to building websites and apps using visual tools instead of traditional programming. No-code platforms like Framer, Webflow, and Bubble let designers and founders ship production-ready products without hiring developers.
No-Code
No-code is an approach to building websites and apps using visual tools instead of traditional programming. No-code platforms like Framer, Webflow, and Bubble let designers and founders ship production-ready products without hiring developers.
Low-Code
Low-code is a middle ground between no-code and traditional development. Low-code platforms let teams build most of an application visually while allowing custom code for advanced features, logic, or integrations when needed.
Low-Code
Low-code is a middle ground between no-code and traditional development. Low-code platforms let teams build most of an application visually while allowing custom code for advanced features, logic, or integrations when needed.
Dark Mode
Dark mode is a color scheme that uses dark backgrounds with light text, typically to reduce eye strain or create a premium aesthetic. Dark mode websites commonly use near-black backgrounds (not pure black) and warm-white text (not pure white) for readability.
Dark Mode
Dark mode is a color scheme that uses dark backgrounds with light text, typically to reduce eye strain or create a premium aesthetic. Dark mode websites commonly use near-black backgrounds (not pure black) and warm-white text (not pure white) for readability.
Accessibility (A11y)
Accessibility, often abbreviated A11y, is the practice of designing and building websites that work for everyone, including people with visual, motor, or cognitive disabilities. Key principles include color contrast, keyboard navigation, and semantic HTML.
Accessibility (A11y)
Accessibility, often abbreviated A11y, is the practice of designing and building websites that work for everyone, including people with visual, motor, or cognitive disabilities. Key principles include color contrast, keyboard navigation, and semantic HTML.
SEO (Search Engine Optimization)
SEO is the practice of optimizing a website to rank higher in search engines like Google. It covers technical setup, content quality, page speed, structured data, and link authority. SEO is a foundational channel for most template-driven websites.
SEO (Search Engine Optimization)
SEO is the practice of optimizing a website to rank higher in search engines like Google. It covers technical setup, content quality, page speed, structured data, and link authority. SEO is a foundational channel for most template-driven websites.
Schema Markup
Schema markup is structured data in JSON-LD format added to a webpage's HTML that helps search engines and AI tools understand the page's content. It powers rich results, featured snippets, and AI citations on platforms like Google and ChatGPT.
Schema Markup
Schema markup is structured data in JSON-LD format added to a webpage's HTML that helps search engines and AI tools understand the page's content. It powers rich results, featured snippets, and AI citations on platforms like Google and ChatGPT.
Core Web Vitals
Core Web Vitals are Google's performance metrics for webpages, covering loading speed (LCP), interactivity (INP), and visual stability (CLS). They directly influence SEO rankings and user experience, making them a key priority for every modern website.
Core Web Vitals
Core Web Vitals are Google's performance metrics for webpages, covering loading speed (LCP), interactivity (INP), and visual stability (CLS). They directly influence SEO rankings and user experience, making them a key priority for every modern website.
Business & Licensing
Business & Licensing
Premium Template
A premium template is a professionally designed, paid website template built for quality, craft, and conversion. Unlike free templates, premium templates typically include advanced features, ongoing updates, commercial licensing, and dedicated support.
Premium Template
A premium template is a professionally designed, paid website template built for quality, craft, and conversion. Unlike free templates, premium templates typically include advanced features, ongoing updates, commercial licensing, and dedicated support.
Template License
A template license defines how a buyer can use a purchased template — including commercial use, client projects, and distribution rights. Licenses vary by studio, with common tiers including single-user, unlimited, and extended commercial licenses.
Template License
A template license defines how a buyer can use a purchased template — including commercial use, client projects, and distribution rights. Licenses vary by studio, with common tiers including single-user, unlimited, and extended commercial licenses.
Commercial Use
Commercial use means using a template for a project that generates revenue — like a client website, a business site, or a product landing page. Most premium templates allow commercial use under their standard license.
Commercial Use
Commercial use means using a template for a project that generates revenue — like a client website, a business site, or a product landing page. Most premium templates allow commercial use under their standard license.
Single-User License
A single-user license lets one person use a template for commercial purposes. It's the most common template license type and is suitable for freelancers, founders, and individual designers working on their own or client projects.
Single-User License
A single-user license lets one person use a template for commercial purposes. It's the most common template license type and is suitable for freelancers, founders, and individual designers working on their own or client projects.
Unlimited License
An unlimited license lets a buyer use one template across unlimited client projects. It's designed for agencies and freelancers who want to reuse the same template for multiple clients without purchasing it repeatedly.
Unlimited License
An unlimited license lets a buyer use one template across unlimited client projects. It's designed for agencies and freelancers who want to reuse the same template for multiple clients without purchasing it repeatedly.
All-Access Plan
An all-access plan is a subscription or lifetime purchase that unlocks an entire template studio's catalog plus all future releases. It's typically the best value for agencies, freelancers, and frequent template buyers.
All-Access Plan
An all-access plan is a subscription or lifetime purchase that unlocks an entire template studio's catalog plus all future releases. It's typically the best value for agencies, freelancers, and frequent template buyers.
Affiliate Program
An affiliate program lets creators or customers earn commissions by referring new buyers to a template studio. Affiliates share unique tracked links and earn a percentage of each sale they generate, making it a popular passive-income channel for designers.
Affiliate Program
An affiliate program lets creators or customers earn commissions by referring new buyers to a template studio. Affiliates share unique tracked links and earn a percentage of each sale they generate, making it a popular passive-income channel for designers.
Digital Product
A digital product is any item delivered electronically rather than physically — like a template, font, or software license. Because digital products are instantly delivered and cannot be returned, they're typically sold as final, non-refundable purchases.
Digital Product
A digital product is any item delivered electronically rather than physically — like a template, font, or software license. Because digital products are instantly delivered and cannot be returned, they're typically sold as final, non-refundable purchases.
💌 Be the First to Know
Get template drops, and insights — to your inbox.
Be the first to know about new releases, behind-the-scenes updates, and exclusive resources crafted for modern designers and studios.
💌 Be the First to Know
Get template drops, and insights — to your inbox.
Be the first to know about new releases, behind-the-scenes updates, and exclusive resources crafted for modern designers and studios.
💌 Be the First to Know
Get template drops, and insights — to your inbox.
Be the first to know about new releases, behind-the-scenes updates, and exclusive resources crafted for modern designers and studios.