ANTETYPE Color Picker for OS X – new version 1.2.0

We have made some small updates to the Color Picker in ANTETYPE 1.2.0, those members of our Early Access Program will already have the update installed but if you are not a member of the Early Access Program you can now download the color picker.

The changes are to support working better with applications that take continuous updates of the colors from the Color Picker and to make sure that they layout resizes better.

A small bug in version 1.1.8 happened when multi-colored text was selected that the Color Picker would make it all the same color, this has been fixed in this version.

Download ANTETYPE Color Picker for OS X version 1.2.0

To install the color picker, copy the extracted AntetypeColorPicker.colorPicker file to the “Library/ColorPickers/” folder, either of your user account or the system.” (hold down the option key in the Finders Go-menu to get to your Library folder)

As ever please post any feedback.

Selection rubber bands – Preview 1.2.0

A small but useful update in ANTETYPE 1.2.0 is the introduction of a selection rubber band that can be used to identify other cells that are to be used a targets when setting up interactions or data binding. The existing selector button can still be used when the target for selection is not visible (on another screen or hidden by other elements).

From the Interaction inspector you will see a circle next to selection button, initiate a drag from this circle and a rubber band line will follow your pointer to the target cell of your choice. Each potential target will be highlighted and the name of the cell will be shown in a tooltip.

When a selection has been made the circle will change to have a x mark inside and the name of the cell will be displayed in the selection button.

Clicking on the x in the circle will remove the cell from the selector.

The same selection method also works when using property binding.

This post is in a series previewing ANTETYPE 1.2.0, expect more over the coming days.

If you would like to sign up for to our Early Access Program you can access preview versions of our upcoming releases and a preview version of 1.2.0 is currently available for current EAP Members.

Markup a screen, present notes – 1.2.0 Preview

With ANTETYPE 1.2 specifications can be generated for widgets. To compliment the widget specifications we have added some new widgets to assist in the markup of screens, for presentations or specification output.

There are two new measure widgets that can be used either as free measures to show the size of elements on screen or in combination with Property Binding they can be bound to the size of screen elements.

Another new widget is the note widget which can be used to annotate a screen with notes about the design. A note widget has two components a number and the text of the note, and by adding a click interaction the visibility of text of the note can be toggled in presentation mode.

In addition to property binding the widgets use a new property that has been added to the Display section of the Style Inspector called “Specification Cell”. When the “Specification Cell” property is set the display of a cell or widget can be toggled in editing or presentation modes. The display of Specification Cells can also be toggled when images are exported from ANTETYPE so images can be exported with or without Specification markup.

This post is in a series previewing ANTETYPE 1.2.0, expect more over the coming days.

If you would like to sign up for to our Early Access Program you can access preview versions of our upcoming releases and a preview version of 1.2.0 is currently available for current EAP Members.

Property Binding – 1.2.0 Preview

In ANTETYPE 1.2.0 we will introduce a new feature called property binding primarily to support the new widget specification features of ANTETYPE.

The implementation is not complete and with property binding in ANTETYPE 1.2.0 we will only supporting binding to 6 properties:

• Top
• Left
• Width
• Height
• Text
• Background

The style inspector has a new Property Binding section which you will find as the bottom panel.

To bind properties from one cell to another you first need to select the source cell using either the selector window or using our new rubber band selector.

Once you have selected a source cell you can choose which source properties to bind from.

NOTE: When using property binding with a source cell on another screen it is not possible to bind positional or size properties.

This implementation of property binding is intentionally basic as our focus for ANTETYPE 1.2.0 is to support people in creating specification screens, we will however build upon the property binding features in future releases.

This post is in a series previewing ANTETYPE 1.2.0, expect more over the coming days.

If you would like to sign up for to our Early Access Program you can access preview versions of our upcoming releases and a preview version of 1.2.0 is currently available for current EAP Members.

UPDATED: This post has been updated on 18th March to reflect that the feature is now called Property Binding not Data Binding, some screenshots still show Data Binding however.

Generating a specification for a widget – 1.2.0 Preview

This post is another in a series of posts previewing the features we are releasing in version 1.2.0 of ANTETYPE. The focus of this post is on the new features we have implemented to support creating specifications of widgets.

In version 1.2.0 of ANTETYPE we have added a new function that generates a “specification screen” for a widget.

To create a specification select a widget in the widget inspector and choose “Create Specification Screen”, this will create a new screen with the prefix SPEC: and the widget name. In the example below we have done this for a drop down menu widget.

For the normal state there are width and height measures and a list of the colors and fonts used in the widget. For each of the other states there is also a list of the colors and fonts that are used in the widget and any components if they differ from the normal state.

At first glance the new specification screens would seem to be useful only once design has been completed when the measurements, colors and fonts will no longer change, but the specification screens hold some secrets.

If you modify the widget, this screen will reflect the changes, so if you change the width of the widget not only will the instances on the specification screen change but so will the measures, fonts and colors.

In this example we have change the width and height and the two measures have also automatically updated. The same happens for the fonts and colors and changes in the instances will update the text and color swatches in the specification screen too.

The specification screen is just the same as any other screen, the only difference is that the components on the specification screen are using another new feature of 1.2.0 – Property Binding, to dynamically load the values of other widgets. A follow up post will cover more details of Property Binding in ANTETYPE 1.2.0.

This post is in a series previewing ANTETYPE 1.2.0, expect more over the coming days.

If you would like to sign up for to our Early Access Program you can access preview versions of our upcoming releases and a preview version of 1.2.0 is currently available for current EAP Members.

UPDATE: Post edited to change data binding to property binding and include link.

Editing resources in 3rd party software – 1.2.0 Preview

In a previous post I previewed the two use cases that we planned to tackle in version 1.2.0 of ANTETYPE.

Now that development has progressed I provide can more details of the solutions we have built for each of the use cases and in this post I will focus on the first use case “Editing resources in 3rd party software”.

Prior to 1.2.0 editing a resource such as an image that has been embedded inside an ANTETYPE file was a bit long winded. The resource had to be exported then opened in the relevant app, then saved from that app and then reimported into ANTETYPE and it would have to have the same name as the original resource if all instances were to be updated.

In 1.2.0 we have simplified this process by allowing users to directly open a resource in a 3rd party application from the resource inspector.

As part of the opening process we export a version of the resource to a temporary folder and pass the temporary resource to the specified app. Each time the resource is saved in the 3rd party software, the changes are automatically loaded back into ANTETYPE.

That’s all there is to this use case it may seem simple but it did present us with a few behind the scenes problems, but dropping support for OS X 10.6 made implementation much simpler.

This post is in a series previewing ANTETYPE 1.2.0, expect more over the coming days.

If you would like to sign up for to our Early Access Program you can access preview versions of our upcoming releases and a preview version of 1.2.0 is currently available for current EAP Members.

ANTETYPE – Early Access Program

The release of ANTETYPE 1.2.0 is due in mid to late March, development has progressed well and we are into the final stages of development.

We would like to offer access to preview versions of the upcoming release, via an Early Access Program (EAP).

EAP versions will not have been through the same level of testing as the stable version and come with no support or guarantees of stability, so use the EAP version with care.

You are able to run the EAP version of ANTETYPE alongside the stable version of ANTETYPE.

We suggest that you make your own backup before you open any existing files in the EAP version of ANTETYPE.

NOTE: When opening existing atype files in the EAP version, these files will sometimes be automatically converted to the EAP format, and you will no longer able to edit the files in the stable version until the EAP version is released. Also please remember that when the conversion happens the original is placed in the Trash so that it can be restored in the case of mistakes.

The EAP version uses a separate Shared Library so please remember any widgets in your normal shared library will not be available in the EAP version, and any created in the EAP shared library will not be available in the stable shared library.

If you are interested in becoming a member of our Early Access Program please sign up for our mailing list and indicate that you would like to be part of the Early Access Program.

NOTE: If you are already on our mailing list – please use the same form and enter your existing email address – you will then be given the opportunity to update your preferences.

Next up for ANTETYPE (version 1.2.x)

With version 1.1.8 of ANTETYPE released into the wild, we are now beavering away at version 1.2.

Listening to our users we have heard that the following two use cases could be greatly improved in ANTETYPE and they are the focus for version 1.2.

N.B. Development of version 1.2 is ongoing and this post provides no details about solutions but an overview of the use cases that are the focus of our development. If you have any views on these subjects now is an oppertunity to help us refine these use cases.

USE CASE 1 : Editing resources in 3rd party software

Currently if you would like to edit a resource stored in ANTETYPE in a 3rd party application, you need to go through a number of steps:

1. From the Resource Inspector select the resource right click and export it to a directory of your choosing
2. Use Finder to open the resource in the app of your choice.
3. Edit the resource and save the changes
4. Reimport the resource into ANTETYPE
5. Choose to replace the existing resource of the same name so that all occurrences of the resource will be updated with the changes.

We think we can make this process simpler and more enjoyable for the user.

USE CASE 2 : Creation of style guides and specifications

Currently the creation of style guides and specifications is a manual and tedious job.

For widget specifications we recommend creating a new screen and putting several instances of the widget on the screen in each different state. Then using either custom widgets or text cells annotate the screen manually with any extra information about colors, fonts and sizes. The resulting screen can be then exported and placed inside a specification document.

For screen specifications and annotations we recommend exporting the screen from ANTETYPE and annotating with 3rd party applications.

We think that we can improve this use case too and have some ideas of how we can simplify the process of writing style guides and specifications.

Waiting for 1.2

Our aim is for development to be completed at the end of February and available for general release in March.

In addition to these use cases we will be including numerous bug fixes, so if you have any problems with version 1.1.8 please take the opportunity to tell us.

What do you think? Are these use cases familiar to you? Any suggestions for how to solve them?

Announcing ANTETYPE 1.1.8

The latest update to ANTETYPE is version 1.1.8. In this new release we have updated the way colors are input, managed, stored and exported, in addition there are many bugs fixes and we have dropped support for OS X 10.6.

This post contains more details about the release.

Color Management 

This release has taken a bit longer than expected but it includes some very important updates to the way that color is managed in ANTETYPE.

Installing the Color Picker

The new ANTETYPE Color Picker for OS X can now be installed from inside ANTETYPE – from the Preferences panel. If you have previously installed the ANTETYPE Color Picker you will find it will be automatically upgraded the first time ANTETYPE 1.1.8 is run.

Retina Graphics

All graphics within the application are now provided with retina versions to improve the experience on retina devices.

Supporting 10.7+

ANTETYPE 1.1.8 requires OS X version 10.7 (Lion) or higher. The changes required for accurate color management mean that we have unfortunately had to drop support for OS X 10.6.

Bug Fixes

The following bugs have been fixed:

• Mouse-out & subsequent mouse-enter events were not called in expected order between two cells in presentation mode. The mouse-out event is now called before entering the second cell and triggering mouse-enter.
• Tabbing in the style inspector can be unpredictable – the tabbing is now predictable moving in the expected order down the screen.
• The UI was sometimes not indicating when an instance of a widget had different properties to the widget definition and only highlighting the difference when other properties were changed.
• Copy/Paste of widget instances with embedded widgets would break the embedded-widget relationship.
• Expand / Collapse on the Style Inspector disables some fields.
• State change of widget in shrink freelayout container produces unexpected result – problem report
• Exception when you exit the app in presentation mode
• Crash Reporter not working for OS X 10.8.x
• Crash after copying a collapsed child cell
• Crash when setting underline from Font Dialog in a Text Cell

The bug fixes and changes in ANTETYPE 1.1.8 are the last in the 1.1.x line of ANTETYPE and we are now actively working on version 1.2 of which more to follow.

The update will be installed automatically from the update function with ANTETYPE alternately you can download ANTETYPE again from the website.

Have you installed ANTETYPE 1.1.8 yet? Any feedback? Is the lack of support for OS X 10.6 a problem? Please tell us in the comments.

Updating Color Management in ANTETYPE

This article deals with some of the upcoming changes to ANTETYPE with regard to Color Management, the rationale behind them and the consequences of these changes.

A new version of ANTETYPE will soon be released that supports consistent displaying of colors across devices, displays and Operating System. The core of the changes are that all images and colors are only stored with values in the sRGB color space and it will only be possible to export assets in the sRGB color space.

Why have we updated the color management?

When ANTETYPE was first built we decided we would allow our users to specify the color space with each color when selected using the standard OS X Color Picker. This seemed a way to give users the greatest flexibility, but this had lead to problems matching colors as atype files are moved from computer to computer and also when the output images are rendered on different devices and web browsers. We have realized that in order to create the best and simplest user experience we would need to store all color information in a single consistent color space so that colors would be guaranteed to match.

For an application such as ANTETYPE, which is not primarily used to author printed assets or photographic images, using the Adobe RGB color space does not make sense as this is not the color space that is used by mobile devices and web browsers currently. The major web browsers interpret a CSS or inline hex color using the sRGB color space and will assume that images that have no color space data are in the sRGB color space. Mobile devices using Android, iOS and Windows Mobile do not have the processing power to convert between color spaces and on these devices the expected color space of images is sRGB. For more reading on this topic read: Web browser color management tutorial

It is for these reasons that we have chosen sRGB as the only color space that is used within ANTETYPE. All color data that is passed to ANTETYPE is immediately converted to the sRGB color space: imported images, picked colors etc. All data that is exported from ANTETYPE is exported in the sRGB color space: CSS snippets, screen images, web viewer data etc.

When images and colors are rendered within ANTETYPE then OS X converts all colors to the color space used by the user’s display.

What has changed in version 1.1.8 so that all colors are stored in the sRGB color space?

What have we had to change to get this all to work? A lot of areas have been affected by the changes to color management here are the larger changes:

• A slightly altered file format that assumes all colors are in the sRGB colorspace and therefore colors do not require as much storage space.
• Upgrading existing atype files to new format and converting all color data to sRGB color space upon first load. N.B. Colors & images with associated color space information are converted to the sRGB color space- those with out any color space information are not converted, values are assumed to be sRGB and the color space is attached to the color.
• Upgrading shared library to new format and upgrading color data to sRGB color space.
• All Color defaults are in sRGB Color space.
• Exporting of images always in sRGB color space.
• Option to strip the color space information from exported image to reduce file sizes.
• CSS Export for elements now uses the sRGB color space.
• Force OS X Color Picker to always provide sRGB colors – you will notice that when you use any standard Color Picker in OS X that a message is displayed to highlight that the color chosen has been converted into sRGB.
• Force OS X Color Picker to accurately provide sRGB colors when using the magnifying glass to sample colors within ANTETYPE (only works with OS X 10.8+).
• When the OS X Color Picker is used to sample a color from another application (or ANTETYPE in OS X 10.7) the conversion to sRGB has been updated to assist consistency. N.B. On some displays there are still conversion issues for some sampled colors, this is an issue related to OS X and outside of our control. We recommend using OS X 10.8+ and sampling colors from within ANTETYPE for the best accuracy.
• We have recently released a new version of the ANTETYPE Color Picker for OS X this can now be installed and uninstalled using the Preferences Pane.
• Existing users of the older ANTETYPE Color Picker will find that
  ANTETYPE will automatically update the older version. N.B. you will need to restart ANTETYPE to see the change to the Color Picker.

Version 1.1.8 is undergoing final internal testing before a public release in the next weeks,  look out for a blog post and email to notify once 1.1.8 is released.

Feedback always welcome

We have tested these changes extensively and believe that you should not find any issues with the automatic conversion of your files and the updated processes for importing images, picking colors or exporting assets. As ever though please contact us if you do find an issue.

Have we missed any issues relating to Color Management? Will the new version of ANTETYPE (1.1.8) meet your Color Management needs?