A Cozy Virtual Place to Get Work Done Together | ๐Ÿ’ค๐ŸŽ‰ Slumber Party Devlog #1

Welcome! For a few months now (since April of this year) I've been working on a super secret Web Monetized, fun social accountability tool called Slumber Party (#SlumberPartyio). It's designed for anyone who wants a cozy little place to hang out and get work done with others. While the project is still nowhere near the great Version 1.0, I think I'm ready to start sharing more progress updates, especially with the Web Monetization community (the pro version will be accessible via #WebMonetization)! (At the bottom of this post, you'll find the video devlog.)


I decided to create a tool with all the features I needed: tasks, chat, Pomodoro-style timers, and a gamified way to work synchronously with friends and keep each other accountable. A great added bonus would be a way to track all the time I spent with each task and subject over time.


Watch the full #Devlog #Video below or on Cinnamon.

I'm very excited to share more with you over the coming months, and I can't wait to hear any feedback you might have here, on Cinnamon (where I'll be making more video devlogs), or Twitter. I'll be sharing feature developments, 3D modeling, usability updates, and I'm sure a lot more. To get these updates in your inbox, enter your email address below or follow Innkeeper Games another way.

A Cozy Virtual Place to Get Work Done Together

I'm a college student. When my classes moved to a digital environment in early 2020, I found myself struggling to complete my work. I didn't feel accountable, and without study sessions and classrooms, I'd lost the community of peers all working together at the same time.

I did not realize I was so reliant on the classroom environment, seeing others around me work, and knowing others could โ€œwatchโ€ me get my work done.

To try to combat this effect, I started organizing online Zoom meetings with groups of friends called โ€œstudy hallsโ€ during which we would set a Pomodoro-style timer for 25 minutes and work on our schoolwork. After each session, we'd talk for five minutes about whatever we wanted to, including perhaps what we worked on, and then we'd start another timer.

These sessions worked well in general: each could see what each other was working on and give status updates on their work. Knowing that other people around me were working, I felt motivated to get more done; similarly, knowing that others knew I was supposed to be working and could check up on me kept me focused.

Still, in the era of non-stop video calls, I was quick to seek more comfortable alternatives, perhaps alternatives that didn't require me to show my face or talk through an ever-present filter of lag.

Finding none designed for my purposes, I decided to create a tool with all the features I needed: tasks, chat, Pomodoro-style timers, and a gamified way to work synchronously with friends and keep each other accountable. A great added bonus would be a way to track all the time I spent with each task and category of task over time. I started drawing sketches for the earliest version of Slumber Party.

An early sketch of the Slumber Party interface and room.

Clearly, the design has come a long way since then. I count at least two changes significant enough for me to call them โ€œoverhaulsโ€, and there's a good chance you'll see an older version of the software in the next #Devlog post like this one.

Still, the overall shape and feel of the software has stayed the same, with an enduring focus on comfort and fun. And I've kept much of the original features the same. So let's talk about those.

Features

I need to be careful here: Slumber Party is still in the early stages of development, so these aren't promises; they're just current plans for development. First, I'll describe my current plan for the feature, and then I'll describe its current status. (Additionally, features are organized from immediate goals to stretch goals.)

The Room

The room is the rightmost space representing the virtual environment, currently backdropped by a placeholder grass texture. It's made in Kontra.js, the game development micro-library made for js13kGames by Steven Lambert, whom I'm proud to support as a patron on Patreon.

  1. All online users appear as teddy bear avatars in line with the cozy slumber party aesthetic. Complete. (The next #Devlog will likely focus on the creation of the bear in #Blender!)
  2. Users can click on parts of the room to move their avatar to the location they clicked. Complete.
  3. When a user is working on a task, other users can click their avatar to find out what they're working on and how long they've worked on it. In progress.
  4. When a user sends a chat message, their corresponding teddy bear avatar displays a chat bubble. In progress.
  5. The room editors can modify the environment using furniture items from an inventory, as in a Club Penguin igloo. In progress but a ways off. The server is capable of storing this customization, but there's currently no way to edit from the software itself.
  6. Teddy bears can wear cosmetic items. Not started.

Tasks

The Tasks tab is the place to manage your tasks in Slumber Party.

The Tasks tab of Slumber Party.

  1. Users can create, edit, and delete named lists to store tasks. Complete.
  2. Users can create, edit, and delete named tasks (with optional descriptions). Complete.
  3. Users can reorder lists and tasks by clicking and dragging. Complete.
  4. Users can mark tasks as โ€œactiveโ€, indicating that their next timer session will be spent working on that task. Complete.
  5. Tasks display total time spent working on them. In progress.
  6. Users can assign other users to tasks so that the task will appear in their tasks as well. In progress. This is finished server-side, but there's no way for users to use this yet.
  7. Users can add tags to their tasks and filter tasks accordingly. In progress, but likely a ways off. Again, this is finished server-side, but there's no way for users to use this yet.

Timer

The Timer tab is where users can go to start or join a Pomodoro-style timer session and work on their active task with friends in exchange for a currency.

The Timer tab of Slumber Party.

  1. The timer reflects the user's active task. Complete.
  2. Users can start a timer for 25 minutes. Complete.
  3. Users can adjust the time on the timer. Complete.
  4. Users can see a list of all participants in the session. Complete.
  5. Users can join sessions. In progress.
  6. Users can leave sessions. In progress.
  7. The time spent on the active task appears and updates on the actives task. Not started.
  8. Users can change the visual of the timer (currently a candle) in exchange for different in-room results. Not started.

Stats

The Stats tab might be my personal favorite part of the Slumber Party product as someone who loves to collect and view personal data. It's where users will go to observe trends about themselves over time, like time spent working each day/week/month/year, time spent per tag and per task, and more fun stuff. Because this is also computationally expensive, this tab is only accessible to pro users with an active Web Monetization provider. While I've laid the groundwork in the server for this tab, it's currently unavailable to the user.

Chat

The Chat tab might be the most self-explanatory. It simply offers users a place to send and re-read chat messages. Later, it may also serve as an events bulletin for things like timer sessions.

The Chat tab of Slumber Party.

  1. Users can send messages with a sent date and their display name. Complete.
  2. Users can read past that load in chunks of 10 messages at a time. Complete.
  3. Users can edit messages. Not started.
  4. Events like new timer sessions are posted to the chat. Not started.

Store

The Store tab is where users can spend currency they've earned in exchange for furniture and cosmetic items. This tab has not been started and will probably be a later addition.

Settings

The Settings tab is where users can change settings. It is currently something of a catch-all, and while it is finished in its current state, I should spend some time cleaning it up and separating room settings from profile settings.

The Settings tab of Slumber Party.

  1. Users can change their display names (which at present defaults to the part of their email address before the '@'). Complete.
  2. Users can create rooms. Complete.
  3. Users can join rooms. Complete.
  4. Users can have their avatars enter other rooms they're members of. Complete.
  5. Users can leave rooms. Complete.
  6. Users can invite other members to their rooms via email and via a very fancy emoji URL (like http://๐Ÿ’ค๐ŸŽ‰.ws/). Complete but currently buggy. Includes a customized sign-up user flow.

Again, these features aren't final!

What Do You Want to See?

In this update, I haven't really shared much technical information, but if you'd be interested in seeing more about Slumber Party's tech stack, or some other information or part of the development process, please let me know! I've never done a devlog series before, and I'm excited to share the kind of information that you want to see.

Thank You!

I've been lurking in the Web Monetization community, especially on Cinnamon, Coil, and Twitter, for a while, and I've seen that this is a warm, tight-knit community that is making an ecosystem where both creators and consumers are better respected. I really appreciate that, and I'm excited to be a part of it, so thank you for having me, and thank you for stopping by. I'll see you again soon.