I'm a developer and I remember the first time I tried to do some design work. My design friends told me to use Photoshop and I just couldn't figure it out. The learning curve was so steep I gave up on my ambitions to learn UX design. Plus it seemed weird to be using a photo editing tool to design software.
A few years later Sketch came along and it was so easy and intuitive to use that I was able to pick it up immediately. I've been able to get pretty good at UX design now because the barrier to entry on the tools side got so much lower.
I wonder if there's a way to lower the barrier to entry for coding in the same way. I mean, when you think about it, we're still using text editors to build software. Seems odd.
Anyway, Sketch is awesome and the first of this new wave of design tools. I use Figma now. It has most of the benefits of sketch and it supports Mac, Windows and in browser. I fear this funding may have come too late.
Wow, this comment got me really excited. I, too, have always wondered why programming has always been us programmers, sitting down in front of a text editor, writing tokens (def, if, = etc.).
It’s what got me working on Retool (https://tryretool.com). The idea is that visual programming has a bad rap, primarily because it’s being used in the wrong places. Most people try to apply visual programming to end-user software (Twitter, Airbnb, etc.). But because visual programming is really good for getting to an 80% solution in 20% of the time, and because 80% of Twitter really isn’t good enough (imagine Twitter with no autocomplete for tagging other users), building customer-facing software is precisely visual programming’s worst use case!
Retool’s focused specifically on building internal software. The idea is that, for internal software, 80% literally is 80%. And so visual programming is particularly suited for building internal stuff. Here’s a 4 minute demo video: https://vimeo.com/303811211. (People have described it as Delphi or Visual Basic in the cloud. In this case, the cloud is actually helpful, since it lets you distribute the created apps easily with authentication, authorization, and audit logs.)
If anybody has any feedback, or otherwise wants to hypothesize on why we’re still programming in text editors, please let me know! I’m david@.
Visual programming was pretty popular in the architecture industry last I remember. Mograph is also another area where I've seen people use it a lot, (its hard to hand model and animate thousands of objects), It's also great for developing shaders and textures that depend on different colors and noise values.
Programmers might dislike visual programming because you give up a lot of control, but artists have a far easier time using them than writing "const int x = foo", etc since they have to basically learn a whole new language/subject matter.
On that note, I think anything that isn't particularly algorithm heavy and visual could enable a different class of people (like designers and artists) to access the utility of programming logic without having to learn a whole new language and paradigm of thinking. Who knows, maybe in the future, front-end ui work might be done by designers using a "photoshop-for-interfaces" software rather than programmers writing react components.
>I wonder if there's a way to lower the barrier to entry for coding in the same way. I mean, when you think about it, we're still using text editors to build software. Seems odd.
We had HyperCard > Flash > Visual Basic > Delphi. None of those got any traction in the field because Computer technology popularity are dependent on Companies using them.
Computer Programming languages, or in fact most of the Technology Tools are Top to Bottom design. Google, IBM, Apple, Microsoft design tools that fits them, and people start using it. Do you really need k8s? I bet 80% of uses cases could do without it. Instead of bottom up design that is like Excel, everybody uses it all the way up to investment banks. It serves the need for 80%, or arguably 90%+ of number crushing uses cases.
I don't do much of excel directly as before we number crunching, need to process input before making and use to it. CSV format is good and then excel.
But for me k8s solves lot of problems, make deployment reliable, faster, infrastructure in code and these things. Other than k8s, haven't seen faster way of deployment on scale. IMO canary deployment style in istio is just the way deployment should be done. I find k8s great piece of software, still lots of apis need to be in GA, but still I found and see k8s a great piece of future.
It eliminates weeks and months of tedious design to code conversion and you can build sophisticated SaaS applications, content-rich pages, and e-commerce portals much faster.
It might help designers who're interested in understanding how their design translates into code because they can instantly see the underlying code for each design, play around with it, and see how it changes.
Checked your video and congrats for your effort. As every other tool so far that does try to make visuals into code ( e.g. Dreamweaver style ) I did not expect your tool to be useful for any company-scale use.
In your tool an anti pattern that I found was that it seems to use inline styles and css class names of sort 'font-normal' 'text-gray1', etc. That's unmaintainable for large code base.
On the other hand having `copy CSS attributes` contextual menu item in Sketch is super productive. I can choose my own class name and whatsoever and still have the exact styles as the designer wanted them to be.
> In your tool an anti pattern that I found was that it seems to use inline styles and css class names of sort 'font-normal' 'text-gray1', etc. That's unmaintainable for large code base.
Actually lots of companies use micro classes. I first learned about it using Tachyons and built a full compliance platform. It’s good because you don’t need to worry about unintended visual changes and bad because you can’t make large style changes without lots of effort.
Yeah these are out in the wild right now, but having some sort of support for those would be what I would be really looking for. The missing link is the problem. Generated HTML/CSS doesn't know anything about current frameworks / naming conventions / atomic CSS, etc.
`text-gray1` means what? Which library am I supposed to use in order to make this stylesheets work? Does it match tachyons or tailwind - no. So I have to add X lines of CSS to my project coming from a tool that I am not able to use once I change a simple class name? Not a good start.
The code you saw in the video uses Tailwind CSS, which means the code doesn't generate a class for `text-gray1`, but rather, it creates a simple tailwind.confg.js file that lists out all the colors (and every other design scale like typography, spacings etc.). Tailwind uses this config to generate all the functional CSS classes necessary. It is highly suited for building custom UI designs, unlike Bootstrap, Bulma etc. that brings its own styles.
The software also can generate BEM like you wish for in the future. One of our earlier iterations did do that, but the default stack today is Tailwind which I've found to be the second best way to approach CSS (the first is CSS-in-JS, but with explicit design scales).
You might be interested in Fuse Open (aka FuseTools) which is a design application that generates working application code. Before that there were various UI editors in software IDEs but those tend to produce a lot of boilerplate code. Interestingly, there are a lot of visual programming tools used in education now, such as Scratch, which get away from the text editor paradigm.
Most often these tools are so lackluster that it's not even worth using them. These code generators can never achieve the quality that a good programmer can give.
>I wonder if there's a way to lower the barrier to entry for coding in the same way. I mean, when you think about it, we're still using text editors to build software. Seems odd.
Is it really odd, though? UI design is inherently a visual activity - it makes sense to me to have a graphical tool like Sketch to use.
Whilst I sometimes use class hierarchy or control flow graphs to help me visualise a codebase, I feel that the medium of text is more efficient to write in (if you've ever seen one of those block-based coding tools often used in education, you'll know how painful it is to make something non-trivial by dragging and dropping blocks).
And it's not like we haven't seen innovation in the developer tooling space - nobody is using notepad to write serious code. JetBrains in particular have made a whole suite of tools which actually understand the code you're writing and suggest improvements, allow you to easily perform refactorings etc - it's far, far more than just a text editor. Today, I won't use a programming language without a JetBrains IDE/plugin.
Can I assume I do not miss anything from Sketch if i go Figma regarding :
- wire-framing
and
- demoing prototypes with transitions on my phone (specially this)
?
I am about to jump the wagon of design (product owner & ceo doing stuff on power point copy paste or balsamiq) and i do not have time to have multiple tools, i want just one.
Figma on browser + collaboration seems nice to test.
There is at least one company at each YC batch that aims to lower the barrier of entry for coding, us included. We (Anima YC S18 https://www.animaapp.com) take Sketch designs and convert them into code.
Amongst other things designers also use our generated code to learn how designs can be viewed in browsers as HTML/CSS.
When Sketch introduced Symbols, they started making designers think like developers, in the sense of reusable self-contained components. This makes our and companies like us live easier. And for that we thank them :)
+1 for Bubble.is they are definitely a big step in the right direction. They are still a long way from being ideal though. It's pretty hard to get started from scratch and the templates available are not very easy to modify and scale. It would be great if there were a few more players in this space.
Bubble is like a mix of an online Visual Studio for web development and Heroku. Everything is online, all the code and data (DB), you can only work through their interface and cannot port the app anywhere else. They provide the hosting.
For simplified software design, look for low-code or no-code tools.
An as for whether they are scalable, the new ones might be. I remember reading about a company, from somewhere in the middle East, using them to build hospital IT systems, which are usually very complex.
This means Sketch is now tied to VC’s revenue growth demands. Framer went down the same path of VC megabuck-driven development and a vocal part of the community seems unhappy with the outcome.
A few years back, the Sketch founder made a convincing case in interviews for why the product is better off when they’re bootstrapped... This turn of events suggests they might be feeling the heat from well-funded competitors like Figma and Invision.
I‘m sure that Bohemian Coding are _very_ scared of Figma. Just read the comments here - many switch from Sketch to Figma now. Multi-platform is more important than ever, with alienated Mac users switching to Win/Linux, and the iPad Pro becoming a part time computer for many. Having real-time collaboration also doesn’t hurt - Sketch cloud is way behind this.
If they don’t act now, fast, they will soon become irrelevant.
No, that's not the icing on the cake. That's the primary reason for why design teams are switching to Figma. This changes so much, you wouldn't believe: primarily because it means effectively side-stepping version control pains.
With Sketch you either have to use external software (Abstract, Plant etc.) or resort to manual “check-outs” while working in design team. With Figma this problem simply doesn't exist.
When my super hip designer friend suddenly pitched Figma instead of Sketch, I knew that things are getting serious. He has been a strong proponent for Sketch for years, but not any longer.
I haven't really used Sketch that much, but I always liked the native feel of it on the Mac. In the world of Slack-esque memory gobbling monstrosities it was just nice to use a piece of software made for the Mac, similar to the Omni Group applications.
I'm for sure hoping that the web move isn't a step in ditching the Mac app. But perhaps the actual users of Sketch don't care, Figma is mostly a web app right?
I tried adopting Sketch about a year ago but just couldn't figure out what the utility of it is over other design applications. If anyone has any thoughts on that please share.
It’s light, fast, cheap, easy to use and has excellent support for reusable components, making working with design systems a breeze. Adobe have been working on XD for years and are still nowhere close.
Sketch also can’t do much more design-wise than you can with HTML and CSS, a good thing as it’s too easy to put things into a design with photoshop or illustrator that are a pain to implement.
The file format is basically zipped json files, so there’s a robust plugin ecosystem and you can do things like git integration pretty easily. And it’s a native Mac app, unlike Figma, its closest competitor, which is Electron.
It’s an example of simpler is better, especially when compared to Adobe software which doesn’t just include the kitchen sink, but the kitchen, the house and a large part of the street.
Worth noting though that Figma is developed in C++ and compiled for the web, and they've stated that they're using Electron for the native apps for now, but it would certainly be thinkable and straightforward to switch to properly native apps.
>
Sketch also can’t do much more design-wise than you can with HTML and CSS, a good thing as it’s too easy to put things into a design with photoshop or illustrator that are a pain to implement.
On the other hand, it's a poor replacement for actual HTML and CSS as a flexible prototyping medium, and limits the visual possibilities for the parts that are not tied to CSS's constraints (e.g. icons, illustrations, backgrounds).
(From my admittedly short experience, Figma limits them even further, to the point that the only visual language you can accomplish with it is similar to Figma's own branding guidelines.)
Sketch has been widely adopted for UI design e.g. website and mobile app design. It's simpler than Adobe Illustrator, lighter in resources and subjectively feels far less clunky in use compared to Illustrator's UI.
Both are vector apps, but Illustrator skews more for, well, illustration and icon design, although you can use it for UI design. (You can also use Sketch for icon design too.)
Additionally, Sketch has a massive collection of plugins that forms a large part of it's appeal.
Adobe XD is Adobe's direct competitor to Sketch for UI design and for once, they are playing catch-up in terms of "mindshare" among designers. Making Adobe XD free in May 2018 was clearly an attempt by Adobe to accelerate the growth of their user base.
There are other competitors, notably Figma which is gaining a lot accolades and more users. Unlike Sketch, Figma runs in the browser which means you can use it on Windows and Mac (they have Electron-based desktop apps too). Sketch is Mac-only.
There is also Affinity Designer (Windows and Mac) - a vector drawing app which has a mixture of illustration tools (e.g. brushes) and more UI-focused features (symbols, constraints). However, Affinity Designer users seem to skew more towards illustration rather than UX design, so I would say they are probably not in the same race as Adobe XD/Sketch/Figma. Affinity Designer is a native app with no subscription model.
Overall, the more choice and competition in the design space is a good thing, particularly given Adobe's dominance. It's also nice to see apps adopt different UI approaches to tools - rather than copy the clunky way Adobe apps perform tasks.
Sketch is great as a design system manager. It's not all that great as a sketching tool (in spite of the name) and is a terrible photo editor. It shines when you embrace Sketch symbols, which allow you to build DRY, component-based designs, and Sketch libraries, which allow you to reference other Sketch files (local or remote) as dependencies.
This is the critical distinction. I think a lot of people see Sketch and think "so, a cheaper Adobe Illustrator?" But it's how Sketch utilizes nested symbols and libraries that makes it a qualitatively different kind of application from other vector apps.
I love that you used the term DRY to describe the design process Sketch enables - it never occurred to me, but it's exactly the same principle. Going back to Illustrator or Photoshop after Sketch is the UI design equivalent of copying and pasting the same code block over and over instead of writing a function or a class.
For one it runs on about every mac you can buy, you dint really need a big expensive computer to use it. Unlike photoshop or illustrator. This together with a simple UI, features especially for interface design (so you dont have to fight to get the program out of print color mode)
What's the benefit of doing it in the browser? That sounds like a downside for me. I like having my documents stored on my drive, I even have some scripts I wrote to format my files.
Collaboration and version control. With Sketch you either roll other software on top (Abstract or Plant) or painstakingly adhere to manual check-out process. With Figma your design team always has the latest version of the component libraries and can collaborate effortlessly.
I don't know much about figma but you can save .fig files from the browser app to your hard drive (I just did it to check).
I'm not sure if any other apps can make use of .fig files so you may well still be tied to the app in that sense but you can at least own/archive your working files.
They have a standalone app which feels almost as nice to use as Sketch's native Mac app. The main difference is when you see that loading bar because it's contacting the server.
I quite don’t get the math behind this. That’s a 50 person company with 100M of revenues. Their yearly operating costs are probably around 5M. Even if said revenues spanned 10 years they would still be making 5M in profit each year. Since they most likely have some amount of growth, last year’s profit has to be much higher than that.
Then why bother raising $20M? Isn't that amount a bit small compared to what they already made in yearly profit?
I really hope they put some of those dollars towards Windows development. I find it odd that sketch is so awesome yet only works on 13% of the market machines. I’ve wanted my company to look at adopting sketch but it’s weird to have a file not everyone can open, edit, extend.
Philosophically I find it odd to use a closed system which only runs on Mac to build experiences for web. Something about it rubs me wrong.
Sketch heavily relies on Quartz/Cocoa, which is Mac/iOS only. Both are very powerful and allow devs to produce high quality graphics apps with relatively little time and manpower.
Had they started out cross platform it’s doubtful they’d been able to achieve what they did when they did.
It's not just their commitment to Desktop, but their commitment specifically to not move off MacOS where they have stated that they "will not consider supporting Sketch" on Windows/Linux[0]
That we allowed ourselves as a species, for so long, to limit the accessibility of excellent tools to the requirement of a specific operating system or technology, is understandable for so many technical and political reasons, but still so incredibly sad to me.
But when a solution like Electron comes along, it's roundly denounced by a large number of the very people who stand to benefit from cross-platform applications.
Meh. I can differentiate. I hate the UX of most Electron apps, but like that they're available on Linux.
Though I do think the server-side doesn't need to be shipped. I have most of my web apps as simple "Web clips", which are basically bookmarks that open in a window.
Because it’s not a very good solution. We can and should do better, but that won’t happen if we throw in the towel and accept the lowest common denominator mediocrity that Electron represents.
Can anyone estimate how much revenue/users Sketch has?
A great sustainable comfortable product company. But its a developer tool, so of course we will get endless competitors products. So we need capital. So VC are now in a position to offer offers. And we get a bloodbath ?
I really don’t see how sketch has any less than 1m users. It’s so ubiquitous across the industry. It was the first photoshop “killer” in the market and that really made people switch from CS/CC. Schools are now starting with sketch instead of illustrator for product and UI design. It’s a massively popular product already. I don’t see why they need the series A and I also don’t see what good can come from it.
They offer education discount as well for $50/yr plus the $69/yr renewal someone else mentioned. So it’s definitely not a clear $100M mark but I’d say they’re doing good
Sketch to me is like Sublime Text, every time I try a new shiny toy (figma, adobe xd, framer/vscode, atom) I keep coming back to Sketch/Sublime Text. I really like their latest big update, it made the UI so much cleaner and easier to use.
Maybe, but many people that used to use Sketch are now using Figma. Adobe is doubling down on XD, and Framer is also rapidly turning into an extremely powerful tool.
It's pretty impressive that a browser based app can compete with such a complex and performance sensitive app like sketch. I understand why sketch is a native Mac app but having no windows or Linux port leaves the door open for competition.
Interestingly, my issue with Figma is just that—it feels slow and clunky to me, I imagine largely because it has to run in a browser. Surprised so many people prefer it.
It sounds like the issue isn’t the growth of Sketch itself, but the growth of the competitive landscape. I wonder if they shopped around an acquisition and couldn’t get one.
I doubt that an Ubuntu release is more likely in the wake of a $20 million investment. Ubuntu is not exactly the platform of choice for web and mobile developers. Perhaps a web version though.
+1. I bought a Macbook Pro just to run Sketch. But we didn't get along well with the Mac, so I'm using Adobe XD since that became an option. I'd love to use Sketch on Windows/Linux. Best of luck to them.
I wouldn’t mind an annual fee model if they continue to be well priced compared to people like Adobe + others.
I really dig how Balsamiq has the ability to share spaces and all of that, so if Sketch can build a platform to natively share designs back/forth + collaborate (Google Drive + Avocode esque) that’s a huge win.
Yep. But you don't have to pay to keep using Sketch, as long as you're ok with not upgrading. Unlike Adobe creative cloud that stops functioning the moment you don't pay.
I recently got a new laptop and finally made the decision to free myself from Adobe Fireworks. It was a hell of a tool and the fact that it hadn't been updated in nearly a decade and was still doing its job is a testament to its ability to scratch a certain UI design itch.
I'm using Sketch now and find it to be very good. There are a lot of great features in Sketch that don't exist in Fireworks and I've been slowly getting better and better with it. I have a difficult switching tools, especially something like Fireworks that I had been using for about 15 years, maybe even longer!
What I miss in Sketch is the ability to do non-UI work effectively. Fireworks almost sits in the middle of Photoshop and Sketch. You could even do some light vector work in there, all while eliminating the massive confusion newbs have when opening up Photoshop or Illustrator.
That's exactly it for me... I can use Photoshop and Illustrator, but there were just times I wanted to do a vector and bitmap work combined and the ease of use in Fireworks really made that feel right to me. Maybe it felt like.. a shortcut - if I have to admit it!
Unfortunately, the last Mac laptop I had died (it was quite old), so I only have a Windows laptop at the moment. I haven't made the switch to Sketch yet as a result.
Sketch seems heavily used for UI/UX designs/mockups, but do you find it as good for just individual image construction/building tasks? Or is it better for the overall layout, flow, mockup and design workflow?
I'm finding it hard to explain what it was about Fireworks that felt so right to me - there were times I could get an interesting image built that was both vector and bitmap, very quickly. Sometimes, I think it was the accessibility of the tools offered, it just had the right combination for what I spent most of my time doing (graphics for web/digital, that could move in or out of the print world if needed since it could be vector, sometimes whole layouts/designs, other times just detail work or piecemeal work).
I noticed recently that Corel acquired Gravit. This is an interesting move - I used to use Corel a lot, especially Photo Paint, back in the early days of the web.
I honestly don't understand this in the context of Figma, and especially considering how coy they're being about what this means. I have heard from my own network that the 'web version' of Sketch is not designed to subsume the macOS version, which seems...misguided.
Sketch is suffering from the result its own breath-taking success.
As a result of its incredible popularity, too many other companies with larger war chests have started to compete against it head to head
- Adobe XD
- Invision Studio
- Figma
Every single one of them allows you to import sketch files.
Bohemian has made a lot of money for its founders already. Now it needs to stay in the game.
I've never loved using Sketch. Granted it has some cool features, but I've found the performance and workflow to be poor.
Personally I wish Adobe released a new version of Fireworks or a version of Illustrator with less illustration features. I tried XD and didn't love it either.
A few years later Sketch came along and it was so easy and intuitive to use that I was able to pick it up immediately. I've been able to get pretty good at UX design now because the barrier to entry on the tools side got so much lower.
I wonder if there's a way to lower the barrier to entry for coding in the same way. I mean, when you think about it, we're still using text editors to build software. Seems odd.
Anyway, Sketch is awesome and the first of this new wave of design tools. I use Figma now. It has most of the benefits of sketch and it supports Mac, Windows and in browser. I fear this funding may have come too late.