Heartbeat animation rendering on HTML5 Canvas in Elm using "evancz/elm-graphics" package. Compatible with Elm v 0.18. This is ported from an old example on http://outreach.mcmaster.ca/tutorials/animation/animation.html which uses old packages like "Signal" and "Graphics.Collage" which no longer exists in new Elm versions now.

elm-package.json

{
    "version": "1.0.0",
    "summary": "helpful summary of your project, less than 80 characters",
    "repository": "https://github.com/user/project.git",
    "license": "BSD3",
    "source-directories": [
        "src"
    ],
    "exposed-modules": [],
    "dependencies": {
        "elm-lang/animation-frame": "1.0.1 <= v < 2.0.0",
        "elm-lang/core": "5.0.0 <= v < 6.0.0",
        "elm-lang/html": "2.0.0 <= v < 3.0.0",
        "evancz/elm-graphics": "1.0.1 <= v < 2.0.0"
    },
    "elm-version": "0.18.0 <= v < 0.19.0"
}

Main.elm

module Main exposing (..)

import Html exposing (..)
import Color exposing (..)
import Collage exposing (..)
import Element exposing (..)
import Time exposing (Time)
import AnimationFrame


-- MODEL


type alias Model =
    { delta : Time }


init : ( Model, Cmd Msg )
init =
    ( Model 0, Cmd.none )



-- UPDATE


type Msg
    = NoOp
    | Tick Time


update : Msg -> Model -> ( Model, Cmd Msg )
update msg model =
    case msg of
        NoOp ->
            ( model, Cmd.none )

        Tick t ->
            ( { model | delta = t }, Cmd.none )



-- VIEW


view : Model -> Html Msg
view model =
    toHtml (heartBeat model.delta)


subscriptions : Model -> Sub Msg
subscriptions model =
    -- NOTE: The "Time.every millisecond Tick" is not as much smooth as "AnimationFrame.times Tick" is.
    AnimationFrame.times Tick


heartBeat : Float -> Element
heartBeat delta =
    collage 300 300 [ heart |> scale (abs (sin (delta / 1000))) ]


heart : Form
heart =
    group
        [ ngon 4 50 |> filled red |> move ( 0, 0 )
        , circle 36 |> filled red |> move ( 20, 20 )
        , circle 36 |> filled red |> move ( -20, 20 )
        ]



-- MAIN


main : Program Never Model Msg
main =
    Html.program
        { init = init
        , view = view
        , update = update
        , subscriptions = subscriptions
        }

Demo - https://ellie-app.com/jDXmRqwKga1/1