small_Fcsqb5pWQAAzPIK.jpeg

thumbnail_Fcsqb5pWQAAzPIK.jpeg

Adobe acquires Figma, cue the memes 🤪

large_Crossover Series NFTs.png

medium_Crossover Series NFTs.png

small_Crossover Series NFTs.png

thumbnail_Crossover Series NFTs.png

From Photography to NFT Art: Twisted Digital Landscapes with Nate Hill

Still can’t get a UX job? Give up.

large_featuredImage

medium_featuredImage

small_featuredImage

thumbnail_featuredImage

Sticking to UI/UX trends is a losing strategy

Published on <a href="http://ift.tt/2nrk2qa">| Prototyping: From UX to Front End &mdash; Medium</a> Founder 
<blockquote>TLDR: As a UX director, founder and occasional advisor to startups and VC firms I’m often sourcing design talent. Sketch and InVision are the staples of today’s modern iOS mobile visual designer. However, I advise visual designers wanting to push the boundaries of their skillset to learn parametric design and how to code their animations (or find tools that enable them to do so).</blockquote>
<h4>Assets</h4>
If you aren’t creating parametric assets for iOS; you’ll be out of fashion as a visual designer in 5–10 years. It’s a real drain on your time and a lose/lose situation with your devs if you dole out PNGs. The ideal iOS mobile designer knows how to design in resolution independence. There are tools like PaintCode to help you visually design if (like me) you aren’t insanely swift in Swift or Android Java.
<img alt="" src="http://ift.tt/2nrorct">PaintCode Screenshot
One of the perks of a tool like PaintCode is a neat little feature called ‘Telekenesis’. It’s a satisfying tool that allows you to design in their app and have changes reflected instantly on an iOS app, live. If you feel their documentation isn’t quite targeting you as a visual designer, don’t worry, there is hope. <a href="http://ift.tt/2mHbLQh">I hear they’ve got a new series for ‘power users’</a> and maybe even <a href="http://ift.tt/2n8djy4">Chris Slowik</a> at designers.how can get a lesson going in this?
“Wait!” you say. “Are you telling me I’m a mobile iOS visual designer and have to learn Swift and open Xcode?!”
<img alt="" src="http://ift.tt/2nrgeVP">Harsh realities!
I don’t think you can get away with not knowing the fundamentals of Xcode and Storyboard anymore as an iOS visual designer. And it’s not as bad as it sounds. You should be panicking when I say “Framework” ?! Play <a href="http://ift.tt/2fa7tfC">with this template</a> and your world will be forever changed as an iOS designer if you aren’t familiar with parametric design. I don’t know Javascript that well and my HTML skillz are confined to responsive, Litmus loving email templates only — so if I can do this, you can do it too.
<img alt="" src="http://ift.tt/2n8b51w">PaintCode with Telekinesis and the beginnings of a cat profile on the right.
<h4>Prototyping</h4>
This might surprise some people, but I’ve been using Flinto over every other mobile prototyping product since <a href="http://ift.tt/2nrkJzE">Nathan Manousos</a> just had the web app. When Flinto came out it was light years ahead of the competition and insanely intuitive. The newish desktop app is a perfectly fast and light prototyping tool evolved from the web app and crafted with considerable care. You don’t pull in <a href="http://ift.tt/2hBn1HY">Peter Nowell</a> for your iconography if you don’t take visual design seriously.
<img alt="" src="http://ift.tt/2nreiwB">This was built with an earlier version of Flinto for Mac
If you’re testing your designs with users up front you don’t want to bring a developer to the table (if that sounds too waterfall for you, I’d be remiss to point out that Mona Lisa wasn’t done in agile). You want something quick and dirty and Flinto can hand that to you in spades. When getting feedback you want a tool that mimics a real mobile app as closely as possible, and even gives you the power to do micro interactions when you’re ready for them. I just don’t know of any other prototyping tool on the market that has Flinto’s desktop power and flexbility.
<img alt="" src="http://ift.tt/2n8lsT9">Flinto
InVision is great, Kite looks cool, and Marvel always has their game on…but my bias will always be towards having 1) a desktop client 2) a prototyping tool that presents entire flows instead of just micro-interactions or transitions. Remote testing and adjusting isn’t fun when you’re reliant on your cell signal working with a web based prototyping tool.
<img alt="" src="http://ift.tt/2nrpysV">VCs
I’ve actually recommended Flinto to a prominent Boston based VC firm last year after an assessment of every major prototyping tool (I looked at around 20) so I’m serious about this tool.
<h4>Animation</h4>
Micro-animations are a must these days. Ideally designers can export code and test their animations on a real app. If you’re like me and it’s just a bit too much to ask to hand code animations in Swift…QuartzCode or the Squall AE Plugin is the way to go. QuartzCode is very easy to pick up and is very designer friendly with a timeline element that will remind you of Hype. Squall requires a bit more bravery if as a designer you aren’t comfortable with Swift. I’m kinda suprised Squall hasn’t taken off as it’s been around for a while now…weird.
<img alt="" src="http://ift.tt/2n8coh1">
Facebook and AirBnb both have platforms that help in motion design but I’m not converting just yet because (as it relates to Lottie) if I’m not mistaken the newest contender is missing: trim offsets, gradients, repeaters, text layers, text animations and the ability to preview right on your iOS device. Squall also evaluates expressions at runtime allowing you to make your animations interactive and that includes 3D Touch so&#8230;?
<img alt="" src="http://ift.tt/2nrkapq">Simple Parametric Animation in PaintCode
Maybe it’s the PTSD from <a href="http://ift.tt/15DzGzK">the old 50 MB cell download limits of yore</a> but there’s something really rewarding about not passing off huge APNGs to developers and providing something clean and light. If you still insist on animating PNG in code, QuartzCode handles that as well (or try Core Animator). The above QuartzCode illustration was intially done with PNG base assets because I was creating angular gradients (generally a no-no in iOS) but later found a way around it. That dropped my file size from 50MB to under 1MB.
<img alt="" src="http://ift.tt/2n85mca">Huzzah for Small Files!
<h4>Conclusion</h4>
Since mobile design has exploded over the last 10 years there are a glut of designers on the market. All you need are a few tools to set yourself apart as a visual designer IMO: PaintCode/Flinto/Quartzcode and Squall. It also helps when looking for your next gig to ask if your developers are comfortable with handoff from these tools. The more designers and developers use these tools, the more money is pushed into their development.
<iframe src="http://ift.tt/2kZ4o5P" width="800" height="400" frameborder="0"><a href="http://ift.tt/2lIYHWK">http://ift.tt/2lIYHWK</a></iframe><img src="http://ift.tt/2nrprgP" width="1" height="1" alt="stat?event=post.clientViewed&amp;referrerSou">
<hr>
<a href="http://ift.tt/2n8dlWI">My Ideal Visual Designer Stack for iOS/Mobile</a> was originally published in <a href="http://ift.tt/2cAqCpx">Prototyping: From UX to Front End</a> on Medium, where people are continuing the conversation by highlighting and responding to this story.

My Ideal Visual Designer Stack for iOS/Mobile

My Ideal Visual Designer Stack for iOS/Mobile

Top Stories