You’re reading all articles tagged 'ipad'
Sketches made in Procreate app, trying to capture different angles of a feeding oystercatcher at Rushy Common
Using the iPad Pro as my main computer
I’ve been an iPad Pro owner since 2016. I’ve long wanted something like a Wacom Cintiq, where you draw directly into an app, rather than the disconnected feel of a Wacom Tablet, trackpad or mouse. When I first bought the iPad, I wasn’t sure if it would satisfy that need, or become the device equivalent of a sandwich toaster – purchased with good intentions but ultimately consigned to gather dust in a drawer.
It’s started slowly, but the platform has been maturing and I’ve been using it more and more as my main computer. There are limitations and issues, which I’ll come to, but I keep coming back to it as a my main design tool. There’s something very alluring about this light and portable thin slab of glass that can do (almost) everything I need it to.
This is about what I’ve discovered along the way, and why I love it.
To navigate this big-assed post, here are the contents:
- How did I get here?
Eliminating the Surface Pro from my enquires, and what drew me to the iPad Pro
- Why Bother?
Why go to the trouble of adapting to a new way of working?
- Apps and Workflow
What I use to do ‘real work’ on the iPad Pro.
- Shortcomings & Workarounds
It’s not perfect, yet.
How did I get here?
I started writing this post three years ago when I had the opportunity to have a long trial with both a Microsoft Surface Pro 4 & Pen and an iPad Pro & Pencil, enough to have some very firm opinions on them. Starting with the Surface Pro…
On paper, the Surface should’ve been the answer to my prayers. Keyboard, trackpad and pen input with 1,024 levels of pressure sensitivity. All this, with full desktop apps. Unlike the iPad, it has an integrated kickstand, and the low angle of this is ideal for drawing. In my experience however, it just drove me mad.
The pen itself looks and feels like an ordinary biro, a bit cheap and not very nice to hold. You’re very aware that the tip is actually a button as it clicks slightly when pressed down – no real drawing tool does that. Palm rejection was OK but not brilliant, as I found it quite easy to activate functions from the right side of the taskbar with the edge of my hand.
I tried some touch enabled apps like Autodesk Sketch which worked well for sketching, but I soon found that to make production quality vector artwork, I would need to use Illustrator. On first launch, Illustrator offered to switch to a touch-dedicated workspace. This made functions like undo and delete easily accessible, but also hid tools I wanted to use and I couldn’t find a way to customise this workspace. So I soon switched to a more ‘normal’ workspace. I then got the full access to tools, but trying to use scroll or pinch/zoom gestures in Illustrator often resulted in unwanted paths instead of zooming. Sometimes it would work, but more often than not, it didn’t.
I really wanted to like the Surface. I persevered with it, but every time I ‘gave it another chance’ I just wanted to throw the damn thing out of the window. It may have full desktop apps, but there didn’t seem to be an application that makes the most of it’s possibilities. Then there were the several “Your PC encountered a problem” blue screens. So I gave up on it. Every time I drool over the Surface Studio, I remind myself of my Surface Pro experience:
iPad Pro & Pencil
In contrast to all this, the iPad Pro and Pencil felt absolutely delightful immediately, and it’s mostly down to the Pencil. It’s such a beautiful tool to use – its balanced and luxurious in feel. Drawing seems to flow from the hand in a way that it just doesn’t on the Surface. It still doesn’t feel like a real pen, brush or pencil on paper, but has the best feel of any digital drawing tool I’ve ever used.
The last couple of months I’ve been using the iPad Pro as my main computer to satisfy my curiosity. For me, the key to making this transition is finding new ways of working. These two videos show this in the context of music production and video editing:
“The person who says ‘It’s not possible to be professional on an iPad, in any type of creative everyday lifestyle’, well OK, you’re going to see, because two years down the line, you’re going to be the guy looking into jump in, when everyone is ten miles ahead of you, and your gig is gone.”
So Why Bother?
You may be wondering why I bother, especially when the end result is what matters, not the tool. Why go to the trouble of rewiring my muscle memory, when the current tools work just fine? I have to admit, there is an element of ‘red rag to a bull’ here. Haughtiness and arrogance (or maybe just baiting) like this just make me use it more:
The Verge’s Tom Warren on Twitter
But I do have some more concrete reasons than to contradict journalists who are up themselves…
The input method
The iPad Pro wouldn’t have had any attraction for me if it wasn’t for the Pencil – it’s all about this ‘new’ input method. It feels just right. With a keyboard and mouse my hands are rested and fairly static, but something about designing on the iPad Pro with Apple Pencil and gestures feels a bit like how the graphic design process was when I first started in industry. The Pencil could be a scalpel, chinagraph pencil or Rotring Pen, the iPad surface a paste-up board or draughtsmans table.
“Something about designing on the iPad Pro with Apple Pencil and gestures feels like how graphic design was when I first started. The Pencil could be a scalpel, chinagraph pencil or Rotring Pen, the iPad surface a paste-up board or draughtsmans table.”
It’s becoming instinctive these days. I find myself naturally grabbing the Pencil and thinking “Great! It’s design time!!”. I don’t get quite the same emotion with a mouse or trackpad. Some people saw seen the Pencil as hypocrisy, going against Steve Jobs’ declaration of ‘If you see a Stylus, they blew it’. Well, it isn’t a stylus, it’s a drawing tool. Unlike the Palm Pilots and such of the day, you can happily use the iPad Pro without one, but for art/drawing/painting it’s the right tool for the job. It is in fact, it’s pretty much the tool I’ve been dreaming of for years.
As well as sketching and final artwork, it’s inspired me to try more abstract, freeform drawing too:
This is my version of automatic drawing.
One of the drawbacks of the original Pencil was the lack of connection between it and the iPad, Charging the Pencil was awkward, and Apple didn’t bother to devise any way to keep them together, or store the Pencil’s cap when the Pencil is charging. It was up to the third-party market to come with various solutions, such as the TwelveSouth PencilSnap or repurposing accessories intended for real pens
Fortunately, Apple have solved all that with the latest version – a pencil that attaches magnetically to the iPad and charges it at the same time. How it should’ve been from the start.
Speed & Power
I upgraded my 2013 MacBook Air to a 2017 MacBook Pro this year. While the new space grey Mac looked great, I was soon hankering to use my old Air again. It was lighter, wedge shaped (nicer to type on), with better keyboard feel and built-in speakers, equal performance/battery life and NO TOUCH BAR. I found the Touch Bar all too easy to activate by mistake, and it drove me mad. This was no upgrade.
Instead, I went back to my Air, and I’ve bought one of the new iPad Pro’s, not necessarily as a laptop replacement, but as a laptop upgrade replacement, and I’m so much happier. They are faster, and with longer lasting batteries than all the MacBooks I’ve ever used. Particularly on the latest iPad Pro, FaceID makes waking/unlocking it and logging in to sites almost instant. (I love the way you can double tap the space bar on an external keyboard to open the iPad).
There are some things it can do better
The iPad Pro isn’t all about workarounds and ‘making do’ either. As well as the joy of using the Pencil, there are things I find better than the desktop experience:
- Drawing and photo editing is fast and direct – no lag. There’s no disconnected feel between stylus and it’s result – not even from a thickness in the screen.
- The process of quickly zooming in and out of artwork while working on it is so much quicker and more efficient than anything I’ve experienced on desktop, using keyboard, mouse or trackpad.
- Each app opens automatically in a clutter-free fullscreen view, cutting out other distractions. I’ve set mine up so that I get badge notifications, then all I have to do is swipe up slightly to glance at the dock and see if anything is needing attention and then drop it back down again if there isn’t. I found myself being more productive and focussed on the iPad.
The software is either there or almost there
iOS has come a long way in the last two years. We now have a basic file system, split views, drag and drop, shortcuts and what’s more, professional level apps to use. Why wait for Photoshop to arrive, when there’s Affinity Photo? Who knows how long it will be before Illustrator has an iPad version, but there’s no need, because Affinity Designer is here now.
It might sound like I’m being paid by Serif for plugging their Affinity products, but that’s not the case. Affinity Designer has been such a game-changer for me, and I don’t use that word lightly (or indeed, ever).
The core output of my work can be all done in Designer. I’ve worked on icons, logos, illustrations, layouts, screen and print work in it. Its arrival on the iPad was the catalyst to my curiosity of “can it all be done on an iPad?” and the tipping point of using the iPad Pro for real work.
It has taken a while to get used to – being a lifelong Illustrator user since version 1, there was a bit of a learning curve. Not only a new app, but a new platform with new input methods. However, after working through all their video tutorials I’m getting there. And lifelong niggles that I had with using Illustrator (why can’t the colour sliders stay in HSB rather than always defaulting to RGB?!!) are no longer a problem.
Apps and Workflow
As well as Affinity Designer and Photo, here are the apps I use:
Other drawing tools I use are Linea which I find to be the lowest-friction way to get my thoughts into sketches (I particularly love the icon grids they offer) and Procreate which is the best painting experience I’ve ever had, regardless of platform. I also enjoy using Adobe Draw, with it’s minimal interface. I used this to draw the waves illustration on the oxvik website. Before Affinity Designer, this was my go-to vector app, even though it was more for freehand vector drawing. I never got on with alternatives like Autodesk’s Graphic, Bez or Vectornator.
Affinity Designer has its own easy way to activate fonts, but they’re only active within the app. For system-wide font activation I use iFont, which lets me use fonts stored in cloud services like Dropbox.
For coding I use a mixture of Coda iOS (syncs with the desktop version so that you can use all your sites and clips), Textastic with Working Copy for working with Git repositories.
Writing duties are split between Bear for general notes (it’s replaced Evernote for me), and Ulysses for proper structured writing. The latter is what I’m writing this blog post in (hooray for apps that still support Textile!), as well as a new version of The Icon Handbook (where I’m starting from scratch).
Things is my preferred way to get things done, and they have paid particular attention to detail with keyboard shortcuts and navigation. My one gripe is that the iPad app is a separate purchase from the iPhone.
Client calls are done using Zoom for video conferencing with screen sharing for presenting work. Finally, accounting and Invoicing are done in Xero, which has been a joy after years of using the no-longer supported Billings Mac app.
For other tasks, I have Spark for email, Slack for ‘work chat’ and the default iOS Calendar and Contacts apps work fine for me.
There are many more that I use daily, but it’s these apps that make the iPad a viable platform for me. They all make use of cloud services, although you will find that integration works best with iCloud Drive than third-parties like Dropbox. Where exactly the fault lies for that, I’m not sure.
Shortcomings and Workarounds
I don’t yet see the iPad as a complete desktop or laptop replacement, but it’s getting very close. For now, I use both, with a very particular setup that allows me to switch easily.
As Apple keyboards can only pair with one device at a time, I use a Logitech K831 to get around this issue, and use the same keyboard for both my Mac and iPad. I can switch between either device with simple key press. While I can use the iPad happily without one, an external keyboard transforms the everyday usability of it as familiar Mac keyboard shortcuts become possible.
For instance, I normally use Spotlight or Alfred on MacOS to launch apps. It’s the same here – CMD-Space to bring up search, and start typing. Hit return to launch the first result, or use the down arrow key to select another option. CMD-Tab to switch open apps, and so on. It’s not consistent in Apple’s default apps (there is no keyboard navigation in the App Store for example), but indie apps like Things fully support it. Hopefully, more developers will follow.
For me, the biggest issue to workaround is ergonomics. Looking down at an iPad screen all day will damage my neck and make my head go funny. Using an external screen helps with this, but not in the ‘complete’ way it does for a laptop. More on that in a moment, but first, let me tackle using an external display.
Until I get a fancy pants USB-C monitor, I have a workaround to use my Apple Thunderbolt Display. With a USB-C to USB-A cable, I connect my iPad Pro to the Display, which not only provides power, but the ability to mirror the screen in QuickTime. If you choose ‘New Movie Recording’ from the File menu, the iPad becomes available as a recording source and can be viewed in a window or made full-screen. This works quite well, better than WiFi based solutions like Reflector with only a very small lag.
One odd quirk of this is that the iPad status bar will show the time stuck at 09:41. This drove me mad until I found out that its not a bug, but actually intended behaviour from Apple,. Neither can you turn it off :/
However, while you connect an external display, there are two issues:
- It only ever mirrors the 4:3 iPad Pro display. Some apps offer a ‘second screen’ experience, for example Keynote will show a fullscreen presentation on the external screen, but these are rare. Mostly you’ll be looking at black bars either side. This does at least mean that you can do tasks like email and browsing without craning your neck.
- While so much can be achieved with gestures, keyboard and Pencil, having some form of hovering pointer support when using an external display would make some tasks easier. Text selection is still a bit of a pain in the bum for example. (Although I’ve just discovered Keyboard Text Selection which is joyous).
This type of experience, a mobile device that adapts to a desktop experience with mouse and external screen, is already available in the Samsung DEX. If Samsung can do it, so can Apple.
Lack of Coloursnapper workflow
While the modal nature of iOS apps provides a focussed work platform, it also makes some workflows more complex. Here’s just one example:
As I’m colourblind, I need to know the hue value of any colour that might be on the screen. The numerical value is how I can be sure if it’s blue or purple, green or brown, that I’m looking at.
On the Mac, sampling colour is easy with Coloursnapper – cmd-shift-c launches the loupe, immediately telling me HSL values. On the iPad, it’s more drawn out: Take a screenshot > open it up in an app like Cone or Affinity Designer > select eydropper tool and get values. I’m sure I could setup a Siri shortcut to speed this up a bit, but when all I’m doing is trying to do is be sure what a colour is, it’s obstructive.
Web Development & UX Design
There’s a lot you can do in terms of coding on the iPad. I have edited websites and documents in Coda and Textastic, and then cloned and pushed changes in Git using Working Copy. There’s a lot that is more painful though:
- Web inspection has yet to be solved properly on iOS. Textastic give you access to a preview with Firebug, but it’s a fiddly interface that hasn’t been optimised for touch. Separate inspector apps available, but these I’ve been nervous about shelling out for these when desktop tools are free as part of the browser. Please let me know if you have any experience with these. (Update: Jared White recommends Inspect Browser recommended – so I will give that a try!)
- While the iPad provides enough develpoment possibilities enough for me (someone who is only using HTML CSS and JS) the sandboxed nature of the OS means you can’t run a local web server. You can SSH or FTP into a remote webserver, just not run anything locally.
- Likewise, UX prototyping hasn’t been solved either. There is a chance that the browser-based Figma might work in the future, but there is no sign of that being their intention (yet). You can use Marvel to create an interactive prototype using screenshots of your designs, but nowadays designers expect to be able to design and create interactive mockups in the same app. I don’t think it will long before the first Sketch-like apps arrive though, it feels like momentum is gathering.
Finally, optimising images for the web is lacking , I haven’t yet found a good app solution on iOS yet. (Update: Daniel Wilson pointed me to the excellent website Squoosh which works great. Load it in a split view with files on one side, and you can drag and drop files with ease).
Using it on your lap
Unlike a laptop, which can easily open at any angle, the iPad Pro isn’t so adjustable right out of the box. Accessories like the Smart Keyboard can help here, but they only provide 2 possible angles – both too steep for drawing on. On my desk I use a DraftTable stand which gives the sturdiest drawing angle, but is too heavy for use on your lap. The Brydge Keyboard may be the solution here, but I don’t know how firm the angle can be fixed at – whether it’s sturdy enough for drawing on. The search is ongoing for the right solution here.
It’s been said many times before, that the iPad Pro’s limitations are set by iOS, rather than the hardware, so it’s all fixable by Apple. In my opinion, it wouldn’t take much for the iPad to truly replace my Macbook.
It feels like we’re this close to the tipping point.
Twelve South PencilSnap
So, my previous attempt at keeping my Apple Pencil with my iPad Pro only lasted a few months. The loop became so loose that I lost the Pencil at Stansted Airport and had to buy another one! When I mentioned this on Twitter, Twelve South kindly offered to send me a PencilSnap to review. After a few weeks of testing, here’s my findings.
The results are very positive – the PencilSnap holds the Pencil really tightly and it does indeed ‘snap’ onto the Smart Cover making it a simple and effective solution. It doesn’t prevent the smart cover from getting into either position (something previous solutions did), but can be easily removed when placing the iPad flat.
The one very slight negative is that it holds the Pencil a little too tightly, to the extent that it can take quite a bit of effort to pull it out of the holster. I did think it would loosen with use, but it hasn’t yet. Better that way of course! You could also say that £26 is a little expensive for what it is, but after having to spend £99 on another Pencil it doesn’t sound unreasonable.
When doing the ‘JUST WANG IT!” test in the office, I managed to get the PencilSnap to come off the cover and the Pencil fly out. This was an extreme test though, and this high level of wanging would never be replicated in day to day use.
Like most of Twelve South’s products, it’s the kind of solution that Apple should’ve come up with. If I had one criticism, it’s that it detaches quite easily when stowing your iPad in a bag.
Found in the woods
So far with my iPad Pro + Pencil, I’ve been working mainly in vectors. Adobe Draw is a fantastic app for this hardware and it means I can create resizable artwork. I do a lot of ‘pencil sketching’ in Adobe Sketch but so far no actual bitmap painting, so it was high time I had a go with Procreate. Taking an iPhone snap I took on a dog walk over the Christmas break, I sampled colours from the photo to create the missing parts of a large woodland creature that the original image (below) hinted at…
App Icon changes in iOS7
The latest version of iOS, the ‘kinda funny lookin’ iOS7 is almost upon us, and if you haven’t already started working on it, here’s an overview of the changes…
First of all, the Application Icons are now slightly larger:
- iPhone: 120px (retina)
- iPad: 76px (iPad 2/iPad Mini) and 152px (iPad 3)
As iOS7 only works on retina iPhones, you don’t need to supply a 60px version, just a 57px one for apps that will also run on iOS6 or earlier.
The corner radius has changed too – where previously it was based on the original iPhone non-retina icon (10px on the 57px icon) its now a mystery. Mani have a really in-depth investigation to discover the formula for the new radius, but my personal advice is not to worry about it. Make sure you don’t have any design element around the edge, such as a border, that relies on it. Just place a mask on a layer above to give you the rough idea, and carry on supplying your icons with square corners.
Style, or the lack of it
There’s been a lot of talk about Grids and Golden Ratios – my advice is to not to worry about these too. By all means use the grid as a starting point, but don’t feel bound by it.
Apple’s new iconset is inconsistent, and ranges from the basic (Calendar) to shockingly immature (Game Center). I didn’t pass any comment when iOS7 was first announced as I believed that the designs would take evolve and mature. They haven’t though. When I compare it to my Windows 8 phone, with its clear, bold and consistent icon style, I just sigh.
Sorry, this isn’t meant to be a rant! Safe to say, I’m “not a fan”.
Finally, ‘prerendered’ no longer exists as an option – iOS7 has removed the gloss overlay for all icons, so if this was something you wanted in your design, you will need to add it to your artwork.
- iOS7 Design Cheat Sheet - a very comprehensive reference of all new sizes (I haven’t had time to update The Icon Handbook reference yet!)
- New Metrics for iOS7 App Icons - Great tips on App Name length which is more of an issue in iOS7
- Marc Edwards PSD Templates
- Sketchmine Sketch.app Templates
- iOS6 and 7 visual comparison
Hicksdesign recently created a new application icon for PlanGrid, an iPad app for storing and viewing blueprints for the construction industry. Even though blueprints aren’t actually blue these days, its such a familiar piece of imagery that it couldn’t be ignored as a metaphor.
The final design followed the original quite closely (see right), retaining the simple image of a white pictogram on a blueprint background. Instead of the magnifying glass, a stylised version of the loupe was used instead, and construction lines and folded paper effects were added on.
A variety of options were explored, using various magnifying devices and architectural symbols. Here are the vector sketches:
As well as trying out a characterisation of their software, known as ‘GridBot’:
The idea that was most liked however, was the loupe:
The hatched version lost too much impact at smaller sizes, so in the end, the solid version won. xScope mirror was then used to help preview the artwork on devices as I worked. This was particularly useful for getting the stroke weights correct on retina displays, and for testing colour. The blue needed to be much more saturated on iOS than on my desktop screen.
Updated iOS Application Icon Ai Template
Sorry its taken a while to get around to this, but I’ve finally updated the iOS Application Icon Template for Illustrator to include the new Retina sizes for iPad 3:
Part of the delay was me trying to include all the document icon sizes as well, but these were more complicated, and I’ll do a seperate template for these when I can. The update includes the whopping 1024px size required for the App Store on iPad 3.
I’ve not updated the guides and masks layer to use the super-accurate corner radius. As before, treat this layer just for preview, and hide it before exporting to PNGs. Your exported file should have sharp, not rounded, corners. I recommend using Matthew Ericson’s export script to export the artboards to PNGs. The artboards are labelled following the Apple guidelines, so as long as you don’t add a prefix or suffix, the filename should be right!
⬇ Download the Template
There shouldn’t be any catastrophic errors, but if you notice anything odd, please let me know!
App, app and away!
I’ve finally submitted my first iOS app to the iTunes App Store! A joint project with Simon Whitaker of Goo Software, the title on the top of the window might hint as to what the app is about. If the app gets approved (don’t know of any reason why it won’t but you never know) there’ll be a detailed post to come…
LiveView for iPhone and iPad
If you’re designing anything that’ll be viewed on either the iPhone or iPad, you’re going to find LiveView a godsend. It’s been out a couple of years, but I only discovered it this week.
It comes in two parts – a Screencaster app for your Mac, and a companion app for the iPhone/iPad. As you work on the graphics, you can view it live on the device. An essential, and free tool. I shot a quick video on my iPhone to show how it works:
So far, it only seems to be lacking an option top use it in landscape mode.