Kintyp Studio | Responsive Title Animations and Lower Thirds icon

Kintyp Studio | Responsive Title Animations and Lower Thirds

CloneGo to Website
Hot or Not
Kintyp Studio | Responsive Title Animations and Lower Thirds

Description

Description

Kintyp Studio is a project inspired by some video effects, which I decided to make available for HTML designers and developers. Using the abilities of Julien Garnier’s Anime.js and with the power of CSS3 and JavaScript I present you ten responsive text animations. You can present your message in attractive way in your hero headers, synced video overlays or as paragraph titles in your text content. The applications are only limited by your imagination.

* IMPORTANT NOTE – the project DOES NOT support IE11 *

The product is tested on all variety of devices to make sure it reacts properly on different display sizes. I am using relative font size units, which values I also recalculate if the container is smaller than the viewport. This way the text content is the defining start point from where I calculate the sizes of all other elements that build each effect. In this way I achieve responsive behavior.

Usage

The smooth animation effects can be used in variety of cases. Some of them are:

  • YouTube Overlays
  • Video Overlays
  • Hero Headers
  • Paragraph Titles

YouTube Overlays

This demo shows a lower third that loops independently from the video and two animated messages that are in sync with the YouTube video.

Video Overlays

In this demo I use the HTML5 video object. It is possible to handle the timeupdate event and monitor the currentTime value, while the video is playing. Then you can simply decide at what point of time to start your text overlays. Same technique can be used with the HTML5 audio object.

Hero Header

This example uses all effects to present a long message. Each effect points to the next and the last one points to the first in order to create a continuous loop. This is the most common usage and works smooth even on very old devices.

Paragraph Titles

Here you can see how the animations can be used as titles in your text content. They start one after another and loop on their own.

How to use the authoring tool

The applications of the effect require, almost all of the times, more than one text animation. The Kintyp Studio is the tool that I created to enable you to build your effects one by one. You need to follow few simple steps to customize your content and to generate the needed code. You can find more details in the product’s documentation.

  1. Choose effect type.
  2. Set effect attributes.
  3. Style your content.
  4. Preview the result.
  5. Publish your effect.

Features

  • Ten types of animations.
  • Responsive Behavior.
  • SEO friendly.
  • More than 20 customizable parameters.
  • Ability to handle three events, which fire: at the end of the showing animation, at the end of wait time, at the end of the hiding animation.
  • Authoring tool

Changelog

RELEASED

Categories

codecanyonMiscellaneous

Tags

hero headerseo friendlytext animation

External listing. code.market does not sell this product and does not process payment for it. Pricing, payment, delivery, licensing, refunds, and support are handled by the third-party merchant on its own website. We may earn an affiliate commission from a referral. Details.

Products of the Week.

Submit
codester.com

codester.com

SocialDesk+: Omnichannel Social Commerce & Business Management Platform This is stronger than simply “Social Commerce and Messaging” because it tells buyers this is a complete business platform, not just a messaging script. Turn Social Conversations Into Sales SocialDesk+ is a complete omnichannel social commerce and business management platform built for businesses that sell and communicate with customers through social media. Instead of switching between WhatsApp, Facebook, Instagram and TikTok, businesses can manage customer conversations, comments, products, leads, follow-ups, automation, teams and business reports from one professional workspace. And because the full source code is included, developers, agencies and entrepreneurs can customize, rebrand and launch SocialDesk+ as their own business solution or SaaS platform. 🚀 Build Your Own Social Commerce Business SocialDesk+ gives you the foundation to launch: - Your own SaaS platform - A white-label social CRM - A social-commerce management system - A customer communication platform - A business messaging solution - A custom solution for clients - A multi-business subscription platform 💬 Connect Your Customers Supported social channels include: WhatsApp • Facebook • Instagram • TikTok Bring supported conversations into one centralized workspace and help businesses respond faster without constantly switching between platforms. 🛍️ More Than a Messaging Platform SocialDesk+ combines communication with the tools businesses need to manage customer opportunities: Inbox Manage customer conversations from connected channels. Comments Monitor and respond to social-media comments. Customers & Leads Organize customer information and potential buyers. Products & Catalog Manage products and give your team quick access to product information. Follow-Ups Make sure potential customers don't get forgotten. Automation Automate repetitive customer questions and responses. AI Assistant Provide AI-assisted communication when configured. Team Management Give managers and staff access to the business workspace. Reports & Analytics Track activity using business reports and analytics. The current product listing already includes these capabilities. 🔥 Why Buyers Will Want It Launch Faster Start with an already-built business platform instead of developing the entire system from zero. Customize Everything The full source code is included, allowing developers to change branding, features, workflows and integrations. Build a SaaS Create multiple business workspaces and offer SocialDesk+ as a subscription-based service. Sell to Businesses Offer it to retailers, restaurants, service businesses, online sellers, agencies and other businesses that communicate with customers through social media. Mobile + Web + Backend This isn't just a mobile UI template. It includes: - Flutter mobile application - Python / FastAPI backend - Web interface - Administration tools - Database infrastructure - API-based architecture - SQLite / PostgreSQL support - Android and iOS project structure 💼 One Platform. Multiple Business Opportunities. For SaaS Entrepreneurs Launch your own subscription platform and allow multiple businesses to operate inside separate workspaces. For Software Agencies Customize and rebrand the platform for clients instead of building an omnichannel business system from scratch. For Developers Use the complete source code as a foundation for your own social-commerce or customer-management product. For Businesses Deploy a dedicated version for your own customer-service and social-commerce operations. 🧩 What's Included Mobile - Flutter / Dart - Android - iOS project Backend - Python - FastAPI - SQLAlchemy - Alembic Database - SQLite - PostgreSQL Web - HTML5 - CSS3 - JavaScript Deployment - Docker - Docker Compose - Production configuration Business Platform - Multi-workspace architecture - Authentication - Teams - Customers - Products - Messaging - Comments - Automation - Reports - Subscriptions - Administration The current listing also documents third-party integrations such as Meta, TikTok, Stripe, Firebase, SMTP and optional OpenAI configuration. ⚡ What Makes SocialDesk+ Different? You're not buying a simple: ❌ Chat UI ❌ WhatsApp clone ❌ Flutter template ❌ Admin dashboard ❌ Basic CRM You're getting a complete business platform foundation that can be customized, branded and commercialized. Connect. Automate. Manage. Grow. SocialDesk+ Omnichannel Social Commerce & Business Management Platform One important change I'd make to the current listing The current page starts with: “A simple guide to managing your social conversations, customers, products and business activity.”

Other · 3,855 views · 32 clicks

$2

Go to Website
Kintyp Studio | Responsive Title Animations and Lower Thirds | Code Market