Amelia is an open-source creative-coding toolkit for modern JavaScript

Overview

amelia

Amelia is an open-source creative-coding toolkit for modern JavaScript.

Amelia is a collection of APIs meant to make it easy to create sketches with simple and fast code. It puts an emphasis on the following aspects:

  • lightweight: at the moment ~50KB in size.
  • functional: it has a simple to use and understand functional style API.
  • fast: tries to be as fast as possible by being a thin wrapper around the Canvas API (with WebGL planned for the future).

Currently it support the following primitives:

  • Rectangle (rect)
  • Circle (circle)
  • Triangle (tri)
  • Quad (quad)
  • Line (line)
  • Arc (arc)
  • Text (text)
  • Point (point)
  • Polygon (poly)

The library also supports mouse and keyboard handlers (WIP).

Amelia's API's are inspired by nannou and p5js.

Get started

I have prepared a getting started guide.

Requirements and Download

amelia requires a browser that supports ES6 modules.

To use it, download the module folder and drop it into your project. Then you can import the stuff you need from the mod.mjs module like this for example:

import { app, Color } from "path/to/module/mod.mjs";

Example

Here is a quick example on how to use amelia.

{ let pen = app.pen(); pen .background() .color(Color.Black); pen .rect() .xy(50, 50) .wh(100, 50) .color(Color.Yellow); pen.plot(); }; app() .size(400, 400) .view(view) .run();">
import { app, Color } from "./module/mod.mjs";

const view = (app) => {
    let pen = app.pen();

    pen
        .background()
        .color(Color.Black);

    pen
        .rect()
        .xy(50, 50)
        .wh(100, 50)
        .color(Color.Yellow);

    pen.plot();
};

app()
    .size(400, 400)
    .view(view)
    .run();

Goals and Non-Goals

Goals:

  • be simple and lightweight
  • thin wrapper around the canvas API
  • be fast

Non-Goals:

  • replace p5.js or Processing
  • 3D graphics
  • being the fastest

Disclaimer

It just started working on this library and there is still a lot of work to be done. Feel free to help out!

Benchmarks

TBD

License

amelia is licensed under the MIT license.

Building the reference to json

buildref.bat
or
npx jsdoc -c jsdoc.config.json -X -r > ref.json
You might also like...

🤑💰 Crowdfunding Platform backed by Ethereum Blockchain to bring your creative projects to life

🤑💰 Crowdfunding Platform backed by Ethereum Blockchain to bring your creative projects to life

Crypto Crowdfund For Creators Lacking the money to bring your Creative Venture to Life? Crypto Crowdfund Campaigns will help you turn your creative id

Oct 3, 2022

A public board for all the Computer Society and Students to display their profile. An online year-book for you to display your profile in the most creative manner

A public board for all the Computer Society and Students to display their profile. An online year-book for you to display your profile in the most creative manner

Student's Yearbook by IEEE Computer Society Student's yearbook is an open-source project which intends to dispaly the students who will be graduating

Dec 18, 2022

An Open-Source Platform to certify open-source projects.

An Open-Source Platform to certify open-source projects.

OC-Frontend This includes the frontend for Open-Certs. 📜 After seeing so many open-source projects being monetized 💵 without giving any recognition

Oct 23, 2022

This project is for hacktoberfest to encourage new developer and open source developers to contribute to open source and improve skills which require debugging, write testable code, industry standards, problem solving and many more,

This project is for hacktoberfest to encourage new developer and open source developers to contribute to open source and improve skills which require debugging, write testable code, industry standards, problem solving and many more,

🚀 Blog project for hacktoberfest In this repository, you can find issues related to a blog project that is built on top of Next.js. The project is a

Oct 9, 2022

This is a project for open source enthusiast who want to contribute to open source in this hacktoberfest 2022. 💻 🎯🚀

This is a project for open source enthusiast who want to contribute to open source in this hacktoberfest 2022.  💻 🎯🚀

HACKTOBERFEST-2022-GDSC-IET-LUCKNOW Beginner-Hacktoberfest Need Your first pr for hacktoberfest 2k22 ? come on in About Participate in Hacktoberfest b

Oct 29, 2022

📆 The modern, open source "Airbnb style" date picker.

Date Picker A pretty, modern date picker. Coming soon. 💡 Get Started wip wip 🧪 Testing pnpm test 📈 Changelog Please see our releases page for more

Oct 11, 2022

Statistics toolkit for JavaScript

statkit A statistics toolkit for javascript. Usage Install using npm: npm install statkit Fit a linear regression model using MCMC: var sk = require(

Dec 19, 2022

A recreation of a startpage posted on Reddit without the source, so I rewrote it in Next.js + Tailwind for the open source community.

Startpage "Figma Balls" Rewrite Why Did I Make This I saw a startpage posted on the subreddit r/startpages that I thought looked nice, but when I look

Mar 29, 2022

Let's participate in Hacktoberfest and contribute to open-source. Star the repo and open a PR to get accepted.

Let's participate in Hacktoberfest and contribute to open-source. Star the repo and open a PR to get accepted.

Let's Contribute To Open-source First Contributions This project aims to simplify and guide the way, beginners can make their first contribution towar

Dec 3, 2022
In game dev, generative art, and creative coding, sine is a ubiquitous function that is often used as a spring-like oscillator for a given parameter.

In game dev, generative art, and creative coding, sine is a ubiquitous function that is often used as a spring-like oscillator for a given parameter.

Mark Racette 3 Feb 22, 2022
A (very) minimalist creative coding playground. Make animations using only 64 HTML sliders!

Sliderland A (very) minimalist creative coding playground. Make animations using only 64 HTML sliders! Credits The recording feature uses ffmpeg.wasm

null 181 Dec 30, 2022
A set of utilities and additional features for my creative coding class aiming to help students while introducing the algorithmic thinking.

p5.utils A set of utilities and additional features for my creative coding class aiming to help students while introducing the algorithmic thinking. T

alp tuğan 15 Dec 25, 2022
Grupprojekt för kurserna 'Javascript med Ramverk' och 'Agil Utveckling'

JavaScript-med-Ramverk-Laboration-3 Grupprojektet för kurserna Javascript med Ramverk och Agil Utveckling. Utvecklingsguide För information om hur utv

Svante Jonsson IT-Högskolan 3 May 18, 2022
Hemsida för personer i Sverige som kan och vill erbjuda boende till människor på flykt

Getting Started with Create React App This project was bootstrapped with Create React App. Available Scripts In the project directory, you can run: np

null 4 May 3, 2022
Kurs-repo för kursen Webbserver och Databaser

Webbserver och databaser This repository is meant for CME students to access exercises and codealongs that happen throughout the course. I hope you wi

null 14 Jan 3, 2023
Reference for How to Write an Open Source JavaScript Library - https://egghead.io/series/how-to-write-an-open-source-javascript-library

Reference for How to Write an Open Source JavaScript Library The purpose of this document is to serve as a reference for: How to Write an Open Source

Sarbbottam Bandyopadhyay 175 Dec 24, 2022
This project provides a React-powered web experience using the PokeAPI. It also is a creative space to hone frontend skills.

pokedex-nova This project provides a React-powered web experience using the PokeAPI. It also is a creative space to hone frontend skills. Available Sc

Anthony Williams 2 Feb 1, 2022
A pointer lock movement manager for customizing your own creative UI.

Pointer Lock Movement A pointer lock movement manager for customizing your own creative UI. Inspired by Figma's number input element: Dragging on an i

Zheeeng 8 Nov 4, 2022