How to Make a Watch Face With WatchMaker

This how to will show you the BASICS of how to create a watch face using this app.

Prerequisites

Basic coding knowledge

Basic placement knowledge

Basic Knowledge of Photoshop (mainly how layers work) Android Phone (or tablet but android none the less)

Android Wear Watch

Tools Required:

Photo editor:

Photoshop, Illustrator or Gimp

WatchMaker Premium Watch Face

(It may be a three dollars (US), but it opens up a world of possibilities and it supports a Android Developer.)

Tools used to make this how to:

LG G3 and Nexus 7 2013

Moto 360

Photoshop

***WARNING: FOR THE SAKE OF MY SANITY***
I am going to skip installing the apps and paring the watch with your phone. If you don't know how to pair your phone with your watch, hit the link at the bottom of this step.

Instead use this link to help you pair your watch with your phone.

Most watches on the watchmaker website are inspired by actual watches. Other watches on the maker site are made from scratch. For me, personally my inspiration came from one of my favorite games, Titanfall.

I specifically wanted to make the Rank Chip you see in the lower left hand corner as you play the game.

The picture above is a different watch face I am working on.

If you have chosen an image to work with or creating one on your own either way you are going to need some form of guide to help with the design.

There are a few guides out there that come in various formats, since I am working in Photoshop I needed a psd.

Here is the one I used to design my watch face: http://www.mediafire.com/download/c8c2on2jao2084m...

(Depending on your, watch you will need to choose either round or square.)

At this point you may also want to get fonts also.

There are pre-installed fonts when you download the app, but (and I could be wrong) I think the app pulls from the built in Android libraries.

I ran into a few issues using Photoshop to create the images.

Using a more vector art based program is a better idea if you are going for graphics over function.

Once you get the watch face the way you like, now you have to move them to the phone. I suggest for cleanliness sake placing all the documents and images into a file.

Now plug your phone into your computer, then get angry at your computer because if you are using Windows then the computer won't recognize your device.

If you are using Mac you need this program to help mount your phones internal and external storage.

After spending another half an hour to an hour searching for the right drivers for your phone, move the files from your computer to your phone.

1. Open the app and tap the three lines in the top left corner of the phone.
2. Navigate to my watch faces.
3. Once in the my watches screen, tap the plus watch symbol and start designing your watch face.
4. Taping the plus symbol will create a blank watch

**NOTE***

One thing to note about the layers in WatchMakers is that, unlike Photoshop the layers are backwards. For example a layer at the far left phone is actually the layer at the bottom most layer of the watch.

To start adding in different things like the time, date, or watch battery a new layer needs to be made. More specifically a new text layer needs to be made.

To add a new layer tap the plus symbol. Once you have pressed the plus symbol you will be presented with options like text, image, basic time choices (analog and digital) and script.

WatchMaker uses Lua script to handle any variables (time, date, battery percentage) coming from the watch or the phone. Lua script also uses some Java libraries to do math.

To find out more about Lua script and WatchMaker hit the following link:

http://watchmaker.haz.wiki/lua

Using Lua means that adding in more than the time and battery percentage you can also pull GPS data or weather data, along with doing basic if else arguments.

We are going to choose a image file.

Once you have located the image you want as the watch face it will be added to the workbench watch face area on the phone.

Remember, the furthest left layer is the bottom most layer when sent to the watch.

***A few things to remember***

When placing the battery percentage of the watch, on the phone it will display the watch battery as being at the same level as your phone. This is just a problem in the app, when the watch face is exported to the watch it changes to the watch battery.

The display on the phone gives a warped perspective of the actual size of the face, pushing the face to the watch will give you a better idea of what the face actually looks like.

At this point you have your watch face ready to be uploaded to the watch. Press the back button once. (Unlike other apps that allow you to create custom watch faces, WatchMaker auto saves the watch face.)

1. Make sure the watch face is set to the WatchMaker face on the watch.
2. Press the Set Watch Face button and wait for the watch face to show up on the watch.
3. Now you have your watch face on your watch.
4. Here is the time to start tweaking your face to get everything right.

Once that is done, CONGRATULATIONS! You now have, hopefully successfully created your own watch face. Now take it out and show it off.

There are some options that I will not explore here, like using Lua.

I would like to point out that in the same menu as setting the watch face there are options to export/share your watch face, change the way the Google Now cards show up and duplication of the completed watch face.