Agent clock

A visualization of a clock using simple agents and physics.

Description

The digits of the clock are basically letters or svg paths. These paths are broken down into pieces. The pieces are postions which will get occupied with "agents". These agents spawn at and have the goal to reach a random spot on these paths thus slowly reavealing the time. The spawn location is a position outside the screen where the second hand would be - it wanders clockwise around the scene. If the minute is over the dots are cleared and the process restarts.

Begining of the minute

Only a few dots are there

30 seconds of the minute

More and more dots floating in )

All dots there

How to build

Flutter should have been installed

git clone https://github.com/kruegerrobotics/flutter_agent_clock.git
cd flutter_agent_clock
cd agent_clock
flutter create .
flutter run

Inspirations

The coding train

This project was inspired by The Coding Train Challenge #59: Steering behaviors Thanks to Daniel Shiffman!

Flutter canvas tutorial

This is a canvas tutorial and has a way to become independed of the screen size with the "size tool". This has been reused here.

3rd Party library use

This project uses the public availabe flutter library Text to Path Maker. For breaking the TTF into segments,

Ideas for further improvement

Multiple fonts and "text to point"

Refine the text to path maker or develop an algorithm that breaks the TTF font path and can put dots on the path in equal distance. This would allow the use of any font. At this point in time the point allocation is on certain fonts not equidistant and not visually appealing. The overall coding of the postioning should be less static

The algorithm could be improved inspired by textToPoints from the p5js project.

Other ideas

• Improve the streaming in of the agents depending on weather