Ahmed Ibrahim

LiveKit's new Answering Machine Detection is a state machine, not a feature

me@ahmed-ibrahim.com — Thu, 14 May 2026 00:00:00 GMT

Yesterday LiveKit shipped Agents 1.5.9. Buried in the release notes, between a Deepgram redaction parameter and a WarmTransferTask DTMF fix, is the line that matters for anyone running outbound voice agents:

Answering Machine Detection (AMD) is now built in.

Until this release, if you placed outbound calls and wanted to know whether you reached a human, a voicemail box, or an IVR menu, you wrote it yourself. We did. Two other teams I traded notes with last year did too. Now it's a primitive.

The classifier is the easy part. The state machine you build around it is where the work lives.

Outbound is not inbound, flipped backwards

When someone calls your business, the moment the call connects you know exactly one thing. There's a human on the other end and they want something. The agent starts talking.

When your agent calls someone, the moment the call connects you know nothing. The line might be:

A human ("Hello?")
A voicemail box ("Hi, you've reached Bob. Please leave a message after the beep.")
An IVR menu ("Press 1 for sales, 2 for support...")
A network situation that connected but no one actually answered

Each one needs its own agent behavior. Talk to voicemail as if it's a human and the message goes nowhere, plus you've burned a callback. Greet a real human with a stiff voicemail script and you sound like a scam. Try to navigate an IVR by speaking when you should be sending DTMF tones, and you sit on hold forever.

The first second of an outbound call is the most expensive second. You have to classify before you commit to a behavior.

What AMD actually emits

LiveKit's AMD model outputs one of three results per call:

human: a person picked up
voicemail: answering machine greeting
ivr: automated menu, press-N-for-X tree

Plus a confidence score and the audio segment it classified on.

The classification happens in the first 1 to 3 seconds of audio after the connect. You don't get to wait. Every additional second of silence before the agent starts talking makes the human on the other end (if there is one) more confused and more likely to hang up.

How 1.5.9 wires it up

The AMD result drops into AgentSession as a lifecycle event. The toy version looks like this:

session = AgentSession(
    stt=...,
    llm=...,
    tts=...,
    amd=AMDOptions(
        enabled=True,
        timeout=3.0,
        confidence_threshold=0.7,
    ),
)

@session.on("amd_complete")
async def handle_amd(event):
    if event.result == "human":
        await session.say("Hi, this is the assistant calling about...")
    elif event.result == "voicemail":
        await wait_for_beep(session)
        await session.say(voicemail_script)
        await session.hangup()
    elif event.result == "ivr":
        await navigate_ivr(session, target_extension="2")

That works in a demo. In production, you'll spend most of your time on the parts that aren't in this code.

The branches that look obvious aren't

Here's the shape we converged on after running outbound flows at scale:

For copy/paste:

CONNECTED
   │
   ▼
AMD_PENDING  (max 3.0s)
   │
   ├── human, conf > 0.7      → HUMAN_CONVERSATION
   │
   ├── voicemail               → WAIT_FOR_BEEP → LEAVE_MESSAGE → HANGUP
   │
   ├── ivr                     → NAVIGATE_IVR (DTMF state machine)
   │
   ├── conf < 0.7              → UNCERTAIN_PROBE
   │                                  │
   │                                  └── "Hello, is this <name>?" → reclassify
   │
   └── timeout                 → HANGUP_RETRY (back off, try again later)

Each branch has its own failure modes.

HUMAN_CONVERSATION wants the agent to start talking fast. We aim for under 200ms after the AMD event. Anything over 800ms reads as a robot or a bad connection, and people hang up. The rest of the pipeline burns through that budget: streaming TTS, prewarmed LLM context, and tool-call prefetching all have to be ready before the first word goes out.

WAIT_FOR_BEEP is where voicemail handling falls apart. Voicemail greetings vary from 5 to 25 seconds. You can't just start talking. You need a beep detector (energy plus frequency signature) running for as long as AMD result is voicemail. Get this wrong and your message starts mid-greeting, which sounds like a broken bot.

LEAVE_MESSAGE has tight constraints. Voicemail boxes cut off somewhere between 30 and 60 seconds, and voicemail-to-text systems will index whatever you say. Write the message so it reads cleanly in a transcript, then make sure it also sounds OK out loud. Write the script as if a transcription model is the first audience. Because one is.

NAVIGATE_IVR is a different state machine entirely. Once AMD says IVR, you're in DTMF land. Speech doesn't work, and the timing of digits matters. Some IVRs swallow digits sent during prompts. Others won't accept input until a beep. You need menu prompt recognition (small ASR model, not your main LLM) plus a digit-sequence emitter with per-vendor tuning.

UNCERTAIN_PROBE is the move when AMD comes back below threshold. Don't commit. Say something a human would respond to and a voicemail wouldn't. "Hi, can you hear me?" is a good probe because:

A human says "yes" or "hello" within 1 to 2 seconds
A voicemail keeps playing its scripted greeting, ignoring you
An IVR ignores the question and continues its menu

You reclassify based on what comes back. This recovers about 60% of the low-confidence cases we'd otherwise have to hang up on.

What you should actually measure

After you ship this, four metrics matter. None of them are "model accuracy."

Detection latency, P50 and P95. Time from connect to amd_complete. In our pre-1.5.9 system this was around 1.4s P50, 2.8s P95. LiveKit claims their model is faster. Measure it on your own audio. Every telephony stack adds different noise characteristics.

Per-class false positive rate. Don't track overall accuracy. "Voicemail when actually human" and "human when actually voicemail" carry different costs. In our outbound flows, mistaking a human for voicemail is worse: we play a recorded script at someone standing there confused, who then hangs up and remembers the brand as the one with the robot calls. Weight your scoring to your business.

False-positive cost in dollars. Pick a number for the cost of a wasted human contact. Multiply by FP rate. Pick a number for the cost of a confused real human (complaint, churn, lost sale). The model is good if it minimizes weighted FP cost, not raw accuracy.

Time to first word after AMD. If AMD says human, how fast does your agent actually say its first word? This is where the rest of your pipeline cost lives. If it's over 500ms, AMD is not your bottleneck.

What 1.5.9 doesn't give you

Things production teams still build themselves:

Carrier-specific voicemail patterns. Verizon, AT&T, and T-Mobile voicemail systems each have their own greeting tempos and beep frequencies. A model trained on aggregate data is OK at all of them and best-in-class at none.

Voicemail systems with no beep. Some VoIP boxes say "leave your message after the beep" without an actual beep. Or they use a tone the model wasn't trained on. We've seen messages start before the box is ready, getting clipped mid-sentence.

IVR navigation. AMD tells you the call is an IVR. It does not help you navigate one. That's a separate speech-to-intent pipeline tuned for menu prompts, plus a DTMF emitter that knows when each carrier accepts digits.

Real-time confidence updates. AMD fires once with a single confidence score. In practice, you want the score to update as more audio arrives, because a 1.2-second greeting and a 4-second greeting carry very different signal. Right now you get one shot.

If you're already on Agents 1.4 or older

A few moves before you flip the switch:

Don't migrate everything yet. AMD is opt-in. Wrap 5 to 10% of outbound calls with it and shadow-log the result alongside your current logic. Measure agreement before you replace your old detector.
Build the state machine before you trust the classifier. The classifier is the easy part. The branching logic for voicemail, IVR, and uncertain probes is where your time goes.
Instrument detection latency before changing anything. You want a baseline. Otherwise you can't tell whether the new model is actually faster or just newer.
Write the voicemail script for transcription. Because a transcription bot will read it before any human does.

The classifier is a primitive. The product is the state machine you build on top.

Typescript Decorators: What you need to know

me@ahmed-ibrahim.com — Mon, 06 Feb 2023 00:00:00 GMT

Introduction

Typescript Decorators are a feature of the Typescript programming language that adds additional behavior to an existing code. In simple words, a decorator is just a wrapper that adds some extra functionality to a class, method, property or parameter. Typescript Decorators were introduced in version 2.0 of the language, which was released in 2016.

Usage

A decorator is applied to a declaration using the @ symbol. For example, to apply a decorator to a class, you would write @myDecorator before the class definition, like this:

@myDecorator
class MyClass {
  // class body
}

Similarly, to apply a decorator to a method, you would write @myDecorator before the method definition:

class MyClass {
  @myDecorator
  myMethod() {
    // method body
  }
}

Examples

Let's look at a few examples of decorators in Typescript.

Class Decorator

A class decorator is applied to a class and can modify the constructor of the class. Here is an example:

function logClass(target: any) {
  console.log(target)
}

@logClass
class MyClass {
  constructor() {
    console.log("Instantiating MyClass")
  }
}

const myInstance = new MyClass()
// Output:
// [Function: MyClass]
// Instantiating MyClass

Property Decorator A property decorator is applied to a property and can modify the behavior of the property. Here is an example:

function logProperty(target: any, propertyKey: string) {
  console.log(propertyKey + " has been accessed!")
}

class MyClass {
  @logProperty
  myProperty: string = "Hello World!"
}

const myInstance = new MyClass()
console.log(myInstance.myProperty)
// Output:
// myProperty has been accessed!
// Hello World!

Method Decorator A method decorator is applied to a method and can modify the behavior of the method. Here is an example:

function logMethod(target: any, propertyKey: string, descriptor: PropertyDescriptor) {
  console.log(propertyKey + " has been called!")
}

class MyClass {
  @logMethod
  myMethod() {
    console.log("Calling myMethod")
  }
}

const myInstance = new MyClass()
myInstance.myMethod()
// Output:
// myMethod has been called!
// Calling myMethod

Parameter Decorator A parameter decorator is applied to a parameter of a method and can modify the behavior of the parameter. Here is an example:

function logParameter(target: any, propertyKey: string, parameterIndex: number) {
  console.log(propertyKey + " has been called with parameter " + parameterIndex);
}

class MyClass {
  myMethod(@logParameter myParameter: any) {
    console.log("Calling myMethod with " + myParameter);

Summary

Typescript decorators are a design pattern in Typescript that allows developers to add new behavior to an existing code. Decorators were introduced in Typescript version 1.5 and have since become a powerful tool for creating custom, reusable code. Decorators are used to modify the behavior of classes, properties, methods, and parameters and can be applied using the @ symbol followed by the name of the decorator. They are a useful tool for creating more flexible and maintainable code by allowing developers to separate the implementation of logic from the declaration of its behavior. Examples of decorators include @Component for creating a React component and @Injectable for creating a service in Angular. In conclusion, decorators in Typescript are a valuable tool for enhancing the functionality of existing code.

Database index. What do you need to know?

me@ahmed-ibrahim.com — Tue, 11 Oct 2022 00:00:00 GMT

What Is Database index 💾

Indexing makes columns faster to query by creating pointers to where data is stored within a database. Similar to bookmarks, That can make it easy to go to a certain position in the book without going through each page!

Benefits of index

Faster lookup for results. Instead of scanning the entire table for the results, Use index structures such as B-Trees or Hash Indexes to get to your data faster. This is all about reducing the # of Disk IOs.

Indexes are good at speeding up the time it takes to search and find data in SELECT queries, but they can slow down queries to UPDATE, INSERT, or DELETE. If you have tables that you modify more often than you read the data, you may not want to use indexes for quicker searching.

How indexes works

Let’s start with this example, assuming we have a table of Friends. We won’t dive into the exact query that creates that table, as It differs based on the DBMS that you are using.

ID	Name	City
1	Alex	NY
2	Sara	LA
3	Zack	VR
4	Dave	CT

By default primary key, Which in this case (ID) is auto-indexed, meaning that the DBMS(Database Management System) will create it automatically upon creating the table.

Building on that, We can try two simple (lookup) queries that demonstrate how the index would affect query time.

-- Lookup query with Name (Non-index)
SELECT * from Friends where Name = 'Zack'

In the above example, We’re trying to lookup for the non-index column, Which will scan every single row of the table, Till it finds all rows with Name='Zack'

Full table scan usually the slowest method of scanning a table due to the heavy amount of I/O reads

Source: Indexing

Let’s add an index and try again:

Now, we’re going to add an index to column (Name) and see how the query will be different than before.

CREATE INDEX friends_name ON Friends(Name);

Once index creation is finished, We can do the same query again, but now, we should notice a significant change in # of rows that we scan.

We could skip looking for the data in certain rows. If we wanted to search for "Zack" and we know the data is in alphabetical order we could jump down to halfway through the data to see if Zack comes before or after that row. We could then half the remaining rows and make the same comparison.

Source: Indexing

Indexes allow us to create sorted lists without having to create all new sorted tables, which would take up a lot of storage space. This took 3 comparisons to find the right answer instead of 9 in the unindexed data.

What is happening Under the hood?

The index will also pointers that simply reference information for the location of the additional information in memory.

With that index, the query can search for only the rows in the Name column that have Zack and then using the pointer can go into the table to find the specific row where that pointer lives.

Source: How Does Indexing Work

Types of Indexing

Clustered index
Non-clustered index

Both clustered and non-clustered indexes are stored and searched as B-trees, a data structure similar to a binary tree.

Clustered Indexes

A Clustered index is the type of indexing that establishes a physical sorting order of rows. Suppose you have a table Friends Table which contains ID as a primary key, then Clustered index which is self-created on that primary key will sort the Friends Table table as per ID.

Clustered indexes do not have to be explicitly declared.
Created when the table is created.
Use the primary key sorted in ascending order.

Non-clustered indexes

Index is an index structure separate from the data stored in a table that reorders one or more selected columns. The non-clustered index is created to improve the performance of frequently used queries not covered by a clustered index. It’s like a textbook; the index page is created separately at the beginning of that book

And, They are used to increase the speed of queries on the table by creating columns that are more easily searchable. Non-clustered indexes can be created by data analysts/ developers after a table has been created and filled.

When Should Indexes Be Avoided?

Small Table, It’s not effective to have indexes on a small table (Why)
Tables that have frequent, large batch update jobs run can be indexed. However, the batch job's performance is slowed considerably by the index. The conflict of having an index on a table that is frequently loaded or manipulated by a large batch process
Indexes should not be used on columns that contain a high number of NULL values.
Columns that are frequently manipulated should not be indexed.

Thank you!

Relational Database transactions (ACID)

me@ahmed-ibrahim.com — Sun, 27 Sep 2020 00:00:00 GMT

What is the Database transaction?

A transaction is a single logical unit of work which accesses and possibly modifies the contents of a database. Transactions access data using read and write operations.

All types of database access operation which are held between the beginning and end transaction statements are considered as a single logical transaction. During the transaction the database is inconsistent. Only once the database is committed the state is changed from one consistent state to another.

Example of simple transaction:

START TRANSACTION;
INSERT INTO Users (ID, user_name, email) VALUES
('asdf','bbb','bbb@gmail.com');
INSERT INTO Address (street_address, city, zip_code,permanent, user_id) VALUES
('98  Old Chapel Road','GARWAY','HR2 7XH',1,1),
COMMIT

If any part of the above code fails for any reason, unknown column, missing validation value or something. No other query will be performed, transaction ensures that there is no partial completion being recorded in the database.

ACID PROPERTIES are used for maintaining the integrity of database during transaction processing. ACID stands for Atomicity, Consistency, Isolation, and Durability.

#Atomicity It means that either the entire transaction logic got executed successfully at once or does not happen at all. Transactions do not occur partially. Each transaction runs as one unite. Either to complete the full logic, or nothing executed. It involves the following operations:

Abort: The changes made to database are not visible
Commit: The changes made to database are visible.

Atomicity is also known as the ‘All or nothing rule’.

#Consistency Ensures that you guarantee that all data will be consistent. All data will be valid according to all defined rules, including any constraints, cascades, and triggers that have been applied on the database.

Consider the following transaction T consisting of T1 and T2: Transfer of 100 from account X to account Y.

If the transaction fails after completion of T1 but before completion of T2.( say, after write(X) but before write(Y)), 

then amount has been deducted from X but not added to Y.

This results in an inconsistent database state. Therefore, the transaction must be executed in entirety in order to ensure correctness of database state.

#Isolation Guarantees that multiple transactions can be executed concurrently without causing inconsistency of database state. Transactions occurs independently without interference. The changes occurring with any transaction will not be visible to any any other transaction until it has been committed (Saved).

This property ensures that the execution of transactions concurrently will result in a state that is equivalent to a state achieved these were executed serially in some order.

#Durability Durability means that, once a transaction is committed, it will remain in the system – even if there’s a system crash immediately following the transaction. Any changes from the transaction must be stored permanently. If the system tells the user that the transaction has succeeded, the transaction must have, in fact, succeeded.

The ACID properties of a DBMS allow safe sharing of data. Without these ACID properties, everyday occurrences such using computer systems to buy products would be difficult and the potential for inaccuracy would be huge. Imagine more than one person trying to buy the same size and color of a sweater at the same time -- a regular occurrence. The ACID properties make it possible for the merchant to keep these sweater purchasing transactions from overlapping each other -- saving the merchant from erroneous inventory and account balances.

I think now, We've covered a little more details about ACID, In the next article. I'll try to cover more about states of transactions. 🔥

Peace ✌️

The power of Node.js streams.

me@ahmed-ibrahim.com — Sat, 25 Apr 2020 00:00:00 GMT

The power of Node.js streams.

Streams are one of the most powerful features of Node.js

What are Node.js streams?

Streams are collections of data (Sequence of data) just like arrays or strings. The difference is that streams might not be available all at once, and they don’t have to fit in memory. This makes streams really powerful when working with large amounts of data, or data that’s coming from an external source one chunk at a time. The opposite of streams is buffering which means to receive the data and send It once a time.

Very Common example of streams and buffers:

— Watching Live Video ( Stream )

— Download a Video ( Buffer )

Buffering versus streaming

If we write a simple program that takes a simple input from the user i.e ( Hello Node.js ) and sends it a certain consumer for the buffer modal It will wait to receive all the inputs from the user then send the complete buffer to the consumer

The following diagram shows a visual example of this paradigm:

We can notice that, at the time t1, some data is received from the
resource and saved into the buffer. At the time t2, another data chunk is received. The final one that completes the read operation and causes the entire buffer to be sent to the consumer.

On the other side, streams allow you to process the data as soon as it arrives from the resource. This is shown in the following diagram:

The diagram shows you how each new chunk of data is received from the
resource and is immediately provided to the consumer, who now has the chance to process it straight away without waiting for all the data to be collected in the buffer.

But what are the differences between the two approaches? We can summarize them into two major categories:

Spatial efficiency
Time efficiency

Spatial efficiency

streams allow us to do things that would not be possible, by buffering data and processing it all at once. Imagine reading a few of these big files concurrently; our application will easily run out of memory. Besides that, buffers in V8 cannot be bigger than 0x3FFFFFFF bytes (a little bit less than 1GB).

Time efficiency

Let’s now consider an application that compresses a file and uploads it to a remote HTTP server, which in turn decompresses it and saves it on the filesystem. If our client was implemented using a buffered API, the upload would start only when the entire file has been read and compressed. On the other hand, the decompression will start on the server only when all the data has been received. A better solution to achieve the same result
involves the use of streams. On the client machine, streams allow you to compress and send the data chunks as soon as they are read from the filesystem, whereas on the server, it allows you to decompress every chunk as soon as it is received from the remote peer. The following diagram should give us a hint

I hope this gives you a quick intro about Streams / Buffer with node.js

— Note: Some parts quoted from Node.js-Design-Patterns-2nd-Edition-by-Mario-Casciaro-Luciano-Mammino

Thank you,,

Top 15 Visual studio code extensions for Full Stack Developer

me@ahmed-ibrahim.com — Mon, 20 Apr 2020 00:00:00 GMT

Top 15 Visual studio code extensions for Full Stack Developer

Visual studio code is one of the most beloved code editors. It's being used with more than 4.9 million users (monthly active) across the whole world. with this hug popularity, developers and organizations are working on building an awesome visual studio code extensions that makes code much easier.

Top 15 VS Code extensions for Full Stack Developer In this blog, I will try to list the most beloved vs code extensions that I used. Almost every day.

[1] Prettier Formatter

Prettier is an opinionated code formatter. It enforces a consistent style by parsing your code and re-printing it with its own rules that take the maximum line length into account, wrapping code when necessary. It has more than 6 million download

[2] GitLens — Git supercharged

GitLens supercharges the Git capabilities built into Visual Studio Code. It helps you to visualize code authorship at a glance via Git blame annotations and code lens, seamlessly navigate and explore Git repositories, gain valuable insights via powerful comparison commands, and so much more.

With GitLens you can almost track every single line of the code, when it changed, who did that and what is the change is!

[3] Bracket Pair Colorizer

This extension allows matching brackets to be identified with colors. The user can define which characters to match, and which colors to use.

[4] Auto Close Tag

Automatically add HTML/XML close tag, same as Visual Studio IDE or Sublime Text does. I thought it is so dumb to have an extension that closes ever tag you open until I tried it. Also, it has almost 2.7 million download

[5] Docker

The Docker extension makes it easy to build, manage and deploy containerized applications from Visual Studio Code. It allows you to write better YML files fo docker file or docker-compose through it's autocompleting Also it has very nice UI to manage your images and containers inside the visual studio

[6] Git Graph

however, that Gitlens gives me many more insights about the repositories and branches. Git graph gives you little more to view a Git Graph of your repository, and easily perform Git actions from the graph. Configurable to look the way you want!

[7] Path Intellisense

Visual Studio Code plugin that autocompletes filenames.

[8] # Settings Sync

Since you might have multiple machines, for office, home .. setting sync allows you to synchronize Settings, Snippets, Themes, File Icons, Launch, Keybindings, Workspaces, and Extensions Across Multiple Machines Using GitHub Gist.

[9] TODO HIGHLIGHT

Highlight TODO, FIXME and other annotations within your code. Sometimes you forget to review the TODOs you've added while coding before you publish the code to production. So I've been wanting an extension for a long time that highlights them and reminds me that there are notes or things not done yet. Hope this extension helps you as well.

[10] Better Comments

The Better Comments extension will help you create more human-friendly comments in your code.
With this extension, you will be able to categorize your annotations into:

Alerts
Queries
TODOs
Highlights
Commented out code can also be styled to make it clear the code shouldn't be there
Any other comment styles you'd like can be specified in the settings

[11] Auto Rename Tag

Automatically rename paired HTML/XML tag, same as Visual Studio IDE does.

[12] Code Spell Checker

A basic spell checker that works well with camelCase code. The goal of this spell checker is to help catch common spelling errors while keeping the number of false positives low.

[13] Document This

"Document This" is a Visual Studio Code extension that automatically generates detailed JSDoc comments for both TypeScript and JavaScript files.

[14] Indenticator

Visually highlights the current indent depth. This extension can be used by itself, but it's recommended to use it alongside the builtin indent guides.

[15] Project Manager

It helps you to easily access your projects, no matter where they are located. don't miss that important projects anymore. You can define your own Projects (also called Favorites), or choose for auto-detect Git, Mercurial or SVN repositories, VSCode folders, or any other folder. Here are some of the features that Project Manager provides:

Save any folder as a Project
Save any workspace as a Project
Auto-detect Git, Mercurial or SVN repositories
Open projects in the same or new window
Identify deleted/renamed projects
A Status Bar which identifies the current project
A dedicated Side Bar

That's is for today! You can follow me on Twitter and let me know your thoughts! : Ahmed_ibrahim Thank you.

Download the complete source code of any website

me@ahmed-ibrahim.com — Tue, 24 Sep 2019 00:00:00 GMT

Website Downloader 💾

Download the complete source code of any website (including all assets) 🔨.

👉 Live Demo: https://site-dwloader.herokuapp.com/

Description 📒

Website downloader works with wget and archiver to download all websites assets and compress then sends it back to the user through socket channel

Wget params the being used

wget --mirror --convert-links --adjust-extension --page-requisites --no-parent http://example.org

Explanation of the various flags:

--mirror – Makes (among other things) the download recursive.
--convert-links – convert all the links (also to stuff like CSS stylesheets) to relative, so it will be suitable for offline viewing.
--adjust-extension – Adds suitable extensions to filenames (html or css) depending on their content-type.
--page-requisites – Download things like CSS style-sheets and images required to properly display the page offline.
--no-parent – When recursing do not ascend to the parent directory. It useful for restricting the download to only a portion of the site

How to run it 🤔

git clone this repo
$ npm install
$ npm start

Dynamic Open Graph Image API 👻

me@ahmed-ibrahim.com — Tue, 24 Sep 2019 00:00:00 GMT

Imageiry.com 😺

Overview

Imageiry Create a dynamic image representing your content for sharable content. To make it look stunning 👈.

See the images in real facebook post :

*Also,You can use imageiry to : *

Turn your HTML Design into image.
When you use Open Graph tags to attach rich photos, you need an image, and ideally, an image based on your content
Enahnce the outfit for sharble content ( With createing unquie meta image for each artical or blog )

What is an Open Graph Image?

Have you ever posted a hyperlink to Twitter, Facebook, or Slack and seen an image popup? How did your social network know how to "unfurl" the URL and get an image? The answer is in your <head>.

The Open Graph protocol says you can put a <meta> tag in the <head> of a webpage to define this image.

It looks like the following:

<head>
  <title>Title</title>
  <meta property="og:image" content="http://example.com/logo.jpg" />
</head>

Why use this service?

Read the blog post for more info on the "Why" part.

The short answer is that it would take a long time to painstakingly design an image for every single blog post. And we don't want the exact same image for every blog post because that wouldn't make the article stand out when it was shared to Twitter.

That's where imageiry.com comes in. We can simply pass the title of our blog post to our generator service and it will generate the image for us on the fly!

It looks like the following:

<head>
  <title>Hello World</title>
  <meta property="og:image" content="https://www.imageiry.com/api/default?title=Write%20your%20text&url=www.Imageiry.com" />
</head>

Now try changing the title text Write%20your%20text to the title of your choosing and watch the magic happen ✨

Usage

Imageiry has an direct api to convert any HTML based design into image

http://www.imageiry.com/convert [POST] ⚡

Field	Description
html	Any html content
Note: Imageiry will convert the body of the page only.

Ready made templates.

Default Template

Using dynamic images for your content enrich your website and ideally enhance your user experience especially for sharable content.

http://www.imageiry.com/api/default [GET] ⚡

Paramter	Description
title	_required
url	required
color	optional

Response

Movies

Using dynamic images for your content enrich your website and ideally enhance your user experience especially for sharable content.

*Example *:

API http://www.imageiry.com/api/movie [GET] ⚡

Paramter	state
title	required
description	required
moreInfo	required
rate	required
tag	required
likes	optional
backgroundImage	optional
posterImage	optional

Sample:

http://www.imageiry.com/api/movie?title=How%20to%20be%20awesome&description=be%20like%20man&moreInfo=This%20is%20more%20info%20about%20the%20link&rate=3&tag=PG-13 🚦

Article

Generate imge for each artical you write. Fully customized title,author,color,image

How it looks like on social media.

Usage

API http://www.imageiry.com/api/article [GET] ⚡

Paramter	state
title	required
author	required
image	optional

Sample

http://www.imageiry.com/api/article?title=Build%20software%20better,%20together.&author=Ahmed%20Ibrahim 🚦

To Create you own (FREE) template please feel free to contact us : help@Imageiry.com

To be continued.💫

Please share your thoughts if there is anything is missing.