The User Interface

Our sophomore release of Colors is our most robust app to date. There are quite a few screen and options to cover. We include only the major screens here. However, if you need help with any issue related to Colors, send us an email and we can cover individual issues in more detail. The main pages include the home page, My Colors, cliqcliq.com, palette editor, photo color extractor, and detail pages.

The Home Page

The home page is broken into two major sections: browsing and creating. My Colors bring you to a list of all the palettes stored on your device. Clicking cliqcliq.com brings you to the collection of palettes stored online. In the "Create Palette From" section, the first option, "Scratch", lets you create a new palette manually, choosing each color. The other options in this section let you choose photos from which palettes will be automatically generated (guided by your input). Clicking on the avatar in the top left of the screen lets you access your profile information.

My Colors

In Colors 2, your palette library is now searchable and sortable. From the My Colors page, you can create a new palette from scratch, delete palettes using either the swipe and delete gesture or by clicking edit and selecting multiple at once, or select a palette to view/edit.

cliqcliq.com

With the addition of online support to Colors 2, sharing palettes becomes a lot simpler. You can search for palettes by name or browse the most recent. If you're logged in, you'll also see a "personal" tab that lets you see the palettes you've uploaded. You can also delete palettes you've uploaded in the personal tab using the swipe and delete gesture.

Clicking on a palette in either tab brings you to a palette details page. You can import palettes into your library using the import button in the top right of the screen.

Palette Editor

The palette editor is broken into four regions: the current color, color manipulation controls, inkwells, and conversion/other.

You can drag colors, using your finger, from the current color into one of the inkwells, or from any other inkwells back to the current color (or into other inkwells). Clicking an inkwell will also make it the current color.

Double-tapping an inkwell changes the interface a bit. Firstly, it selects the tapped color. Second, it changes the color manipulation controls to be relative (rather than absolute). After one inkwell is selected, you can single-tap to select others. Tap again to deselect if desired. When one or more inkwells are selected, manipulating the color controls modifies all of the colors in the current colors area simultaneously. This lets you shift the hue of a whole palette really quickly, for example. If you click "save changes" (which appears in the current colors area when you've made this sort of change), you changes will be saved. Otherwise, you can cancel and your colors won't be affected.

Double-tapping the current colors area lets you see your palette in full-screen mode. Click again to return to the normal view.

When RGB or HSB modes are selected a small circle of arrows is presented. Clicking this lets you change the scale of the numbers displayed. Software developers will appreciate this since they have to work in a variety of scales (and modes) and often convert from one to another.

The camera icon in the bottom left lets you update the palette using colors extracted from photos. Any colors currently in your palette will be locked by default though, so don't worry about losing them.

Photo Color Extractor

The photo color extractor uses a really cool algorithm to extract the predominant colors from a photo. Sometimes you see a sunset, another design or logo, or another average setting, and you just want to capture the mood it presents. Colors lets you do that using color extraction.

In the color extractor, what you see is what you get. Use the pinch and pan operations to choose which part of the picture to focus on. The part you can see is the part the algorithm is run over, so you can zoom in to get precise colors, or zoom out and let it do its magic.

Tapping an inkwell when the color extractor is visible locks and unlocks inkwells. This is useful when you have some colors you want to keep, or if you want to use colors in multiple different regions of a photo.

Detail Pages

Palette detail pages let you see each color in detail and all of their numeric values. You can also email the palette or upload it to cliqcliq.com from here. It's often helpful to name your palettes, you can modify your palettes names using the text field towards the top of this page.

Working with Office Open XML Files and Office 2007/2008

For Office 2008 on Mac OS X, copy the palette XML file to "/Library/Application Support/Microsoft/Office/User Templates/My Themes/Theme Colors/" (you may need to relaunch PowerPoint if you already have it running).

For Office 2007 on Windows XP, copy the palette XML file to "C:\Documents and Settings\\Application Data\Microsoft\Templates\Document Templates\Theme Colors\".

For Office 2007 on Windows Vista, copy the palette XML file to "C:\Users\\AppData\Roaming\Microsoft\Templates\Document Themes\Theme Colors\".

The order of colors in your palettes determines their functionality within Office products. The first 2 colors are the secondary dark and light colors for text and backgrounds, respectively. The next 6 colors are the accent colors. After those, the next 2 colors are the primary dark and light colors (for text and backgrounds). The last 2 colors are the link and followed link colors.

The default colors, if not specified, are black (#000000), white (#FFFFFF), blue (#0000EE), and purple (#551A8B), for the primary dark, primary light, link, and followed link colors, respectively. If fewer than 8 colors are specified, the first colors are reused cyclically.

If you find that this order doesn't work well for your needs or that you need to tweak the colors, it is straightforward to open the XML file in any text editor and modify it. Microsoft provides a good reference at http://msdn.microsoft.com/en-us/library/cc964302.aspx.

Importing ASE and ACO Files

Unfortunately, it's not as easy as double-clicking the files...

The following steps apply to using ASE files in Illustrator:

1. Go to Window » Symbol Libraries » Other Library
2. Navigate to where you previously saved the ASE file, and select it. The colors you saved in the ASE file will be loaded into your swatches palette, ready for you to use.

The following steps apply to using ACO files in Photoshop:

1. Go to your swatches window in Photoshop and click on the list view icon in the upper right corner (represented by 3 horizontal bars and a downward pointing arrow).
2. Cick on "Load Swatches..."
3. Navigate to where you previously saved the ACO file, and select it. The colors you saved in the ACO file will be loaded into your swatches palette, ready for you to use.