For years now Adobe has led the way in web design with its Photoshop software. Some designers also use Illustrator or even InDesign to create design prototypes. Photoshop was originally created by the Knoll brothers as primarily an image editing software in the 1980’s but in today’s digitally led market Photoshop had been adopted by web designers worldwide as a preferred platform to create beautiful website designs. However, in recent years other softwares have emerged, trying to take over the throne that Photoshop has long held.
We have embraced our inner design nerdiness to bring you an overview of the design software market!
Sketch
Now that Dutch developers Bohemian Coding have released their popular responsive design application Sketch, Adobe has a real rival to compete with. Sketch is making real waves in the web design industry. Although the team behind Sketch was founded back in 2008 it took a little while to build momentum in the market. In 2012 it received an Apple Design Award along with being added to the best of 2012 list for the Mac App Store, two big thumbs up from tech giant Apple helped them along their way. Originally developed in the Netherlands, Sketch started to gain favour in North America, China and a few other European countries, primarily in Scandinvia. Interestingly, the UK was more hesitant to make the switch but Sketch has built momentum in the UK market in recent years.
Sketch has been designed and developed primarily to aid UI design and prototyping. There are quite a few features that trump Photoshop when it comes to web design. We have listed some of the headline features below:
- Sketch files are a lot smaller in weight
- The application is fast
- Designs render better for web and can be translated easily to CSS
- Sketch is a lot cheaper than Adobe CC. Sketch provides you with an annual licence, including updates within that year. However, unlike the monthly Adobe CC subscription, once your annual license expires with Sketch, you are still able to use that version of Sketch forever.
- It includes built in grids
- All elements are vectors by default making responsive design a breeze
- Easy to use measurement tool
- Although similar to Photoshops smart objects, Sketch’s symbols make the designing process a lot quicker across artboards
- Shared styles allows you to change the style of an element instantly instead of having to apply a layer style to each layer individually
- You can prototype directly on Sketch to InVision using Craft
One interesting factor with the ever growing popularity of Sketch is whether they will ever move to be Windows compatible? If not, will Apple once again deliver a blow to Microsoft and steal away any of the designers still using Windows machines. Let’s face it, Apple are the company of choice for designers across the globe.
Why are UI designers still using Photoshop?
If you look at the swathes of articles comparing Sketch to Photoshop, it is apparent that when it comes to UI design Sketch has the edge. So why are people still using Photoshop, it seems prohibitive to progress? There are a number of reasons for this though:
Time – In the high pressure and time sensitive design business, you are often too busy to assign time to learn a new piece of software. It may not just be you either, it may be a team of designers. Your developers may even need to get their heads around a totally new process and way of doing things. People that have been working on photoshop for years are often reluctant to get started with a new software. If they are quick and efficient at using the old one why change?
More flexibility – With Photoshop’s large photo manipulation capabilities editing imagery within the same software saves you both time and effort.
Paying for Adobe CC – Integrated web and graphic designers subscribe to Adobe CC to allow them access to the multitude of other softwares offered by Adobe. If you are paying around £50 per team member per month you may be hesitant to spend more money on a different program.
Loyalty and habit – Much like the loyalty iPhones users have to Apple, for most to even consider getting a Samsung is crazy. Even though they are better phones. There is definitely a sense of loyalty from experienced designers to Adobe, ultimately they learnt their trade using Adobe products. Some were even taught to use it at school. They have committed to Adobe and Adobe have facilitated their livelihood!
Windows users – Plain and simple. If you are a designer that uses Windows, you can’t use Sketch. The lesser known software Figma is available to Windows users but it doesn’t get mentioned in the same breath as Sketch or Photoshop.
Resistance to change – If it ain’t broke and all that. A lot of people are comfortable with what they know and avoid significant change. Furthermore, switching a core piece of software is a big task in larger companies with multiple people working collaboratively on the same project. As such, you may get one person holding up the bus.
Adobe have been making several improvements to Photoshop, with these changes geared towards UI designers. Items like the inclusion of artboards in 2015 and some other small feature changes we believe were added in the interim prior to the launch of their new software XD. Having said that, a handy new ‘Device preview’ feature has just been removed from the Oct 2017 update for Photoshop CC. Device preview allowed you to instantly view photoshop artboards on your phone. Perfect for testing Mobile designs. Perhaps this recent move from Adobe is to encourage users to start using XD.
Adobe’s web design softwares
Adobe has always had its fingers in lots of pies, offering a range of different softwares from Photoshop to Final cut. Fireworks and Dreamweaver were originally produced to be their primary web softwares. It never appeared to be Adobe’s intention but over the years Photoshop was adopted by web designers as the go to tool for website design and Fireworks died a death, never making it onto Adobe CC. That doesn’t mean that Adobe have completely rested on their laurels with Photoshop. They have released 2 new softwares in hope of providing more competition for the likes of Sketch. Let’s see how they compare.
XD
In October 2015 Adobe first announced that they were developing a new software for UI design and prototyping with the beta software released in March 2016 under the name ‘Adobe Experience Design’ – which then became Adobe XD. Adobe announced in October ‘17 that XD was now out of beta, although due to the infancy of the software Adobe are teasing users with a roadmap of features to come. As with the recent controversial Snapchat and Instagram ‘Stories copy’, on the face of it XD looks and performs like Sketch. Can you blame Adobe? Sketch is the young pretender with new tricks, threatening a coup. So is there anything that XD does better than Sketch or will people just be using it because it comes with their Adobe CC package?
Built in prototyping software – Creating prototypes, user flow and share links is all possible within XD at the touch of a button – there is no reason to use a 3rd party solution. This makes project collaboration a breeze. As a lover of InVision this functionality is music to my ears. You can create fully functioning prototype quickly and subsequently share your prototype at the touch of a button.
Repeat grid feature – This amazing feature is so simple but so effective. With UI design one thing most pages require is a need for a duplicated forms. The repeat grid feature allows you to duplicate your selected element(s) horizontally and vertically by simply dragging.
No need for plugins – Although some may see this as a limiting factor for XD I believe that having to rely on 3rd party plugins like Craft creates clunky processes. There is a constant risk that when Sketch releases a new update your plugins will stop working. It has happened in the past. XD has a lot of the functions you can get from Sketch built into the software. You can also bet that they will constantly be expanding the the inbuilt functionality of their software.
CC library – The CC Libraries integration in XD is a huge plus for designers that use the creative cloud to store all of their assets for different projects. Once again facilitating easy collaborations on projects.
Windows compatible – XD is compatible with both Windows and Apple computers. Whilst Apple have a grip on hardware for designers, it’s not the case for developers. Think of how many developers use Windows machines to code?
Appearance – This is a superficial point but as a UI designer I like the platforms and websites that I use to look good. XD looks a lot cleaner, subtle and stylish than Sketch. Please don’t judge me!
Muse
Adobe’s lesser known web design platform is Adobe Muse, released in 2012. So what does Muse do? Adobe Muse is essentially a website builder that allows designers to create simple sites without having to write any code, in fact there is no way of even editing the code. It’s in a similar vein to website builders like Wix and Weebly. The software has a built in library of widgets that you can add to your design along with several plugins that allow you to extend the capabilities of Muse such as CMS systems, blogging and ecommerce functions. You can also easily apply scroll effects to elements on a page such as fade in effects, parallax and more.
If Adobe Muse can do all of the above why isn’t it more popular amongst web designers? For one, designing and creating a website within Muse can be a time consuming task for a web designer that can make far more bespoke designs with alternate softwares. Secondly, front end website developers have condemned the platform due to the quality of code that Muse creates, labelling it as ‘bad’ and unoptimised. These two factors alone have had a significant impact on the amount of people using Muse. Is it really that bad? Sure, Muse does have limitations and I think it is important to be aware of them. However, it can be a great tool for freelance website designers that for whatever reason are not able to code or do not have access to developers. As such, it does offer a viable solution for low budget, simple brochure websites.
InVision Studio late to the party or the next big thing?
Prototyping and collaboration platform InVision is soon to release its own design software in January 2018. We are fond users of InVision at Yellowball. We even use InVision as a platform to collaborate with clients on print work, although that is not its intended purpose. Also, the real time commenting feature is excellent. Once a key player in helping Sketch with the use of the craft InVision plugin, InVision doesn’t want to stand still and watch Sketch have all the fun. The new InVision Studio will be tackling advanced animation within the platform allowing you to do most things that sketch and XD can do with the added ability to create beautiful transitions and animations on your prototypes…..all within 1 software.
One immediate difference we can see is that the InVision Studio UI is dark! Since the release of CS6 in 2012 adobe users adapted to the dark user interface – after switching to Adobe XD I actually found that my eyes became more strained with the lighter UI. I am not alone in that, lots of users are calling for the UI to be reversed. It is great to see that InVision have taken this on board and opted for a dark interface for their InVision Studio.
It will be very interesting to see what happens when InVision Studio enters the market! They definitely have a fighting chance but will they be able to overcome the inertia of change? Only time will tell.
You can request early access to InVision Studio here
What will happen?
You would be hard pressed to find someone who believes that Photoshop will cease to be the most popular image manipulation software anytime soon. They have that on lock down.
Whether Adobe can keep its grip on those UI designers that are still loyal is another question. They are being given a run for their money! If they are beaten you don’t need to feel sorry for them. The Adobe suite is full of very popular softwares including Lightroom, After Effects and Premiere Pro so we think they’ll be just fine.
