Under the Radar

Under the Radar 10: Designed by a Programmer


00:00:00   welcome to under the radar or show about

00:00:02   independent app development I'm Marco

00:00:04   Arment and I'm David Smith under the

00:00:06   radar is never long within 30 minutes so

00:00:08   let's get started

00:00:09   so this week we wanted to talk about how

00:00:12   you can be kind of like us independent

00:00:14   developers who work for yourself without

00:00:16   having a full-time designer or trying to

00:00:19   minimize how much of a designers time

00:00:21   you need because oftentimes people who

00:00:24   are working for themselves can't afford

00:00:27   a full-time designer or much design at

00:00:29   all from up from other people and

00:00:31   sometimes even when you can afford it if

00:00:33   you're working on on like a small app or

00:00:36   you need to get something out quickly or

00:00:37   you're not sure of the market of

00:00:39   something you often want to keep your

00:00:41   expenses on that app very low and it's

00:00:43   often hard to justify having a full-time

00:00:46   designer or or having lots of hours from

00:00:48   a contract designer helping you out

00:00:50   there so we kind of wanted to talk about

00:00:52   the reality and process of being a

00:00:56   programmer who kind of designs it kind

00:00:59   of does your own design or and and

00:01:01   having how that works out and then other

00:01:04   things later on about things like how

00:01:05   you can do programmatic style assets

00:01:07   versus static assets in your apps so

00:01:10   David what's what is your experience

00:01:12   been with with design for your apps so I

00:01:15   do most of the core design of my apps

00:01:21   myself which is definitely it isn't it's

00:01:24   a it's a mixed bag in terms of what that

00:01:26   ends up doing but for the reasons you

00:01:29   just outlined like I it's a hard thing

00:01:31   to hire a designer

00:01:33   especially I find refer like at the

00:01:36   first app or like the first version of

00:01:37   the app which is a little bit backwards

00:01:39   in some ways but for the way that I make

00:01:40   apps

00:01:41   I never know if the app I'm making is

00:01:44   going to be worth putting a lot of time

00:01:47   and energy and resources into and so for

00:01:48   a lot of my apps like the first version

00:01:50   is just a couple weeks of work and like

00:01:53   the concept of hiring a designer even

00:01:55   just like the time overhead if you know

00:01:57   like the cost aside if I could find a

00:01:59   really inexpensive designer like the

00:02:01   cost overhead in terms of time of going

00:02:03   back and forth and trying to underlie

00:02:05   k-- getting everybody on the same page

00:02:07   and then waiting for the assets and

00:02:08   doing all that like it doesn't work as

00:02:10   well for me and so I tend to just sort

00:02:13   of

00:02:13   hope for the best and design things and

00:02:17   you know the result is maybe it's a bit

00:02:19   mixed but and what I find though is at

00:02:23   least like once you get if you haven't

00:02:24   once you have some experience designing

00:02:26   apps like the core design questions I

00:02:29   guess this would be the UX design I'm

00:02:32   not really as familiar with the terms

00:02:33   all the different like UI us don't email

00:02:35   us and like graphic design maybe other

00:02:39   three kinds of design I don't know like

00:02:41   the making an app that sort of like

00:02:43   works right and function is functional

00:02:45   and intuitive that part I think I have a

00:02:48   good handle on and I can make apps that

00:02:50   do that they just tend to not be pretty

00:02:52   and in general I found that people are

00:02:55   pretty forgiving about things not being

00:02:56   pretty they rather it be functional and

00:02:59   so you can kind of get away with a lot

00:03:01   more than you may otherwise have and

00:03:04   definitely this has been a lot easier

00:03:05   since people don't expect apps to be

00:03:07   pixel perfect anymore like it's there

00:03:10   was a time when it was really hard if

00:03:12   you app didn't have like the crazy

00:03:13   textures and everything is just aligned

00:03:15   just so like you know right now you're

00:03:18   building an app that has to be let's see

00:03:21   it's pretty 4s sized iPhone 5 size

00:03:24   iPhone 6 size iPhone 6 plus size then

00:03:29   you have iPad you have 1x iPad and 2x

00:03:32   iPad and iPad pro and so like it's your

00:03:36   design has to scale to everything anyway

00:03:38   and so you can be you can get away with

00:03:40   that feel like in some ways a lot more

00:03:41   because you're trying to design

00:03:43   something more fluid anyway like in some

00:03:45   ways it's more like a web design you

00:03:47   know now whereas before it was this this

00:03:49   very like texturally in graphically rich

00:03:52   style in like the the iOS 6 and earlier

00:03:55   days and and then since the iOS 7 style

00:03:59   UI with you know all these clean flat

00:04:02   colors and thin text everywhere and lots

00:04:04   of white space I think it has shifted

00:04:06   more into what Web Design kind of always

00:04:08   was where you know you you because you

00:04:12   have to design for so many screen sizes

00:04:14   and be ready to adapt to new ones that

00:04:16   might come out that we don't even know

00:04:17   about yet now you you are kind of forced

00:04:19   to make things simpler and more reliant

00:04:21   on like text flow and stuff like that

00:04:24   and and less about it these giant

00:04:27   images and and also those your

00:04:29   out-of-style now which has been such a

00:04:31   huge benefit to people like us who don't

00:04:34   have or can't afford full time design

00:04:37   help it's been a huge boon for us yeah

00:04:41   but I think of course it probably ends

00:04:43   up with meaning that me we become much

00:04:45   more reliant on I feel like there's a

00:04:48   certain I don't really know where I

00:04:50   learned these and I think you actually

00:04:51   have a better handle on these some

00:04:53   people ask you but like there's certain

00:04:55   seem like there's a certain basic set of

00:04:57   like rules about layout about how you

00:05:01   structure like typography or the white

00:05:05   space of a page and to make it like look

00:05:08   right and when it isn't it at least at

00:05:11   this point now I have enough of a sense

00:05:13   of it like I don't necessarily know why

00:05:14   it's wrong but I know it is wrong and I

00:05:17   picked that up just as you go but like

00:05:19   once you like it's more important in

00:05:21   some ways because things aren't pixel

00:05:22   perfect you just have these basic like

00:05:24   elements of good design under your belt

00:05:27   and this isn't I notice in all of your

00:05:29   apps like as you've gone there always

00:05:30   seems to have that nice clean sharp look

00:05:33   where do you think you learned to do

00:05:35   that well I mean there's these different

00:05:39   parts of design right so there's like

00:05:41   there's the the like graphical artistry

00:05:43   part of it and that's things like

00:05:45   textures things like designing like rich

00:05:47   icons stuff like that that part I have

00:05:50   never been good at and I probably never

00:05:52   will be good at and I'm okay with that

00:05:54   that part I'm happy to outsource and and

00:05:58   pay whatever it takes to get you know a

00:06:00   great app icon made you know if I need

00:06:02   if the textures ever come back in style

00:06:04   I hope they don't they probably

00:06:06   eventually will and you know then I'll

00:06:09   Karzai bridge when I come to it because

00:06:11   that will basically drive my costs up

00:06:13   substantially but it's alright you can

00:06:16   just have retro apps that are without

00:06:18   without texture you just be retro it'll

00:06:20   be fine yeah it will always become an

00:06:22   effect rather than this is what people

00:06:24   do but you know I think you know so

00:06:28   there's different parts of design the

00:06:29   graphical stuff I really can't do but

00:06:31   the rest of it as you mentioned like the

00:06:34   you know the rest of what you you

00:06:35   encounter are most apt design things

00:06:36   like layout basic text and type

00:06:40   agra fee you know spacing that I've just

00:06:44   kind of slowly developed my own

00:06:46   sensibilities for that over time by you

00:06:49   know starting some of it started in web

00:06:51   design but also just like just kind of

00:06:53   paying attention and developing a feel

00:06:55   for it over time which is totally

00:06:57   unhelpful like that I know I recognize

00:06:59   like if you're listening and trying to

00:07:01   figure you know trying to answer the

00:07:02   question of like how do I become

00:07:03   familiar with the basics of design like

00:07:05   I don't know I can't tell you that

00:07:07   there's probably some decent books about

00:07:09   it that are made for for this purpose

00:07:12   I'll try to find them and put them the

00:07:13   show notes if I if I can but I I just I

00:07:17   haven't gone that pad I've just kind of

00:07:18   slowly developed a sensibility by just

00:07:20   like kind of paying attention to

00:07:22   designers and to design even though I'm

00:07:25   I've never really been trained as a

00:07:26   designer or consider myself one and a

00:07:29   lot of it is just like kind of like you

00:07:31   know what when you see it you know like

00:07:32   when when you lay something out in a way

00:07:35   that is visually pleasing like you

00:07:38   yourself will notice that this looks

00:07:40   good

00:07:40   in most case you know like it because

00:07:43   you are also a Burres and you were also

00:07:44   a user of this app so you kind of like

00:07:47   play with it following some basic

00:07:50   principles you can kind of play with it

00:07:51   and work it out until until it looks

00:07:53   really good but what you said is also

00:07:54   correct like people are very forgiving

00:07:56   of this I mean god help you if you ever

00:07:59   look up a screenshot of Instapaper 1.0

00:08:01   it like it to some degree in many cases

00:08:06   it doesn't matter as much as people

00:08:07   think it does design is kind of like

00:08:10   good marketing where it is really nice

00:08:13   to have if you want if you if your app

00:08:16   is going to become big and successful

00:08:18   you probably need good design but you

00:08:22   can you can you can get an app out there

00:08:24   and you can start building a market for

00:08:26   yourself without having professional

00:08:28   quality design it is not it is not like

00:08:31   a strict requirement for success and and

00:08:34   in many cases in many markets especially

00:08:37   like the the more narrow the market gets

00:08:39   the more specialized or professional a

00:08:41   market gets the less design is valued or

00:08:44   the less it matters and so if you're

00:08:46   making an app like you know for somebody

00:08:49   to get their job done and you know it

00:08:51   basically needs like four buttons and a

00:08:53   text field

00:08:53   you know that then like it doesn't

00:08:55   really matter to a lot of it like it

00:08:57   whether that's really pretty or not it's

00:08:59   probably not going to affect your

00:09:01   success in in in that narrow market as

00:09:03   much as much as it would in like a mass

00:09:06   consumer photography app say you know so

00:09:08   it really depends on what you're making

00:09:09   and how much this is worth but

00:09:11   ultimately you know good design

00:09:13   something that if you can do it you

00:09:14   should do it and if you can't afford it

00:09:16   you should do it in almost every case

00:09:19   but that could be very expensive I mean

00:09:22   like you know like hiring a professional

00:09:23   designer could cost hundreds to

00:09:27   thousands of dollars per day of their

00:09:29   work and and it's really it can be it

00:09:33   adds up so quickly it just just to get

00:09:36   an app icon made you can get a an okay

00:09:40   icon made for a few hundred dollars to

00:09:42   get a great icon made might cost a few

00:09:44   thousand dollars I mean again this it's

00:09:46   this is big money we're talking about

00:09:47   for for independent programmers like

00:09:50   because most designers most of their

00:09:52   work comes from corporate clients so so

00:09:55   you have to build in all these high

00:09:56   prices you have to you have to account

00:09:58   for how much of a pain corporate clients

00:10:00   are to deal with how much overhead

00:10:02   you're going to have for every billable

00:10:03   hour that you can actually get paid for

00:10:05   you have to account for all that and

00:10:07   price things accordingly whereas you

00:10:09   know when you're independent hiring an

00:10:11   iron your designer these prices are

00:10:13   often out of reach so you know it does

00:10:15   help to familiarize yourself with the

00:10:17   basics of design or to hire a designer

00:10:19   you know for for the stuff that really

00:10:22   matters like your app icon and and you

00:10:25   know maybe like a once-over if your main

00:10:27   interface but not to have somebody that

00:10:29   you're like paying every single day or

00:10:30   every single month ongoing so it depends

00:10:34   it depends a lot on the people you can

00:10:35   find you know if you can find a great

00:10:37   designer who will take on your work for

00:10:40   a price you can afford great that's

00:10:42   awesome

00:10:43   you know but I I have found that to be

00:10:44   very difficult most of the time myself

00:10:46   yeah because I think the difficulty

00:10:48   there is it's the best designers like

00:10:52   are like if you're not paying them well

00:10:56   then you they're kind of ripping them

00:10:57   off like it's like right

00:10:59   Vic that's the nature of like there

00:11:00   really is like if they really are that

00:11:01   good then they should be in some ways

00:11:04   like they they should be we know well

00:11:06   paid for their work and doing

00:11:07   you know and doing that probably with

00:11:10   both clients who can do it and so you

00:11:13   end up with kind of a lot of you know

00:11:15   for small independent apps you just

00:11:17   doesn't yeah economics just don't tend

00:11:19   to work out and in some ways you're

00:11:21   probably better off

00:11:23   it's like rather than spending that

00:11:25   money on the design that design it's

00:11:29   like I don't even know like training

00:11:30   buying yourself books or spending the

00:11:32   equivalent amount of time that you would

00:11:34   have spent in money just trying to

00:11:37   practice and get better at your but edit

00:11:39   yourself because that's certainly a

00:11:40   skill that isn't going to like go out of

00:11:44   use or become useless to you that if you

00:11:46   are effective here once you get having a

00:11:48   stronger sense of design that's only

00:11:51   going to help your programming that's no

00:11:52   I'm not going to and ever come back to

00:11:55   invite you to be like oh no now you know

00:11:56   too much about design like your apps are

00:11:58   getting worse like it's it's a good

00:12:00   thing to invest in if you in like if you

00:12:02   can afford it great but I mean you're my

00:12:05   guess is you're probably then either

00:12:06   working for a bigger company or I just

00:12:10   somehow very wealthy I suppose yeah I

00:12:12   mean you know you could you can look at

00:12:14   it also as like you know can you afford

00:12:15   any other kind of staffing or help like

00:12:17   if you can afford to pay other

00:12:18   programmers to be with you to to help

00:12:21   make bigger and more complex apps then

00:12:24   the cost of a designer relative to other

00:12:25   programmers is very reasonable yeah but

00:12:28   you know it but if you like if the idea

00:12:29   of paying another programmer to help you

00:12:32   out is completely out of reach because

00:12:33   the economics aren't working out it's

00:12:35   probably also going to be challenging to

00:12:37   paid to pay a designer anyway in in much

00:12:41   less expensive news we are sponsored

00:12:42   this week by hover hover is quite simply

00:12:46   the best way to buy and manage domain

00:12:48   names and it costs way less than hiring

00:12:50   a full-time programmer or designer now

00:12:52   when you have an idea for a project

00:12:54   naming it can be difficult once you

00:12:55   finally get that name you want to be

00:12:57   able to quickly and easily get the

00:12:58   domains you need however provides a

00:13:00   simple fast and hassle-free method of

00:13:02   buying domain names it is very easy to

00:13:04   search for new domains search for the

00:13:06   means that are available you enter the

00:13:07   phrase you want or some keywords if you

00:13:09   don't know an exact name and they will

00:13:11   find available matches for you and show

00:13:13   you a list of all the crazy new TLDs

00:13:15   that are available with that name they

00:13:16   have of course you know the nice old

00:13:18   ones ComNet and all the stuff but they

00:13:21   also have all the

00:13:21   crazy new ones dot Plumbing dot coffee

00:13:23   dot sexy if you go that way all these

00:13:25   TLDs they have recently lowered their

00:13:27   prices on pretty much all of them

00:13:29   so dot-com domains are now just 1299 a

00:13:32   year and all this includes

00:13:34   free who is privacy for all their

00:13:36   domains they believe that you should not

00:13:38   have to pay extra to keep your private

00:13:39   information private and they have

00:13:41   fantastic customer support if you ever

00:13:43   need it hover offers a no hold no wait

00:13:45   no trends for telephone support policy

00:13:47   they are famous for this and there's a

00:13:49   good reason why when you call them you

00:13:51   talk to an actual human being there's no

00:13:53   robots no menus but if you do prefer

00:13:55   robotic communication they also have

00:13:56   great support documents and guides on

00:13:58   their website for getting everything you

00:13:59   need as well as email support if you

00:14:01   need that and I don't forget their hover

00:14:03   valet service where if you want if you

00:14:05   if you have a bunch of domain somewhere

00:14:06   else or just even just one any number

00:14:09   that means if somewhere else you want to

00:14:10   transfer them over to hover they will if

00:14:12   you want do the whole transfer for you

00:14:14   because I've never met anybody who said

00:14:17   you know what I love doing domain name

00:14:18   registration transfers no not a single

00:14:20   person ever wants to do that

00:14:22   hover will do it for you if you want

00:14:23   it's fantastic there's so much great

00:14:25   stuff at hover check it out today go to

00:14:27   hover comm to try them out use code

00:14:29   Swift at checkout and you'll get 10% off

00:14:32   your first purchase at hover comm and

00:14:33   show your support for under the radar

00:14:35   and all of real AFM thank you so much to

00:14:37   hover use code Swift to check out for

00:14:39   10% off thank you so much for sponsoring

00:14:41   this episode

00:14:42   alright so I think the next thing that

00:14:44   we wanted to dive into a little bit is

00:14:47   the something that I know I think I know

00:14:50   you I've heard you talk a lot about this

00:14:52   and it's something that I know I've

00:14:52   started doing a lot more of my own apps

00:14:54   is once you have your design and this is

00:14:57   especially for the graphical assets in

00:14:59   your app so like you know button icons

00:15:01   or images of any kind like there's you

00:15:06   can either pre render that image so it's

00:15:08   like have it come out of Photoshop or

00:15:10   illustrator or whatever design tool

00:15:12   sketch whatever it is that you're using

00:15:14   rendered out as a PNG put that PNG and

00:15:17   well I will put all three of the PNG s

00:15:18   like the 1 X the 2 X - 3 X version of

00:15:21   that asset and add it to your project

00:15:23   and bundle it in that way or you can

00:15:26   programmatically generate it either as

00:15:29   like in the draw rect of a uiview or

00:15:32   generating an image that you put in a UI

00:15:34   as you turn into a UI image and I know I

00:15:39   think we've both been on the path

00:15:41   towards less and less static assets and

00:15:44   more and more programmatic assets and so

00:15:47   it's probably something that's worth

00:15:48   talking about some of the reasons why we

00:15:50   do that oh yeah I mean like for me

00:15:52   static assets are a liability for future

00:15:55   work because anything any kind of image

00:15:58   like you know it let's suppose I hire a

00:16:00   designer to to make like toolbar icons

00:16:02   in my out which I've done before and

00:16:03   it's often worth doing

00:16:05   so I have these toolbar icons and then

00:16:07   Apple comes out says oh by the way you

00:16:10   know there's gonna be a new iPad

00:16:11   resolution it's now gonna be iPad at 3 X

00:16:13   then you need new versions of those

00:16:15   icons that can that can be rendered at

00:16:17   Brendan at 3 X you can attempt to do it

00:16:20   yourself

00:16:20   but generally you won't have like a

00:16:23   source vector file you will you will

00:16:25   have like a stack of PNG so the designer

00:16:27   gave you when you paid them 2 years ago

00:16:29   and so you can try to make it or resize

00:16:33   it yourself it'll probably look bad you

00:16:35   probably shouldn't do that so oftentimes

00:16:37   you have to then go back to the designer

00:16:39   and pay for even more of their time for

00:16:41   them to do something that's really very

00:16:42   trivial that they probably don't even

00:16:43   want to do because that's pretty pretty

00:16:45   uninteresting work you know dig up old

00:16:47   files and rerender or something out as a

00:16:49   different resolution and everything so

00:16:51   it's it's this kind of clunky procedure

00:16:54   that like if you rely on the on

00:16:55   graphical assets that are baked into

00:16:58   static images you have all this

00:17:00   liability whenever the technology

00:17:02   changes under you or what if you just

00:17:03   want to tweak the design like what if

00:17:05   you want to make all the line widths you

00:17:08   know half a pixel narrower in the next

00:17:10   version of in the next design it that

00:17:12   becomes very difficult if you if you're

00:17:14   if you just have a bunch images and you

00:17:15   have to like rerender all this assets

00:17:17   out on the other hand if you have all

00:17:20   those images and stuff there's a lot of

00:17:22   upsides to that your app first of all

00:17:24   will load faster because you won't have

00:17:26   to be like drawing these things every

00:17:27   time you know certain certain art styles

00:17:31   are only really possible in static

00:17:33   images and become pretty impractical to

00:17:35   impossible to recreate with like quartz

00:17:38   drawing commands in a draw rect function

00:17:41   so the

00:17:43   there are there are definitely advantage

00:17:44   to disadvantages generally speaking

00:17:46   programmatically generated images make

00:17:49   your app bundle very small this is one

00:17:50   of the reasons why overcast is only

00:17:51   something like seven Meg's it's a very

00:17:54   very small iPhone because I have almost

00:17:55   no images in it almost everything that

00:17:57   overcast is generated procedurally so it

00:18:00   makes your Apple very small it makes it

00:18:02   very easy to adapt to new devices and

00:18:04   new sizes but it also but but static

00:18:06   images almost certainly will load faster

00:18:08   there's also like the OS will cache them

00:18:11   any kind of like UI image image name to

00:18:14   call like those kind of things that

00:18:15   cache the GPU will cache certain things

00:18:17   the framework for cache certain things

00:18:18   so generally speaking for for speed of

00:18:22   operation you want static images but for

00:18:26   for ease of programmer work

00:18:29   programmatically generated stuff can be

00:18:31   a lot easier and I think the biggest

00:18:33   thing too is with programmatic it's it's

00:18:36   there's even like probably just the feel

00:18:38   of like the philosophy of it of making

00:18:40   sure that like what you're say the

00:18:42   biggest thing that I think you're

00:18:43   pointing out is if you're your art

00:18:46   assets need to be right are ideally in

00:18:49   some-some format that you're going to be

00:18:52   able to scale and adjust and re-render

00:18:55   later at the very least right if you if

00:18:59   you are using a completely like if

00:19:01   you're if you have a designer or even if

00:19:03   you're in with yourself like if you're

00:19:04   going to if you're just building things

00:19:07   in such a way that you cannot just

00:19:09   easily scale them up and down like

00:19:10   keeping them having vector artwork in

00:19:14   Photoshop or illustrator or sketch or

00:19:16   doing it in some way like that that you

00:19:18   can scale up and down it's yeah it's a

00:19:20   ticking time bomb for at some point

00:19:21   you're going to need something different

00:19:24   like there was a time when we just had

00:19:26   1x everywhere and then there was 2x + 1

00:19:30   X and then now there's 3x as well and

00:19:33   like it's always going to change

00:19:35   everything like the one of the few I

00:19:38   don't know if we'll ever get to 4x but

00:19:40   something else is going to happen like

00:19:42   all of a sudden I for a long time I

00:19:43   think I had the thought that the iPad

00:19:45   was always going to be sort of 1024 by

00:19:48   768 and we're hinge terms of functional

00:19:50   size and it's like no turns out they're

00:19:52   going cuz like when they went to the

00:19:53   MIDI they kept the same resolution they

00:19:54   just smushed it a bit

00:19:56   and with a pro though it's like oh no

00:19:57   here's this massive new screen and so

00:20:01   it's like the most important thing is to

00:20:02   be able to overtime

00:20:05   really like update that have those

00:20:07   assets be dynamic and to change over

00:20:10   time whether that's like rendered in

00:20:11   your app which like you were saying like

00:20:12   sometimes that's good sometimes it's bad

00:20:14   like it's some trade-offs but whatever

00:20:16   it whatever form you're doing it in it

00:20:18   needs to be something that you can very

00:20:20   easily if all of a sudden it's like I

00:20:22   need them at a different size even if

00:20:24   it's not a different resolution even if

00:20:25   it's just like you know I think the

00:20:27   alignment on this isn't quite right I

00:20:29   need to make it a bit smaller mm-hmm

00:20:31   like being able to rent re-render that

00:20:33   from source rather than taking the image

00:20:36   and like resizing it which is always

00:20:38   never going to look good like you need

00:20:40   to be able to say like let's rerender

00:20:42   this from the beginning

00:20:43   within the exact dimensions that I want

00:20:46   it to be and if you can do that like

00:20:48   then your workflow is like good if you

00:20:51   can't then you probably need to fix it

00:20:53   because you it's yours waiting for at

00:20:55   some point down the road it to come back

00:20:57   and bite you yeah and even like there's

00:20:59   like there's like a hybrid approach you

00:21:00   can do here which i I've employed for my

00:21:02   all my watch assets like some in some

00:21:04   contexts in the OS or in the frameworks

00:21:07   in some contexts you can't do a

00:21:09   programmatic rendering of something you

00:21:11   have to have an image in the app bundle

00:21:14   with a certain name like you know so

00:21:15   things like your launch icons like you

00:21:17   your app icon just can't be programmatic

00:21:19   in iOS today other things like in watch

00:21:23   kit there in and watch iOS - I would

00:21:26   imagine it's more flexible but in in

00:21:27   watch kit you watch kit one many things

00:21:32   had to be static images like there were

00:21:34   there were certain things that

00:21:35   everything had to be yeah right and so

00:21:38   with overcast what I what I did like you

00:21:40   know like my I have my like my my themed

00:21:42   buttons that are that are in the app and

00:21:44   those buttons are all generated by just

00:21:47   calls to my one of my appearance manager

00:21:49   functions that in my custom appearance

00:21:50   class and you just specify how you know

00:21:55   what size canvas to render this icon

00:21:57   into and you know the line width and the

00:22:00   color and you know some of them will

00:22:02   display things like like the seek

00:22:04   buttons that have the number of seconds

00:22:06   inside of them that will be that will be

00:22:07   seeked so on whatever

00:22:10   like that's all customizable by the user

00:22:12   and so like those buttons just you know

00:22:15   like there's a function that just says

00:22:16   you know render seek button at this size

00:22:18   with this color this line with and with

00:22:20   this number in the middle and the

00:22:22   function has a text drawing call and it

00:22:24   went you know in the middle of all these

00:22:25   shapes and by the way paint code is a

00:22:27   great app for for generating the code

00:22:29   for any kind of non-trivial shape

00:22:30   recommend that but then you know and

00:22:33   then it just wraps it in like an image

00:22:34   context where it just does it does a

00:22:36   transform that scales it so you can I

00:22:38   can render this image that you know the

00:22:40   source is in like you know I'm 100 by

00:22:42   100 great or whatever I set paint code

00:22:44   to and then just scales that with CG

00:22:47   code to to whatever output size you

00:22:50   wanted it at and so when you have a

00:22:52   context like watchkit where you you're

00:22:55   required to have static images I have a

00:22:58   special build mode that I can set the

00:22:59   app in where it just generates the house

00:23:01   for me hitting it in every in every

00:23:03   configuration that that it might ever

00:23:04   need with my current code so it

00:23:06   literally just like calls that function

00:23:07   and renders out static asset that I can

00:23:10   that I can then include in the Hat

00:23:12   bundle so that like that that kind of

00:23:14   hybrid approach I think has a lot of

00:23:15   advantages it is more complex it will

00:23:18   not save any space in your app bundle

00:23:19   but it will allow you to use these

00:23:22   images in calls like like image named

00:23:25   and in context where you need static

00:23:28   images and it preserves all like the

00:23:30   load time optimizations the caching

00:23:33   optimization on the platform so the

00:23:34   hybrid approach I think is worth

00:23:35   considering but ultimately like I just I

00:23:39   love doing things programmatically

00:23:40   because I think you're right like it it

00:23:42   feels more semantically right like if I

00:23:44   have a graphic that is just like you

00:23:47   know a circle with an arrow going into

00:23:49   it like why does it need to be a bitmap

00:23:51   file somewhere like why why can't that

00:23:54   just be represented as vectors it seems

00:23:55   as a programmer and I recognize this

00:23:58   isn't how design works but it seems as a

00:24:00   programmer that is like the most correct

00:24:02   way to represent that it's by vectors

00:24:03   and and that doesn't this isn't true for

00:24:06   everything of course but so much of what

00:24:08   we do today and then the current styles

00:24:10   of interfaces that is true for and it

00:24:14   just feels right you know it feels right

00:24:16   to represent it as a function and and

00:24:18   even in many ways like like I mentioned

00:24:20   my scaling technique earlier with these

00:24:22   with these function calls like

00:24:23   a lot of times something really simple

00:24:25   like drawing an X you know like an icon

00:24:27   that's just like a big X or a plus sign

00:24:29   like I would rat like I've rendered that

00:24:31   in a you know in a 1.0 scale graph like

00:24:34   it's you know one by one and it's

00:24:35   alright render for me now draw a line

00:24:37   from 0.5 to 0.5 you know like and then

00:24:40   just render to any size like that that

00:24:41   is actually easier and simpler to to

00:24:43   write and to and to conceptualize than

00:24:46   having 16 different PNG files that

00:24:50   different thicknesses and everything and

00:24:52   and sometimes you need the dynamism you

00:24:54   know if you offer things like like if if

00:24:57   the icon has to be right it has to be

00:24:59   read in two different colors different

00:25:00   fonts for any kind of embedded text

00:25:02   different line thicknesses or if it's

00:25:05   something that's being reflected in the

00:25:07   UI that is some kind of dynamic element

00:25:09   like you know if you have some kind of

00:25:11   UI widget where you're showing progress

00:25:14   you know do you actually want to render

00:25:15   out a progress bar at a hundred

00:25:18   different widths for all the different

00:25:21   percentages or you know do you which I

00:25:22   actually did for my watch app or you

00:25:26   know or if you want to just have one

00:25:28   that you can call a function and you can

00:25:30   generate it at whatever value you need

00:25:32   so in a different there's obviously

00:25:35   different needs here in different

00:25:36   situations usually I prefer to go

00:25:38   programmatic wherever possible for Miami

00:25:40   generation because usually the the

00:25:42   downsides are either non-existent or

00:25:45   very very small and the upsides are

00:25:47   quite big and I think - one thing that I

00:25:49   like about the more I've gotten into

00:25:52   doing programmatic rendering is it keeps

00:25:55   my it matches matches matches well with

00:25:58   my ability so if I open Photoshop which

00:26:02   I don't really have that much business

00:26:04   getting into but like I can do a lot of

00:26:07   stuff there that probably ultimately

00:26:09   doesn't look very good like I can over

00:26:12   design and try and be clever than I

00:26:15   actually am whereas when I'm like

00:26:18   writing it in either even in paint code

00:26:20   or just like in core graphics calls like

00:26:22   it limits in constrains me but I find to

00:26:26   be a positive way that like I understand

00:26:29   core graphics in a way that I don't

00:26:30   understand Photoshop and so it's

00:26:33   constructive for me to like okay I can

00:26:35   only do of like

00:26:37   ten drawing operations or whatever it is

00:26:39   like you can do in court graphics like

00:26:40   functionally it's like you can stroke a

00:26:42   path you can fill a shape like there's a

00:26:44   few basic things and so if I make my art

00:26:47   assets align with that I'm probably not

00:26:50   gonna like reach beyond what I'm

00:26:52   actually capable of doing or is if I go

00:26:55   into Photoshop and like oh I can do

00:26:56   layer styles ooh that's pretty

00:26:58   oh let me go into the sea or I can blur

00:27:00   this over here like doing stuff that I

00:27:02   have no business doing and so at least

00:27:04   if I keep it as programmatic and simple

00:27:07   then I'm not exceeding that and I

00:27:10   understand it too like that's maybe

00:27:11   another part of it like we're saying

00:27:13   from the beginning of like if you're

00:27:14   doing this all yourself

00:27:15   like it's danger the dangerous things

00:27:19   too in some ways is if you have if

00:27:22   you're an external designer is making

00:27:24   something for you that you have no way

00:27:26   then of recreating or adjusting or

00:27:28   adjusting or tweaking like I don't

00:27:30   understand it then I can't change it

00:27:33   really and that's just you know has

00:27:36   definitely come back to bite me a few

00:27:38   times where I just need to change

00:27:40   something slightly and I can't because

00:27:43   like it's a baked PNG and so it's like I

00:27:45   just have to make do or I need to try

00:27:47   and get back on my designers schedule to

00:27:49   make a really smiter adjustment for them

00:27:51   and work out the contracting for that

00:27:53   like it's a night if it's nice and easy

00:27:55   and understandable it's probably gonna

00:27:57   be better down the road and I think so

00:28:00   for me like this is where I'm heading

00:28:01   like I very do very few static images

00:28:04   anymore I tend to do a lot more

00:28:06   programmatic things or at least storing

00:28:09   my assets in a form that I can easily

00:28:12   rerender and regenerate and I can look

00:28:15   at on my kit I understand what that's

00:28:16   doing like I see the lines drawing the

00:28:18   shapes it's filling and like that makes

00:28:20   sense to me yeah and and and the result

00:28:23   of that usually isn't as good as what

00:28:26   you can get with a pro designer sure but

00:28:28   it's a kind of it's one of those things

00:28:29   where like you can get like you know

00:28:31   two-thirds of the way there for for a

00:28:35   lot less cost and and with a lot of

00:28:37   other benefits so like that isn't always

00:28:39   worth it sometimes it is and and

00:28:41   sometimes you don't have a choice so

00:28:43   it's nice to be able to be able to to do

00:28:46   to do the minimum required with the

00:28:49   resources you have

00:28:51   rather than being forced to go and spend

00:28:53   a lot of money you don't have so it's

00:28:55   it's good to have this option exactly

00:28:57   alright that wraps it up for this week

00:28:59   thanks a lot to our sponsor this week

00:29:01   hover

00:29:02   thanks a lot for all our listeners

00:29:03   please do recommend us to friends and

00:29:05   rate us on overcast and iTunes and

00:29:06   everything and we will see you next week

00:29:08   bye