[mac4theblind] New MacBook Pro Touch Bar details: UI interactions, screen specs, Control Strip, and how third party apps can use it

  • From: Mary Otten <motten53@xxxxxxxxx>
  • To: mac4theblind@xxxxxxxxxxxxx, macvisionaries@xxxxxxxxxxxxxxxx
  • Date: Fri, 28 Oct 2016 13:38:49 -0700

I thought some might be interested in this article with more details on the new 
Touch Bar.
Mary
New MacBook Pro Touch Bar details: UI interactions, screen specs, Control 
Strip, and how third party apps can use it
9to5Mac  /  Benjamin Mayo


The flagship feature of the new MacBook Pro is the Touch Bar, an OLED display 
strip that replaces the physical row of function keys. This adds a dynamic zone 
to top of the keyboard where apps can display custom buttons, sliders, switches 
and scrubbers to enhance the MacBook experience while adding a new way to 
interact with Mac applications beyond text input and mouse pointers.

How does the Touch Bar interface work? What is the resolution of the Touch Bar? 
What is the Control Strip? What can third-party developers do with the Touch 
Bar? Read on for all the answers and more …


First things first, the Touch Bar is exclusive to the higher-end 13-inch and 
15-inch MacBook Pro models. If you want the Touch Bar, you must have a new 
MacBook Pro.

And right now, those models are on one-month backorder so this requires a bit 
of imagination. Assuming you unwrap a MacBook Pro for the first time, how 
exactly does the Touch Bar interface work in practice?

General Interface and Control Strip



The Touch Bar offers quick access to functions provided by applications and by 
the system. The main interface is split into three distinct sections: the area 
for app controls, the Control Strip and a system button. The system button is 
controlled by macOS Sierra and displays a Cancel, Done or virtual ‘esc’ key 
where necessary. It may be the death of the physical esc key but the operating 
system guarantees that a virtual button will always be available.

In the middle is the ‘app region’ which is controlled by the currently active 
app (the one whose name is displayed on the menu bar). If you are on the 
desktop, this is just going to be a blank space. When you click into an app or 
select a file, it will light up with contextual buttons and actions.



What about the media keys and brightness controls? These are contained within 
the Control Strip. This is another element controlled by the system and it is a 
persistent tray on the right hand side with buttons to access sliders for 
brightness and volume, mute and Siri. This tray is expandable (or collapsible) 
so you can dedicate more screen real estate of the Touch Bar to app content if 
you want to. If you hold down the function key, the Touch Bar transforms into a 
virtual set of normal function keys. This behavior is configurable in the 
preferences.

Touch Bar Tech Specs

The Touch Bar is a 10-point multitouch touch screen located above the keyboard, 
replacing the function keys on existing Mac keyboards. It’s also the same 
approximate physical size as the row of keys it replaces, a skinny height 
rectangle spanning the full width of the keyboard. In technical terms, the 
display is 2170×60 pixels. Details on what drives the Touch Bar are not 
entirely clear but Apple says it has a custom T1 chip to power the Touch ID and 
Apple Pay features (it seems like the T1 is actually a mini Apple Watch SoC.)

The Touch Bar is a @2x Retina display, which makes an effective screen 
resolution of 1085 x 30 points for content display. Essentially, there is no 
meaningful concept of a Y-axis when interacting with display — controls always 
take up the full height. The display also supports a P3 wide color space, just 
like the primary MacBook Pro display and the new iPhone 7. This means apps can 
make buttons appear on the Touch Bar with strikingly vibrant and saturated 
colors.

Developer API

The Touch Bar is supported by a comprehensive API for third-party developers to 
add rich controls and interface elements for their apps, in the same way Apple 
has done for its own stock apps like Safari and Mail. Typically, initial 
iterations of third-party developer integration from Apple are limited and 
simplified, and then slowly expand in capability with future versions. The 
Touch Bar API is not that, its first version features a very detailed, 
customizable and intricate set of APIs.

 

Developers have full control over what buttons and views they want to show and 
how the buttons are displayed. Apple includes a handful of template controls 
for consistency between apps but the API enables developers to create 
truly-unique controls for their individual needs as well. The main constraint 
is that the Touch Bar is very skinny and UI can only be shown in a single 
horizontal row (side scrolling is possible).

Developers can display pretty much whatever they want whilst their app is in 
the foreground; this includes swapping out views and buttons depending on the 
current window of their app (a compose window necessitates different Touch Bar 
accessory views than the inbox window). However, the Touch Bar does not allow 
persistent widgets, status items or similar features like always-visible news 
tickers. These constraints are unlikely to be lifted either; Apple is imposing 
the restriction so that the UI under the user’s finger isn’t constantly 
changing due to spurious notifications or text messages.

Apple wants the bar to display peaceful relatively-static UI based on the 
current task. Major changes to the Bar should only happen when the application 
state drastically changes, such as opening a new tab or beginning a new modal 
activity. To repeat: once an app’s window is not active, it loses its control 
to influence what is shown on the Bar. The system Control Strip sits to the 
right in a collapsed state by default, but can be disabled entirely in System 
Preferences if desired.

The API also allows developers to make more controls than they might want to 
show at any one time, enabling users to customise their toolbar layouts with 
options and commands that are most interesting and relevant to them.

Touch Bar Controls



Apple allows apps to make custom views to display unique content but it 
provides a rich set of base elements too. Here’s a look at the Apple stock 
controls, to give an idea about what kind of interactions are possible. There 
are buttons, toggles, multi-option collapsible pickers, segmented controls and 
sliders.

There is also the concept of popovers which temporarily swap out the toolbar 
with a modal view. For instance, the emoji picker is a character viewer modal 
view — a scrolling list of emoji symbols. Apple also has a color picker modal 
to select colors from a rainbow spectrum strip.



Combining all of these elements together creates the rich interactions. Marc 
Edwards produced a nice image showing a plethora of Touch Bar states for apps 
that Apple showed in the keynote itself, showing how all the controls come 
together to customize the experience for every app. Microsoft also showed some 
good examples of using the Touch Bar with the Office suite, where the buttons 
naturally gel with Office iconography and tools.

Design Guidelines

Although Apple cannot enforce Mac apps outside of the App Store to comply with 
any guidelines, it is providing documentation to encourage good practice and 
consistent experiences. The design documentation is comprehensive and can be 
read in full here if you are interested. In summary, the Touch Bar should feel 
as responsive as an iPhone to the touch and blend in with the rest of the 
keyboard as much as possible. The OLED display provides incredibly high 
contrast to make the black backgrounds of the bar mirror the black physical 
keys.

The display supports wide color but Apple is generally discouraging the use of 
bright colors and imagery apart from where it is essential … although Apple 
isn’t exactly leading by example here with the Siri button.

I wish Apple would stop insisting the Siri icon on the Mac has to be 
full-colour when all the icons around it are monochrome glyphs. 
pic.twitter.com/SXraaXM4B1

— Benjamin Mayo (@bzamayo) October 28, 2016

Another interesting point is that the Touch Bar should not be the only place to 
be able to perform a feature of an app. In fact, developers don’t get to know 
if the Touch Bar is present or in use at all. What this means is that the Mac 
app toolbars and controls visible on the primary display will not change in the 
presence of the toolbar.

The reason behind this decision is the simple fact that the Touch Bar is not 
available on most Macs or external keyboards so it can’t be a mandatory part of 
the experience. Apple is positioning the Touch Bar as an additive improvement, 
a bit like 3D Touch Peek & Pop on the iPhone.

In the same way, Apple is discouraging duplication of functionality where 
possible; they don’t want developers to show things just for the sake of it. 
The guidelines also say to avoid showing ‘well-known’ keyboard shortcuts like 
cut/copy/paste as it’s assumed everyone will still want to do basic shortcuts 
like that ‘the old way’ using Cmd+X, Cmd+C, and Cmd+V.

Summary

In summary, Apple has introduced a very powerful Touch Bar in its first 
iteration with comprehensive developer integration for the currently-focused 
app.

The Touch Bar is really interesting but time will tell if it becomes an 
essential part of the Mac, so much that you would miss it if it wasn’t there. 
Customers will start getting their hands on the MacBook Pro with Touch Bar in 
the next couple of weeks, as the products are already backordered around the 
world. What do you think of Apple’s latest interface innovation? Let us know 
your impressions of the Touch Bar in the comments below.

Guides

MacBook


View THe Guide
MacBook Pro


Apple's high-performance laptop line was introduced in 2006 and was the first 
laptop of Apple's lineup to have an Intel chip. The pro lineup were also the 
first to get backlit keyboards, unibody aluminum construction, and the 
combined, glass, trackpad.

View THe Guide
MacBook Pro (2016)


Apple is rumored to debut a new MacBook Pro in late 2016

View THe Guide


Original Article: 
https://9to5mac.com/2016/10/28/new-macbook-pro-touch-bar-details-ui-interactions-screen-specs-control-strip-and-how-third-party-apps-can-use-it/


Sent from my iPhone

Other related posts:

  • » [mac4theblind] New MacBook Pro Touch Bar details: UI interactions, screen specs, Control Strip, and how third party apps can use it - Mary Otten