30

Bootsketch: Design sites faster (looking for feedback)

almost 3 years ago from , Freelance UI/UX

Hi All! Really excited to share my latest project Bootsketch.com with you. I'm treating this as a "soft launch" to get some feedback from other designers before I drive traffic to it.


What is bootsketch?

Bootsketch is a sketch file that gives you all of the Bootstrap components in the latest 4.0 documentation.

The problem

I design a lot of sites that are developed in Bootstrap. All of the current Bootstrap sketch files seem to be missing the mark. no symbols or poor use of symbols, ineffective symbol overrides, unorganized, not resizable, colors / type aren't linked to components

My Solution

In Bootsketch I've created each symbol to be resizable, intuitive, and extendable

All colors are linked to layer styles and symbols so updating branding is extremely quick and easy. Updating text styles is just as easy

Image titleimage title


With all of that said...

I welcome any bit of feedback you might have. Anything from:

  • Price point
  • Design
  • Copy
  • How useful you think the product is
  • What would you change, etc.

Update:

Thanks so much for the positive feedback, DN! I've created a public trello board for everyone to add wishlist items, bugs, future updates, etc. Feel free to add your requests to this board https://trello.com/b/0FRbgQvy/bootsketch

24 comments

  • James FutheyJames Futhey, almost 3 years ago

    This looks great. Grabbing a copy. Definitely worth $29 for a well-maintained set of Bootstrap symbols w/ overrides & good coverage of Bootstrap, especially if you're working on a UI kit from scratch.

    I've been through the process in the past, and honestly, if I do have to do it all over again (on bootstrap), this would save a ton of hours, and help kick off the process.

    Would advise, that you are going to need to keep this well maintained, and be responsive to feedback / bugs / sketch updates if you're going to scale this.

    This stops holding much value once it loses compatibility with the latest version of Sketch, or Bootstrap, etc.

    3 points
    • Seth CSeth C, almost 3 years ago

      Totally agree. I definitely am going to support it. Anyone who picks this up will get all updates free of charge.

      0 points
  • Edouard Penin, almost 3 years ago

    Just bought it, I went through the same process myself so I definitely support the product and know the pain of creating this thing! :D

    Few things bother me though, main one being the input variants (large) are not there, neither are cards.

    Also, If you resize an input, shrink it/grow it vertically the input field sizes, I feel this is counterproductive (not a behavior bootstrap has, and not enough to make a large type input as the text size is different (I fixed the symbol's height so not much hustle there))

    As of right now, the kit is not complete enough for a regular bootstrap user.

    Nice things to have would be label size variants for inputs also (I mainly played with inputs)

    This being said, you did a really awesome work dealing with nested symbols, those are really obvious to use, and expect a few unexpected behaviors (input fields changing heights) you did an amazing job with responsive (that slider is awesome :))

    Do you plan on tackling those soon?

    Hope this was constructive, this is really a great start, just not full enough for what it sells to me. But it will definitely be my go if you make improvements!

    2 points
    • Seth C, almost 3 years ago

      This is exactly the type of feedback I'm looking for. I wanted to get the product out there and see if there was interest for it without building every size variation of of badges, or inputs. These are all things I'm writing down and will put on the roadmap to add/fix in the near future.

      I'll go ahead and create a public trello board so we can track bugs, improvements, and ideas https://trello.com/b/0FRbgQvy/bootsketch

      I really appreciate your feedback, I won't let you guys down!

      2 points
  • Account deleted almost 3 years ago

    Is this thing legal? I mean selling other people's hard work?

    2 points
    • Yasen DimovYasen Dimov, almost 3 years ago

      What do you mean? If he's created the whole Sketch file from scratch, why would it be illegal?

      3 points
    • Matt Fulton, almost 3 years ago

      Are concerned about selling a product derived from bootstrap? If so, bootstrap is MIT licensed, which means is OK to sell derivatives of it.

      4 points
      • Ktrn DsrsKtrn Dsrs, almost 3 years ago

        I agree to the fact that he sell it (and the price is quite fair). By my experience, I can tell you that building that kind of sketch file is a lot of work! Please respect that!!!

        6 points
    • Nick Sloggett, almost 3 years ago

      Had the same question. It's not a derivative it's a 1:1 creation. That's why Facebook can't resell their UI kits.

      0 points
      • Juan J. RamirezJuan J. Ramirez, almost 3 years ago

        1:1 creation would be forking Bootstrap. But even if that was the case it would be a valid use under the MIT license. https://v4-alpha.getbootstrap.com/about/license/

        3 points
      • Kemie GuaidaKemie Guaida, almost 3 years ago

        No, it's not 1:1. One is a html/css/js framework (and open source too), the other is a graphic representation of the components in that framework.

        3 points
        • Account deleted almost 3 years ago

          Technically you're right. I can just draw Mona Lisa on paper and sell it. But that's art. Graphic representation also technically a true excuse to sell but still I'd feel ethically pretty uncomfortable reselling something thought and spent more time by someone else.

          Idk, I am not trying to argue or defend anything. I just don't feel that this is right for some reason.

          1 point
  • Mark Otto, almost 3 years ago

    Holy crap, this is awesome Seth! Well done.

    1 point
  • Thomas Michael SemmlerThomas Michael Semmler, almost 3 years ago

    I am really interested - what is the value of this? Meaning, why would want to use bootstrap inside of sketch?

    1 point
    • Seth CSeth C, almost 3 years ago

      Good questions, Thomas! Here are a few reasons why it's helpful

      If your developer is using Bootstrap:

      1. It helps bridge the gap between designer & developer, and helps them both be on the same page. If I as a designer know all the default assets my developer has at his disposal I can pull those into my design with confidence knowing that those are pretty much plug and play when things get to development

      2. If I've made edits & branding updates to bootsketch, I can simply share my design with the developer and he can see what colors / components were updated. From there he'll know exactly what needs to be changed within the bootstrap ecosystem.

      If your developer is NOT using Bootstrap

      Bootsketch still gives you a TON of design assets that help you put your mockup together very quickly.

      1. It gives you many standard components that'd you'd need to create regardless. (like buttons, forms, typography, linked color styles)
      2. It gives you artboards with all the major breakpoints with accurate grid spacing for different sized screens.
      3. And the best reason is that all of these components work really really well. I've tested them time and again to make sure they resize fluidly, and are easy to override or modify.

      Hope this helps!!!

      1 point
  • Brad Siefert, almost 3 years ago

    I really appreciate this tool. It's something I've wanted to create, but no longer feel the need because you've done such a good job. Buying now.

    1 point
  • Martin Ahe, almost 3 years ago

    Looks great!! Good work!

    1 point
  • Orcun IlbeyliOrcun Ilbeyli, almost 3 years ago

    Very good!!! I know the pain during the creation of this kinda sketch files...Big kudos!

    1 point
    • Seth CSeth C, almost 3 years ago

      haha...exactly. Started out being a project I wanted to ship in a few weeks...turned out to be a few months. ahh!

      0 points
  • chloe barbieux, almost 3 years ago

    Looks great, I downloaded but sadly seems a bit buggy to me when I resize elements it doesn't adapt and most layers get cut off. Any suggestions?

    0 points
    • Seth CSeth C, almost 3 years ago

      Hey Chloe, sorry you're experiencing issues with Bootsketch.

      Can you tell me what elements seem buggy? If I can replicate the issues you're experiencing I'll be happy to try and fix them. I'm keeping track of issues on this public trello board https://trello.com/b/0FRbgQvy/bootsketch

      Or if you'd rather, you can email me directly at seth@coelen.co

      Thanks! Seth

      0 points
  • Ajmal Afif, almost 3 years ago

    Hi Seth, I design & code though I no longer use Bootstrap recently, I can feel the pain of creating this and I can tell you, this kit is super useful!

    Bought and will give it a go soon. And I just realized I didn't use the coupon code hahaha but that's fine.

    0 points