16
30 Comments

Developers who can't design, what do you do?

For those of us who can't design to save our lives, what do you do?

Ship it ugly like that? Spend an awful lot of time trying to push pixels around to make it look good? Hire someone to beautify it?

If you hire someone, how much of your dev budget do you allocate to it?

  1. 11

    If you're early in your career and plan to keep building things for 10+ years, take the time to learn! You can eventually become a rare unicorn: the badass designer/developer double threat. It's so useful to have that as a founder.

    Learning just comes down to practice. Spend time looking at really great-but-simple designs, then try to copy them, then go back and look at the original and try to figure out why yours looks worse. You'll rapidly develop your design taste, and you'll also become more aware of the little tweaks you can make to make things look better.

    I also recommend taking a short course or reading a book on design for developers. There are plenty. They will level you up quickly.

    If you don't feel like learning and want to get something out fast, go find some templates! There are tens of thousands of templates for one-page sites, WordPress sites, landing pages, etc. Spend a lot of time searching and browsing until you find something good, and just use that. It'll be faster and look better than banging out your own crappy design.

    If you must hire, I like 99designs. Don't do the contests — you'll get crappy results. Instead browse their directory of web designers, pick someone whose work you're impressed by, and engage with them. Have them look at what you built yourself, or tell them what you want.

    You can also just build in public. Tweet your crappy designs, tag some good designers, and say, "Hey I suck at design. Any tips for how I can make this better?" I bet you'll get some responses.

    1. 1

      Can someone recommend a design course with a practical approach (so more like a workshop)? I could only find courses and books with theory myself. The closest I ever found to this was an scss course (accidentally) created by a good designer.

  2. 9

    I like refactoringui.com, especially the color templates in their book. It's specifically for developers. My tldr is use more padding, consistent colors & sizes, and make UI elements simpler (less borders etc).

    I noticed that applying reusable techniques like that helps, I'm also struggling with design the most.

    1. 3

      I would second this. As a developer who is looking to improve my design skills, Refactoring UI is a great resource. It is basically a lot of common sense things that tend to get overlooked. Often, just applying some simple principles can make a big difference.

      No need to go through an entire 'research' phase or conduct long interviews. Sometimes just running FullStory or some other screen recording tool for a short while will give you tons of info about how customers use your interface, and will show you ways to improve it to make things more obvious.

      Hiring a UI/UX designer is as tricky as hiring a developer. We've had some on our team who were terrible, and only knew surface level stuff that they had learned in some online course (and were worse than the designs our developers did), and we have had some who have been brilliant and intuitive at making useful improvements. It is a bit of a gamble to find a good one.

      1. 1

        I use TailwindUI for almost every project. Has taken my app's to a whole new level.

  3. 3

    If you share your product I'll help you with design (for free). No catch, just want to help out. I'll send you a Figma link with some ideas.

    Aside from that, I agree with @albertkim. The way you can learn is essentially by copying other designs. It will be really bad at first, but it's kind of like making a recipe out of a cookbook. You didn't invent the recipe but you're still creating it yourself.

    Another tip I have is to just design less. You know who has the best design in the world? Apple: look how simple iMessage is, or Google: look at the results page. It's a mistake to "over design" when you don't actually need it.

  4. 3

    When you say design are you mainly talking about a site layout, graphic design, something else?

    For my latest project, I used Tailwind UI for the site look.

    1. 3

      Tailwind UI and following the book on design about it is quickly becoming my default way to deal with my limited design abilities.

      1. 3

        Yeah I picked up Refactoring UI a couple years ago. It was really good.

        It helped me see and understand things I hadn't before.

    2. 2

      I can only second that, tailwind ui was the best money i ever spend in my life, my site would look so much worse and I'd have to spent so much more time on it

  5. 2

    Hi, I'm a developer and a single person behind https://lunatask.app and no designer ever worked on the project. Luckily, there's no need for one. Yes, there're some UX issues I'd use some help with, but in terms of UI for web I'm using a template from ThemeForest and for the app, I use a UI kit for React, in this case Atlaskit. I believe for MVP one does not need a designer these days.

    1. 1

      I love the simplicity of your design! Is that bootstrap on the landing page? Good job!

      1. 1

        Thanks, yes, it is in Bootstrap.

  6. 2

    I usually just copy web design from sites/apps that I like the look of and then implement it in my own app.

    This is harder than it sounds though, cause I did put in a good amount of effort over the years learning graphic design concepts so I had an idea of what graphic design was, but it was when I started implementing designs myself that I truly felt like I understood graphic/web design.

  7. 1

    @segmond Are you looking to hire someone?

    1. 1

      Possibly, when I'm done building. Do you have experience styling hybrid mobile apps like ionic framework or react native? It's going to be pretty much 100% css.

      1. 1

        @segmond Yes, that shouldn't be an issue.Thank you.Do you have budget for the project?

  8. 1

    Learn just the basics of design--the grid system, and use something like Bootstrap.

    I'd check out:

    I found these to be good beginning books for devs. Once you get some core concepts, you'll at least have the vocabulary to say why something looks bad, regardless of whether you're doing it yourself, or hiring someone else to do it.

  9. 1

    TLDR: Webdesign is about usability, less about beauty. Keep your designs as simple as possible. When hiring someone you should evaluate the value he/she brings vs their costs.

    You seem to look at design as something to beautify your product. Good design has another side to it. The UX side. Which is the more important in my opinion. Is this site the most beautiful looking site? No. But it's easy to use and you are using it. The same goes for e.g. google. And your product.

    Personally I don't consider myself to be good at design at all. But I can manage creating some decent results given enough time. I did have to read some books and learn some concepts. Grids, whitespace, color, consistency, emphasis and probably more. Still my designs are not great. But good enough.

    Practice makes you better at design. The cool thing is that as a developer you also have a good feeling of what ideas are feasable online. I generally end up overcomplicating a design and then end up simplifying stuff until it looks like it was 30 mins of work ( while it took me like 2 days ). A bit like refactoring your code.

    What is cool about the design process is that you come up with new ideas as you go. It's hard to get started on your first designs however. And you have to get in a somewhat different state of mind than programming.

    Hiring someone to do it for you may be an option. But that decision depends on the value they add; the time you save yourself and an increase of revenue their design would generate.

  10. 1

    I don't have design skills but I do have dev skills which means I can implement a design. This means that I can ask my customers to choose something they like (there are myriads of html templates online) and I then implement that.

  11. 1

    For 20$ you can buy nice-looking themes on ThemeForest.
    I do this all the time if we talking about core-product.

    For landing pages, I usually stick to a constructor default themes, and if I need some nice colors I usually stick to material palletes

  12. 1

    I’d say it sort of depends on what you are building.

    I started mainly building web app dashboards, settings pages etc, so I chose a frontend framework, in my case Bootstrap, but there are many others, like for example Material Design.

    Then I just built lots of UIs using the framework components. You can get a lot done using just the defaults, maybe a few small tweaks. Great for building web tools. Your tool will look a bit samey as other tools that use your chosen framework, but in the early days it’s not too much of an issue.

    I have for other less application type sites, used templates from one of the template market places and customised it. You can get something that looks a lot more polished, but it’s sometimes a bit difficult working with someone else’s code. Good way to learn new techniques though.

    I’m hoping to get some time to learn a design tool like Figma at some stage.

  13. 1

    Very good advices! Thanks everyone. I'm terrible at Web site design, and right now working on a mobile app. Tho the same applies, it's a hybrid mobile app so I'm going to be styling it with css/html.

  14. 1

    Find a decent UI library and rely on it as much as possible.

    https://vuetifyjs.com/en/ is an example.

  15. 1

    For the first iteration of my web app, I used Material UI but quickly learned it was difficult to customize and all material UI apps end up looking the same somehow, a little bit like what happened when Boostrap was first released.

    I decided to redesign it using Tailwind css. I also can recommend refactoring UI to learn more about design.

  16. 1

    Try a component based framework. I use Quasar which is built on Vue. It may be the step you need.

  17. 1

    @segmond How much would you be willing to pay for it?

  18. 1

    If it's product, do you know how to use Figma? It's super easy to learn, has lots of plug-ins for UI components, and you can quickly create a simple, clickable prototype to user test for ux issues. It costs time right now, but it's gonna save you money and time in the long run. If it's branding and visual design in general, I share design tips through fonts and visual examples at https://fonts.substack.com if you feel like subscribing

  19. 1

    Another design framework (from Google no less) that you can adapt and use for pretty much anything: https://material.io

    I'm using it via RMWC for my Tutorbook project.

  20. 1

    I think they would maybe use templates

Trending on Indie Hackers
Songbox breaks £1000mrr ($1378) 38 comments One tweet. 750K impressions. +1800 Followers in two days...😱 15 comments I'm going all in on BitClout, I think it's great for Indie Hackers. AMA 11 comments What am I'm doing wrong (trying to get initial teams onboarded for a team-focused remote job board)? 7 comments Validate your product: 19 market testing and market validation tactics (plus 7 tools for validating) 6 comments Tips on finding brandable domain names 6 comments