The Flow Test

I built a thing that administers Mihaly Csikszentmihalyi’s ESM test for flow, or the state of being “in the zone” in order to try out Vue and darklang. This is a 4-part-post. Here, I’ll introduce the app and technologies, and I’ll follow up with my review of each technology I used: Vue, dark, and Slackbot.

Start: Feb 17, 2020 1:16 PM EST
End: Feb 22, 2020 6:50 AM EST
(pretty proud of myself for doing this in under a week)

Here’s the repository for this project.

What does the app do?

The test is 56 surveys (Experience Sampling Forms) in a week. You’re pinged, randomly, 6 to 9 times a day during waking hours (8am and 10pm). The survey will ask you some questions about what you’re doing and how you feel about what you’re doing.

ESF Screenshot

At the end of the test, you have an inventory of things that put you in flow - that you’re intrinsically motivated to do, that make you happy.

results screenshot happy and sad list of activities

What’s the tech stack?

To make the single-page web app that displays the survey and results.
Hosts the backend for this app, which includes data storage, a cron job, and APIs for both the web app and the slackbot.
The slackbot manages authentication and notifies the user when it's time to fill out an ESF.

IDK if this sequence diagram helps or hurts your understanding of how each of these technologies interact, but I’ll include it just in case.

    participant D as Dark
    participant S as Slack
    participant V as Vue.js Web App
    S->>D: This person signed up to be surveyed!
    activate D
    D-->>S: Cool, thanks!
    D->>D: Store authentication tokens for later
    D->>D: Generate random dates and times to survey people
    loop Every minute
    D->>D: Check if there are any surveys to send
    opt If a survey needs to go out
    D->>S: Send slack message with link to survey
    deactivate D
    S->>V: User clicks link to start survey
    activate V
    V->>D: User submits survey
    deactivate V
    D->>D: Store answers
    V->>D: User clicks link to view survey results
    D-->>V: Here's the data you need!

My Vue Review
My Dark Review

Written on February 22, 2020