Wednesday, 27 February 2013

(Windows) 8 Deadly Sins

After the marathon that was getting Windows 8 onto my Mac, I am now finally in a position to comment on the usability of the desktop experience. It's nearly as painful as getting the thing installed in the first place!
I am flabbergasted by number of UI sins it commits. Here are the 8 of the most 'deadly':

1. Removing the Start button

For some reason Microsoft have been obsessed with 'cleaning up the desktop' for some time. The Start menu just grew and grew until it dominated the whole offering. It now feels like a shroud over the desktop - which we all thought was the main work area. But Microsoft wants to retrain us into using full-screen apps in the Metro 'style'. (Metro is a name they were using for the tiled Start Screen, which got dropped before release.)
We used to talk about getting 'lost in hyperspace' on a website when we were left on a page with no links. Metro apps will give you the feeling of being left in a vacuum.

2. Cornered by Edge cases

After getting completely lost and not knowing where to go, you might start moving the mouse around the screen. The hotspots are in the very corners of the screen. There is no visual indication that the corners are hot and significant. You're somehow expected to 'know'. Without this knowledge, you'd be hard pressed to guess. You might be lucky and stumble across them. But why not indicate. It would be easy to highlight the hot corners with some kind of visualization as the mouse pointer neared the corner. Microsoft has gone for visual simplicity and clean interface to a fault here. Where ar the visual cues we need to follow our intuition? What would be wrong with just placing a start logo (or even a partial one) in the bottom left of the screen?
What's more, when you finally get the bottom left corner trick, you get a thumbnail of the start screen. As a mouse user, you might, like me, instinctively, move away from the corner to click in the centre of the icon. However, if you move you're dead. The icon disappears and you end up clicking on whatever was behind it! Talk about punishing the user. It feels like a slap on the wrist for moving the mouse.
And up in the top left corner, it's just as confusing. Somewhere the system has a list of apps or processes that are running. You get a thumbnail of the next process appear, which, when you click will switch to that task and the preview will change to the next one in the rotation. Why oh why don't you show me a list? All I want it is my familiar Windows 7 taskbar back! (On further investigation I discover that Windows key + TAB shows the very list I want. Why doesn't the top left corner hotspot work this way? It's a complete mystery!)
Now, to get system level configuration options. Move to the top right or bottom right corner - to get a panel that fills the whole right-hand side of the screen. Why can't get this panel when I move the mouse to anywhere along the right edge, top middle or bottom?

3. No going back - I can't Escape!

One of the most frustrating things I've encountered with Windows 8 is the feeling of hopeless isolation when I'm in a Windows application with no apparent way out. In just about every other environment I've worked in, the ESC key is my back-out clause. Not here. ESC does nothing. Try Backspace. Nothing. Try just about any other key. Hopeless. The last thing I try is the Windows key. (Command on my Mac!) Well, what do you know, I'm back on the home screen.
Stuck in a application and I can't get out of it. Windows key - obvious, Not! All it does is toggle between Start and the App I was in. How do I get back to the desktop?
(Now I know, I'll tell you: Press Windows-D, or Windows-Tab repeatedly until you highlight the desktop. Seems Microsoft realized what a problem this is, because just before release the added a desktop tile on the Start Screen as well.)

4. Displaying things that just aren't there!

The finance app tile shows an article "Apple still has magic innovation", Strangely a woman handling meat is the thumbnail. On clicking it I find a feature article about horse meat being introduced into beefburgers in Europe. Nowhere can I find the article about Apple innovation.

5. Consistent Inconsistency

The only thing consistent about this UI is the blatent inconsistency.
- scrolling up and down to go sideways.
- In settings there are three word commands: Start Tiles and Help. But Start is disabled! At the bottom there are 6 icons: 5 bars (network) shows the name of the network connected to. Speaker (Sound) shows the volume. Sun (Brightness) shows the word Brightness - inconsistent. Card with greeked words (Notifications) shows Notifications. On/off switch icon (Power) shows Power. ENG icon (Locale/Keyboard) shows description US. If I change it to French (Canada) it changes the icon to FRA and the description to Keyboard! If I change it to English (Canada) Canadian Multilingual Standard the icon changes to ENG and the description to CMS.
Underneath this it says Change PC Settings. This might seem like a sub-title. But it's actually a clickable command! And what's more - it's the most significant command. And it appears last in the list, right-aligned. A sure way to imply that it's insignificant.
- Pressing Windows key when the OS loads will do nothing. However, if you have an app open, it will switch to that app, and then pressing again will toggle back to the Start Screen. Why doesn't it just switch to the desktop instead of doing nothing?

6. One OS cannot rule them all

It's clear that Windows 8 is designed for touch screens. This may be Microsoft's biggest mistake yet. Their primary audience is clearly desktop users, but here we have a UI which is designed for touch, but 90% of the users will be on desktop PCs. If they had only spent more time testing this on desktop PCs using mice and not on their precious Surface tablets - which may end up selling less units than Blackberry's Playbook!

7. Right click - it's just not right!

One of the most useful features of traditional windows is the right click context menu. It's intuition in a bottle (once you know it's possible!)
However, right-clicks on this beast are a completely different experience. Right-click with either yield no result, or give you a pop-up panel, usually at the bottom of the screen, with very few options. It feels like all the power in you middle finger has been taken away.

8. Search

Everything about search is wrong here. First off, did you know that you can start searching the PC just by typing on the Start screen? This might be a good thing, if Windows searched the whole system. For example,  I had a problem with the screen brightness on my MacBook Pro being too dim. Search for 'brightness' - no results. But under Settings (just below the Search box) you can see that there's an option for Screen brightness, the very word I searched for!
The search paradigm is all wrong here. The principle of type to search is very powerful. But the problem here is that all the search categories are on the right. It's hard to know straight away that your search is within a domain: Apps, Settings, Files, and other categories which look very much like Apps. The results appear on the main area of the screen on the left, but with your attention on the left of the screen, you don't intuitively realize that the control panel is on the right.
Eventually you might realize that Windows-Q brings up the App Search, and Windows-F brings up File search. But they behave differently. As you type to search for apps, the Apps are filtered in the left hand pane. As you type to filter for files, the list appears underneath the search box, and the left pane remains blank, until you hit the enter key. Inconsistent and disconcerting!

Wednesday, 20 February 2013

Quest for optimal MacBook Pro with SSD+HDD combo dual-booting Windows 8

One Laptop to Rule them All

One of the reasons I finally pulled the trigger about a year ago on a > $2k Mac was the promise that I could run all current popular OS configurations on it: OSX, Windows and Ubuntu Linux.
I finally parted with my cash in December 2011 (note that date - it will be relevant later), and my shiny silver MacBook Pro arrived just before Christmas.

Setting it all up

It took me a little while to get used to OSX, and one of my first projects was to fire up a VM or two. Being a bit cheap, I opted for VirtualBox instead of Parallels, a free product I had grown to like a lot while I was working at Sun (but is now owned by Oracle).
Ubuntu was easy. Download the ISO, create a new VM and point it at the ISO. Done.
Windows created more of a challenge. Partly because I wanted to see if I could make my old laptop 'virtual'. I imaged my laptop's disk and attempted to convert it for use in the VM. I was almost successful, but lets just say I don't use that VM - it's just there in the list to remind me not to waste time on stupid things in future...
So then I thought I'd finally use that Windows 7 upgrade disk I got shortly after purchasing my Vista desktop PC.
But how to do it?
I went through all my disks trying to find a full version of Windows. Finally I found one that would install so I could use the upgrade. After way too much wasted time, I had a Windows 7 VM on my Mac!
Then, a short while later, Windows 8 release preview comes out. Thankfully this was much easier to install into a VM. (It's relevant - see later...)

SSD Mecca

Fast forward a few months - it's nearly Christmas again, and to my complete delight I see an Intel 480Gb SSD on sale for $329. That will make my Mac sing, I thought! (In actual fact it made it groan before it sang...)
My mistake was to get storage greedy and purchase an OptiBay drive enclosure. The idea is that you take out the little-used DVD 'super' drive and place a second hard drive in its place. You then place the DVD in an enclosure and plug it into your USB port when required. (Actually, you might need to occupy two USB ports, especially when writing to DVDs, because they consume more power than your average USB device.) Which brings me to another beef with my Apple - why only two USB ports? Would it kill them to put another one on each side of the laptop, making 4?

Back to the OptiBay story:
Issue #1 - OK, I'm about to mess with drives here - better be prepared for the worst - where's my OS recovery disk? Can't find it. Call Mac support - don't need a disk - go to some obscure website and download the OS, create a recovery USB.
"Why do you need it?" They ask.
Innocently, I reply: "I want to install my own hard drive and install OS X on it."
Apple guy: "It'll void your warranty."
Me: "But I did my own memory upgrade."
Apple guy: "That's OK, we let you do that - but don't even think about putting your own hard drive in, it'll void your warranty unless you get an authorized Mac Dealer to do it. and BTW, it can only be an SSD make  & model we approve of, which you purchase through our Dealer."
Seriously?! Forget that, I'm doing it my way.

Issue #2 - Open up the Mac, locate the drive. Undo some screws only to find that some won't unscrew. Look closer - it's a different kind of screw with a star shaped head!  Check Optibay documentation - use provided Torx bit - Torx Size 6 to be precise. Only they didn't provide one...

Issue #3 - Finally found right screwdriver bit - try again. Slot SSD into OptiBay slot and boot up. Drive is recognized - time to format it. Format successful. Check disk - disk has errors! What? Format it again. Disk does not have errors. Check again 2 secs later - now it has errors! What?!?@#?$?@!
Browse forums - eventually discover that the Optical bay slot will recognize a 6Gb/sec drive, but doesn't support it - on my particular MacBook Pro 8,2 late 2011 model. Earlier models will accept the SSD and run slower, newer models will accept the SSD and run fine at full speed. See compatibility notes on this page. Solution: swap the drives. Finally with the SSD in the main slot and the HDD in the OptiBay slot I'm finally up and running with close to 1Tb storage.

Issue #4 - Microsoft emails me offering Windows 8 Pro upgrade for $40, because I downloaded the release preview. Pretty good deal, no? Do I need it? Well it would be nice to dual boot - enter the wonderful mystery world of Apple's BootCamp. How will I get this onto Bootcamp? Plan A - Burn Win8 Preview to DVD, run Bootcamp, create Windows partition, plug in external DVD drive, re-boot and load up the Windows installer. Easy, right? Except Bootcamp won't let me proceed - no optical drive. Yes there is - it's plugged in right there! Forget this: reboot anyway. Disk whirs, blank screen. Wait several minutes. Disk spins down. Nothing. Hold down power button for a few seconds. Remove disk from USB port. Restart system. "No bootable media found - press key to try again." Insert USB drive again. Press key. Nothing - it's frozen. Reboot again. Same thing.
At this point I'm really worried that I might be screwed. Thankfully I knew about the option key boot option. Restart system, hold down option key, breathe relief when your Hard Drives show up and you can get back into OS X.
So what can I do? How about booting from a USB? Surely that works - many MacBook Airs and Pros don't have a DVD drive. Surely that must work.  So I use Microsoft's Windows USB Loader program to create bootable USB. Plug it in. Try again. Nope! "No bootable media found."
Then I find out you can also press the C key on boot to force it to boot from CD/DVD drive. Nope. "No bootable media found."
Seriously? Burn gparted to DVD. Try again. Hold down C and gparted boots up Linux no problem. But not Windows. Hmmm.
Search forums online. Some people can, some can't install Windows via Bootcamp. Then I discover that someone put their DVD drive back into the Mac - it worked!
Open up Mac, replace HDD in optical bay with DVD drive containing Windows setup disk. Close up Mac. Reboot. Hey presto, the Windows logo appears!
So the evidence here is that Apple has specifically locked MacBook Pros with Optical drives from booting via USB. What's with that?!!

So in summary:

  • Put your SSD in the main drive bay, and if you want a second drive, place that in the optical bay, especially if you have a late 2011 MacBook Pro.
  • Make sure you have the right screwdriver bits before dissecting your Mac. (Including a Torx 6 bit.)
  • If you took your optical drive out, and you want to dual-boot Windows, put it back in before starting Bootcamp. It will save you a lot of grief and time.
  • If you didn't have Windows already installed on that bootcamp partition, the official line is that you won't be able to activate it unless it's a license for a brand new full version of Windows. (An OEM version you got with an older PC may work. Then you should be able to upgrade it once loaded. If you're really stuck, see this Microsoft community thread.)
  • If during setup, Windows doesn't recognize your Bootcamp partition, use disk tools in Windows Setup to format your bootcamp partition as NTFS before proceeding.

Now I finally have Windows 8 on my SSD on my Mac, I'll be able to tell you what I think of it in my next post.

Monday, 30 April 2012

Mobile Framework Showdown

I recently got a new project to work on, and thought it was time to step back and re-evaluate the lay of the land for mobile app development.
I offered both native and mobile cross-platform approaches to the client and they requested the latter. (I think that many businesses with smaller budgets will be making the same choice, sacrificing a little usability and responsiveness for flexibility and economy. After all, they want the biggest bang for their buck.)
The landscape is changing really fast, and so it's always a good idea to stick your head up now and again to survey the landscape.
My current assessment is that, although there are many emerging solutions for developing mobile apps with web technologies, there are three frameworks which seem to have gained significant adoption. And the interesting thing is that each embodies a significantly different approach. Here are my top three picks:
  • jQuery Mobile
  • Sencha Touch
  • Titanium Appcelerator
 What are different approaches?
  • jQuery Mobile: HTML5 defined views, and CSS provided styles with JavaScript code behind
  • Sencha Touch: Pure Javascript defined views and code implementation producing proprietary HTML5 & CSS
  • Titanium Appcelerator: Javascript code written by you is cross-compiled into native code. (Runs as Objective C on iOS, Java app on Android.)
It would be easy to assume that these three frameworks were three variants of making the same meal. A more appropriate metaphor is that there are three very different ways of using the same ingredients to create similar, but fundamentally different tasting meals.

Monday, 2 April 2012

Presenting at Mobile Mondays Calgary

I'll be presenting on Mobile Cross Platform solutions at MobileMondaysCalgary (@MoMoYYC) this Monday, 2nd April, 2012:

Tuesday, 20 March 2012

Home screen splash images in iOS5

It seems that Apple slipped-in a resolution to the bemoaned lack of high resolution splash screens for webapps added to the home screen for phones with retina displays. However, there are a couple of gotcha's that you might want to be aware of.

First some background. Here are some examples of how you make you web page capable of providing a home screen icon and splash image with iOS devices:

With iOS5 there are now a few scenarios you need to handle:
iOS < 5 - Retina splash not supported - image must be exactly 320 x 460
iOS >= 5 - Retina splash supported - will not use lo-rez splash - image must be 640x920
iOS >= 5 - on non-retina phone - retina splash not supported Retina splash not supported - image must be 320 x 460

There are basically two techniques that should work here to determine the right image to use: CSS media queries and Javascript injection.
CSS media queries
It seems that CSS media queries are not fully supported on older phones. I found that when adding several directives with different media queries that things stopped working as expected on some devices. Older iPhones on older versions of iOS were either ignoring the media query or somehow parsing them wrong.
Javascript injection
I found the best path to sanity was to use javascript to inject the right directive into a script tag in the header:

Make sure your image file is still small
The image you will be transferring is four times larger than before, and I've observed that if it's too large it may not show up on the first load. Our client's splash screen art was quite detailed, which doesn't compress well. My initial hi-rez image as a PNG was 400K. In one test, I thought that something in my markup was wrong until after about the tenth time starting the app from the home page, the loading image finally appeared. Obviously my file was too large to transfer quickly...

Consider JPEG
It's not common knowledge that the splash screen image format can be PNG, GIF or JPEG. Most of us have got used to using PNG, but if your PNG is too large try a JPEG, tweaking the settings until you get a good compromise between image size and quality. I found that just by saving it out to JPEG with 90% compression setting cut my image file size by 75% without losing too much noticeable detail.


Monday, 19 March 2012

Application Craft Impressions

Application Craft (AC) is a very ambitious attempt to put modern HTML5 development, including mobile, onto the cloud.
The premise is this:
Sign up, sign on, start developing. All for free.
And you really can. It sports a WYSIWYG drag'n'drop form designer, a comprehensive smorgasbord of droppable widgets with property sheets, including layout containers and integrated jQuery Mobile UI components, and an embedded Javascript IDE within the browser. (It really reminds me of an online Visual Studio-like IDE for HTML5 and Javascript mobile apps.)
The big advantage of all this is that you can develop and deploy in your favorite HTML5 browser without the need for a web server to host on.
And what's more, they claim to support desktop, tablet and phone all from the same app, using in-built adaptive layout strategies.
The widgets can even be bound to a datasource, either inherent to the Application Craft framework, or linked to a SQL database on a different server.
Application Craft does have a monetizing model based on number of developer accounts, data storage and bandwidth.
New features are server-side javascript modules and file-based data sources.

My Take
One of the things that impressed me about this framework is that it has the potential to get prototypes and proof of concept apps up and running at virtually no cost.
I have a couple of pet projects I'm working on that are well suited to this. One is completely green-field and the other is a mobile version of an existing web site with its own database backend.
I found the online documentation quite comprehensive, if a little thin, and the many short video tutorials are very helpful to get you started, but are really just feature explanations with examples. A real step by step tutorial would be very helpful.
The online forums are worth using. The AC team is very responsive and will often offer to diagnose an app that you're having problems with if you're willing to share your password with them, or seem more than willing to do a Skype session with you to talk you through an issue. It's obvious they care about their product. However, I do wonder if it takes off, whether they will be able to keep this level of customer care up. For now, though, it's fresh air for early adopters.

It's clear that the AC team has covered their bases - there are ways to preview populated forms instantly in the IDE, run your app in Live mode on the desktop. There are plenty of hints and tips in the documentation on how to test out your app in desktop phone simulators and to set it up for debugging.
And because this is all hosted, if you happen to have an iPhone or iPad laying around, it's easy to test it out on the real thing.
AC also support wrapping with PhoneGap as a service if you really want your warez on the App Store or Google Play (the store formerly known as the Android Market).

All of this may seem too good to be true. Well, I can assure you it's all true, but it's an ambitious product, and there are definitely some rough edges. After playing with it for a couple of weeks, here's the good, the bad and the wish list:

The Good
  • The Javascript IDE is almost as good as day-to-day coding in Eclipse. It has themes, a level of context sensitivity
  • It's built on jQuery and jQuery Mobile, and so both of these libraries are available for your use if you know how to use them.
  • The layout containers make it really easy to construct a well-behaved UI. Combined with the adaptive layout rules, you really can make a one size fits all UI, if you have the patience.
  • An impressive set of UI widgets with the ability to add custom widgets of your own make or from third parties.
  • Ability to create multiple apps within your console and have them up and running on your own application craft sub-domain in no time.
  • Being a hosted end-to-end IDE, you can develop on one PC and pick up where you left using any other.
  • A built in security model to ensure your developments stay private until you're ready to release them to the world.
The Bad
  • Many web developers are used to tweaking styles and CSS to adjust the look of their apps. AC all but alienates you from that. Not good.
  • Application Craft's data storage is a good idea but really badly implemented. It's cumbersome and too complicated for anything but the very simplest of apps. I got the feeling that this was just an experiment that went wrong. Try to build out a data model using the AC system and you'll soon be tearing your hair out wondering where the productivity gain is. AC would do much better to recommend that users find a free database hosting service and link it up to the AC front end, instead of implying that they have a fully integrated solution.
  • I'm still not really sure how customizable AC is, unless you're game to create custom widgets to fit into their framework. I get the impression that if you step outside the walled garden, you're going to wish you hadn't strayed.
The Wish List
  • The AC API has quite a bit to be desired. It's quirky and overloaded, and has some annoying idiosyncrasies and inconsistencies. It could really do with a clean up by someone who has, well, developed an API intended to be used by other developers. It is a high level API and pretty powerful. However, when AC says you'll be programming in javascript, you'll really be programming in their version of event driven javascript, with a few lines of jQuery for the informed.
  • True fixed headers and scrollable panels. The true fixed headers are promised with a near future integration with jQuery Mobile's updated widget set. The absence scrollable panels is more obvious when you upsize your app from phone-size to more complex pad-sized layouts.
  • It would be nice to develop AC apps on iPad and iPhone devices on the go. Unfortunately the advanced AC IDE tools only seem to run inside modern desktop browsers.
I was able to get things done in AC, but not without several failed experiments and lots of property tweaking. Without a good understanding of HTML I'm not sure if I'd have made it without giving up. I'm not sure that it's really quite ready for prime-time just yet, but for getting a free hosted prototype hooked up to an online database it definitely has some merits.
Application Craft holds a lot of potential in its hands. I wish them good luck in reaching it as they round out and refine out the service.

Wednesday, 7 March 2012

Apple announces iPad 3, 1080p Apple TV, iOS 5.1

Apple is bring Siri to the Japanese in iPhone iOS 5.1
Apple TV is now 1080p interface and movies, with updated UI and photo streaming.
iPad 3 (not iPad HD as some had speculated):
  • Retina display is 2048x1536 pixels. Over 3 million pixels.
  • Dual-core A5X chip & new Quad-core GPU (claimed 3x faster than NVidia Tegra 3)
  • 5MP Camera full-HD 1080p video
  • Voice recognition & dictation (not SIRI)
  • LTE hi-speed digital wireless (Verizon and AT&T in US; Rogers, Telus & Bell in Canada)
  • Same pricing as iPad2

Biggest surprize is that a full-blown SIRI experience is NOT part of the initial iPad 3 launch. It will probably turn up in a future update.

Neither is any space-age haptic feedback feature...
Rumours were flying
, but it seems that April 1st came early this year!