The benefits of learning to code for designers! – with Ran Segall


– Hey everyone. Look who I’ve got with
me on my channel today. This is Ran from Flux, whose
videos you’ve probably seen pop up in the suggested feed next to mine. Do you want to introduce yourself, tell people what you do? – Yeah, hi, my name is Ran. I’m a designer based in Tel Aviv, Israel. I do mainly freelance design. I also have my own business. So I’m doing product design for myself and then I also have a YouTube channel where I post daily
videos about how I work, what I struggle with, success, failures and just random thoughts. – It’s one of my favorite
channels on YouTube, so I’m really excited that
we’re filming together. – That’s so great to
hear, because honestly, your channel was one of my
inspirations to start mine. – Ah, Stop. Okay, so I tweeted out asking what you’d be interested in
hearing us talk about together and a few people said
they’d be really interested to hear us talking about how our workflow and what’s changed, now that we’re building our own websites. So I learned to code last year and now code my own pages in WordPress. You use Webflow now as
part of your workflow, so you can take control
of all of that part in working with clients. – Yep. – How’s it been? What was your process before you learned to build your own sites? – Well, it usually was something like, if we’re talking about
something like three years ago. If your developer was hi-tech they knew how to deal
with Photoshop files, but if not, you’d have
to recreate a spec doc with spacing and that stuff. I guess that is now sold with tools like Zeplin and InVision
and stuff like that. But I was still dependent on other people to actually realize my vision or my work. Or when clients approach
me to build a website, I would have to subcontract and then I would be dependent
on their availability or their skill and that was, to me that was really frustrating. And so I found the perfect, I started to learn HTML and CSS by myself, but I didn’t really enjoy the process. And so for me, when I found out Webflow, that was the perfect solution for me to kind of execute on my own ideas. Now I can execute really much faster, because it even saves time, like the communication with the developer, and it helps me make more money, because I can charge for
design and development at the same time, so yeah. – True. – So for me, it’s invaluable. I could never go back. And actually when I have clients who want to develop their own websites, I’m actually frustrated,
because I know that again I’ll have to deal with their developers. – This big document and yeah. – Yeah and I actually, I just finished a huge project with a big marketing
website with like 20 pages and they wanted their own
developer to do it on WordPress and we had so much going back and forth. Like, “Can you export me this icon “and the SVG, PNG, the
spacing doesn’t look right” and honestly I was quite
disappointed with the end result. Yeah, so that’s why I don’t
like to trust other people with doing my work. – Yeah, I feel the same way in that I feel like when I used
to work with developers, I worked with amazing
developers throughout my career, but just because they don’t have the same design eye as I do.
– It’s true. – They’ll build a page.
– They just don’t see it. – They’ll say it’s finished
and I look at it and be like, this looks nothing like what I gave you, how could you think this is the same. So I really like being in
control of the whole process now. And yeah getting to, It’s only my fault, right, if it’s not looking like the design. – Do you do all the WordPress development? Like everything? – Yeah. So I work within a theme
that the other designer at ConverKit, Dilan, set up. So there’s a lot of the grid
and base typography stuff that already in place though. I don’t have to start from scratch. But yeah I code all of
the templates myself, custom fields, all of that. – Amazing.
– Yeah. – It’s been quite a learning curve, but I’m really glad that I did it. Would you advise other designers to learn to build their own stuff? Whether it’s coding, using the
Webflow, you know something. – You know there’s this
kind of famous debate whether designers should, – Should designers learn to code? – Yeah, I don’t think you should do anything that you don’t want to. But I think it would be
very beneficial for you to be able to do that. You know it will save you a lot of time. It’s a valuable skill to know. It doesn’t matter that I use Webflow. To use Webflow you have to
understand the code like, – The basics, – The general concepts of HTML and CSS. So in a way you have to learn to code to use Webflow properly. So I think, yeah, it’s
super, super valuable. – I think so too. My opinion on this, should
designers learn to code, is that you don’t need to be an expert, but you should have an understanding. – Exactly. – So you don’t need to know
how to write it from scratch. You more need, like if you’re speaking a language, you need to know how to read it rather than think of the vocabulary off the top of your head, and like speak it. – You know what, I think
language is a great metaphor because most languages,
with just lets say, a thousand words, you
can do 95% of the things. And so to get to those
thousand words or like, you know that’s not very difficult. You don’t have to be fluent,
and a super-developer that know how to do
interactive JavaScript, like craziness. Just know the basic, you’ll be
able to do 95% of the things. – And even if you’re not
building your own stuff, I think it really helps for communicating with a developer, right? – It’s true, you know I
did a personal project where I developed an iPhone app. Now, so for that I learned Objective-C to develop for iPhone. I will never to that again. I do not plan to develop
iPhone apps for my clients, but the fact that I do know the structure and the logic of how iPhone
apps are being developed, was tremendously valuable
for all my communication with developers whenever
I’m working with it. So, it was worth learning it, even though I’m not
gonna be using it again, literally writing the code. – Yeah, that makes sense. Someone asked on Twitter, “Do
you think you’re a unicorn?? (both laughing) – Of course.
– Oh yeah! – I don’t know what that means. – That means, a unicorn is if
you’re a designer-developer. – Oh. – I think it came about
when that was rare? But I feel like it’s not so
rare anymore, I like yeah, – I know as unicorn
from the startup world, where it’s a billion dollar company. – Yeah, right, yeah. – I wish I was a billion dollar company. – Yeah that’d be nice.
– Yeah. I wouldn’t call myself a developer even though I know how to develop. But its just, maybe
it’s an identity thing? I’m like a designer first,
– Yep, same. – That’s how I feel – Yeah I agree, but I like the
concept of being a unicorn, just cause I like unicorns. – Unicorns are fun. A billion dollars is fun as well. (hands slapping) – Alright, thank you for
being here on my channel Ran, this is so fun.
– Yeah. We’re gonna film a video of
Ran and Turner right now. What are we gonna talk about. – I think how much fun we had
here at the Epicurrence event. – Yeah, that sounds good. So if you want to hear about that head on over and make sure you
subscribe while you’re there because like I said, one of my favorite channels on YouTube, so you’re probably gonna like it. – See you guys. – Bye.

, , , , , , , , , , , , , ,

Post navigation

36 thoughts on “The benefits of learning to code for designers! – with Ran Segall

  1. I used to watch you both, I have learned so much from your Vlogs and disscussions
    It's an incredible thing to see you both in one video!

  2. I've started getting into coding about 15 years ago (I'm 29 now) with WordPress, around the same time I first dwelled into design. While I still don't call myself a fully-fluent developer, I'm able to develop my own designs in WordPress because I can understand a lot of it. I still don't like it, but it feels nice to be able to do it. Great video!

  3. You guys look cute 🙂 anywho. Coding for me is definitely a big plus and it's all about your love for learning. Be it numbers or a whole new language, if it's a tool that could help you realize your ideas better then why not. If it's not your thing then keep doing what you do and do it a million times over and be a master of your craft until you no longer feel the need to learn code because people would start to want to hire you for awesome skills that technology cannot replace. (^u^)

  4. MARVEL: Infinity War is the most ambitious crossover event in history

    ME: please…. look this video 😛

    I'm a Frontend Designer (yes, it's a thing) focused on web apps , and yes I totally agree that learn how code works it's great to understand design in every aspect.

    Cheers from Mendoza, Argentina!

  5. It's nice to hear other designers admit having the same struggles I'm having with getting your design coded and having it look…off.

  6. I had the same issue where I will give my design to my developer and he will present me something totally different. That's why I had to learn how to code and keep on learning. By the way, I love both channels. You guys are awesome.

  7. charli where did you learn how to code? i also plan yo learn coding although i already build sites via page builders but i need to learn custom CSS

  8. I'm more on the opposite spectrum of I am a developer with some design…training? I can design, however, my designs are more functional rather than inspiring. I have been blessed with learning about design and marketing as well.

    From a developer standpoint, I sometimes receive designs that are missing functional requirements. An example is a design for hotel search results. I will receive a comp with a full list of the same hotel, but not what the list looks like if no results are returned or nothing matches all the filters active. Things like hover state, active state, loading have to typically be requested. I believe it is partly to do with our communication, but I would love to hear your thoughts on delivering a design comp to a developer to be coded. What would your ideal back and forth be between developer and designer?

    At my work, we typically start everything with bootstrap 3. We don't have a brand guide or a style guide for anything we do at the moment. So translating a one-off design to bootstrap is common. The request I make with the designers is that they at least use a 12 column grid. Then, I do my best to match their design but on bootstraps platform.

  9. Hey charli amazing video as usual… i am so proud to be part of design life commnity too… you guys make learning easier… do you plan on collaborating with anyone and talk about branding???
    Would love that
    Kudos!

  10. I really enjoyed this video. I actually found it helpful learning the basics of HTML and CSS. Even though I use a template for my WordPress site, I actually use my skills to customize it to my liking. And coding also helps me turn that template into more than what it was.

  11. Charlie and Ran, thank you for posting this. I've been bullshitting around for 6 years with wordpress templates on Themeforest. I can browse the web for hours enjoying designs. I just love the design process. However, in the back of my heart, I've always wanted to learn how to code but never put myself to it.Thanks to this video, I will now.

  12. First you're on the Futur, then you team up with Ran, I don't even know how to handle this much awesome! mind blown I just love you all haha. <3

  13. Thank you for very inspiring video! I have one question..Do you know also PHP for developing WordPress? Or just HTML and CSS?

  14. I see a lot of people kind of overestimating their ability to code. There is a world of difference with being able to hack together a bootstrap site and an actual front end web dev that can handle scalable web apps for example.. I agree that if you do digital design you must be technical litterate to communicate effectively with devs (and yeah hack together some stuff from time to time). But a "coding designer" would never find a place in a functionning team when more specialised, skilled and faster profiles are available.

  15. Hey guys, totally agree. Designers should learn the broad strokes of coding, and understand web technologies. For me webflow was the ideal product to allow enough control and freedom to do what I wanted. But without having going crazy trying to figure out time details in HTML or CSS.

  16. I'm a Graphic Designer (since 2001), back than you picked Print or Web. In 2012, I went back to college for Web Development, since than I have found dealing with developers is easier and I can keep my designs from putting coding over budget.

  17. Designer learns to code so that they can understand how coding work or maybe to show developers how this will look in real world, if the first is the reason to learn code then I think we can solve the design just by sharing all the screens through design sharing software such as Invision, and if the later is the reason to learn the code then I think we can learn prototyping software such as principle or animation software such as After Effects. What do you think? With all these modern tools do we need to learn code still, or we should sharpen our skill on design more.

  18. the being a unicorn term in Poland it's just about being a designer that people want to work with / hire again. I have no idea how it developed tho. But there was whole lecture at the Element Talks conference by Joanna Zabawa tilted 'How to become a unicorn, or be the graphic designer they always dreamed of' https://www.youtube.com/watch?v=urhrX17QCpU&t=1407s (Ran I've watched your lecture there as well! really good stuff on pricing your work). By the way it's really cute cause the world 'Zabawa' literally means 'fun/play' in polish. So it's Miss Fun talking about unicorns. Enjoy 😉 love the youtube combo that you've created!
    https://www.youtube.com/watch?v=a-xWhG4UU_Y – pink fluffy unicorns dancing on rainbows

  19. hi charlie ı'm new this subject (I'm designer and ı have no idea css ), i wonder which program automatic or easy export my design html css, thanks

Leave a Reply

Your email address will not be published. Required fields are marked *