I wanted to do something with the accelerometer and vibration functions of the pebble watch, since those are tangible interactions which are not the buttons on the watch. I thought about creatures, since I like to make creatures, so I decided to make something that gets angry when it is shaken. Then I realized the accelerometer demo already has a lot of what I needed implemented, so I worked off of that. The end result was satisfying, although I do wish I could have done a narrative of an user using the app as my documentation, but due to time constraints I was unable to do that.

Sketch:

For my clock, I wanted to take chess and use it to convey time.  Usually it goes the other way, with time being a defining characteristic of competitive chess, but here I figured I could map the progression through a game to the progression through the day.  Initially, I wanted to have a game play out every minute, with different openings every hour and shorter games at the beginning (slower moves during the minute) and longer games at the end of the hour (faster moves).  However, in order to scope the project back I ended up aiming to run a single 24 turn game (48 moves total) during the day.

I was not able to finish the project in a full, working form.  I wrote a script to take a chess game (Magnus Carlsen vs. Sergey Leonidovich Kalinitschew) and output it as 48 lines of 64 characters, with each character representing a single square on the board.  I also have working functions that render the board as well as the pieces.  Where this falls down in trying to move from one board state to the next — the application hangs after about the third move.  I’m not sure if this is because of the watch not having the computing resources to handle the application or the code being buggy (I used the javascript version, which I regret — the documentation is poor and I found at least one thing I’d definitively consider a bug).  I’m more or less satisfied with the work I’ve done but frustrated that it fell down crossing the finish line.

ChessClock code viewable on GitHub here

Helper code viewable on GitHub here

When I started brainstorming about what type of clock I was going to do, I did some research of what was out there. Many of the examples I found were using organic style shapes like circles. After going through many different design ideas as can be seen in the image below, I decided to do something with squares. I have never really liked the square as a shape; it was so many rough edges. But I decided that for this project I would explore it.

My goal was to represent time as a static cubic painting. The frame will consist of the seconds filling in the frame every second. The hours are the main blocks of the painting and the minutes are a portion of a block. For example if its 3:30pm, 3 blocks will be present and one will be half filled. When I finished my initial prototype, I found it was not as cool I though originally. It was not interactive. It looked too static:

To fix this issue, I decided to allow the user to move the blocks around with the accelerometer. To do this, I decided to create a type of puzzle experience. I developed a very simple collision detection between the blocks and between the internal wall. To make it more interesting, every hour, only a percentage of the blocks are active. The rest are acting as barriers and collision boxes. This made it more fun to move the clock around and try to make different shapes every hour.

For this assignment I wanted to create an unexpected, nontraditional representation of time. I decided to represent time as the percent of the day complete. People typically think of “the day” as the time spent awake. A day however is actually made up of 24 hours. Of which people spend an average of 8 hours sleeping through. As someone with a non-typical sleeping schedule it made the transition from one day to another (at midnight) more apparent.

This photo was taken at approximately 6:00 PM.

This notation of time also calls out how arbitrary the act of time keeping actually is. Why are days broken up into 24 hours and minutes to 60 seconds? Why does a new day start in the middle of the night when most people are asleep? Does percentage relate better to the way we experience and perceive time? I tried using the watch for a few days and found it pretty stressful. On the first night I stayed up into 9% of the next day and woke up with 42% of the day complete. I spent about 6% of my day getting ready + commuting to campus. While this way of representing time was stressful it might also be useful in determining how much of your day you spend doing certain tasks. It might not be particularly practical, but it could be perfect for hyper efficient people who like to optimize their day.

Here it is in action (on the pebble emulator) changing from 75% to 76%

Experimental pebble watch face from Rachel Ciavarella on Vimeo.

In a future iteration I might want to see how the watch would feel if it were accurate to two decimal points. (75.45%). Would this ruin the ambiguous time effect or add a more exciting level of stress to the experience?

Here’s the watch at a few points through out the day.

Here’s my code:

#include 

static Window *s_main_window;
static TextLayer *s_time_layer;
static void update_time() {
// Get a tm structure
time_t temp = time(NULL);
struct tm *tick_time = localtime(&temp);
// Create a long-lived buffer
static char buffer[] = "00.00";
static char hours[] = "00";
static char minutes[] = "00";
static char percent[] = "00.00";

// static char percent[] = "00";

// Write the current hours and minutes into the buffer
//Use 2h hour format
strftime(buffer, sizeof("00.00"), "%H.%M", tick_time);
strftime(hours, sizeof("00"), "%H", tick_time);
strftime(minutes, sizeof("00"), "%M", tick_time);

int H = atoi(hours);
int M = atoi(minutes);

int percent_time = ( ( M + (H*60.0) ) / 1440) * 100;

snprintf(percent, 3, "%i", percent_time);
// Display this time on the TextLayer
text_layer_set_text(s_time_layer, strcat(percent,"%"));
}

static void main_window_load(Window *window) {
// Create time TextLayer
s_time_layer = text_layer_create(GRect(0, 55, 144, 50));
text_layer_set_background_color(s_time_layer, GColorClear);
text_layer_set_text_color(s_time_layer, GColorBlack);
text_layer_set_text(s_time_layer, "00.00");
// text_layer_set_text(s_time_layer, "00");

// Improve the layout to be more like a watchface (font + centering)
text_layer_set_font(s_time_layer, fonts_get_system_font(FONT_KEY_BITHAM_42_BOLD));
text_layer_set_text_alignment(s_time_layer, GTextAlignmentCenter);

// Add it as a child layer to the Window's root layer
layer_add_child(window_get_root_layer(window), text_layer_get_layer(s_time_layer));

// Make sure the time is displayed from the start
update_time();
}

static void main_window_unload(Window *window) {
// Destroy TextLayer
text_layer_destroy(s_time_layer);
}

static void tick_handler(struct tm *tick_time, TimeUnits units_changed) {
update_time();
}

static void init() {
// Create main Window element and assign to pointer
s_main_window = window_create();

// Set handlers to manage the elements inside the Window
window_set_window_handlers(s_main_window, (WindowHandlers) {
.load = main_window_load,
.unload = main_window_unload
});

// Show the Window on the watch, with animated=true
window_stack_push(s_main_window, true);

// Register with TickTimerService
tick_timer_service_subscribe(MINUTE_UNIT, tick_handler);
}

static void deinit() {
// Destroy Window
window_destroy(s_main_window);
}

int main(void) {
init();
app_event_loop();
deinit();
}

Pokemon Watch

Memory Palaces are a great way to remember a list of things. Take the rooms in your house, associate each one with an item, and then “walk through” your house to remember all the items. But I only have ~5 rooms, and that’s being generous – what if I want to remember, say, 60 things? It’d be great to have a go-to list of 60 things that I could just pull up whenever and use them as loci for whatever list.

Enter Pokemon. These little critters (there are over 750 now) are unique, distinctive, named, and numbered. Learning the first 60 would give me a pretty universal memory-palace list. Furthermore, they’re chunked into groups of 2-3 (Bulbasaur evolves into Ivysaur evolves into Venusaur), and I still remember some characteristics of them from the Pokemon video game when I was a kid, making for even easier learning. And they’re cute.

I forgot to sketch anything, unfortunately. The design is simple, just a pokemon image for the current minute (0-59) plus the pokemon’s name. No hour hand, because people generally know what hour it is and space is limited. The technology took a little fussing though, because I wanted relatively high-res images (144×144) but space is limited (96kb). More info on my pebble image hacks here.

Screenshots:

 2:17pm, or 2:Pidgeotto, if you will.

 2:19 is now 2:Rattata.

Did I do what I wanted? Pretty much, yeah. Technically, the watch is exactly what I was hoping for. I didn’t quite learn all the Pokemon yet, but I’m getting there. Plus, I got some good experience hacking around with new hardware, poorly documented bugs, C memory issues, and screwing around with B/W images.

Code’s here. Images are from http://www.marriland.com, for example http://www.marriland.com/forums/updates-and-announcements/featured-weekly-poll/444268-poll-6-which-is-your-favorite-kanto-starter. Code includes uPNG port from Matthew Hungerford: https://github.com/mhungerford/png_demo, which is itself derived from LodePNG version 20100808, by Lode Vandevenne and Sean Middleditch.