Sketch has been quickly growing support as the defacto choice for website and user interface design. Released late in 2010 it has continued to enjoy updates and a growing user base.
Supporters have long made the argument that it is hands down better than Photoshop. It’s not too hard of an argument to make as Photoshop was created by Adobe as a photo editing tool.
How Sketch Got A Head Start
Sketch was able to capitalise on this and build an application that is vector based. This means that quality is not compromised by the size. This is important as Photoshop is not vector based it required users to make objects Smart Objects. Sketch champions that they are vector based and pixel aware.
Sketch looked like it was going to run away adding features like objects without hidden paths, snap to pixel, dynamic properties, reusable elements, and many more features.
Adobe Looks To Compete With Sketch
Adobe took note and almost 6 years after the launch of Sketch they are launching Adobe Experience Design CC. The project was originally known as “Project Comet” (because code names cool). Today it was released for Mac OS X, yet a windows version will be released at a later date.
Adobe Experience Design (shortened to XD) is available for (free!) download for users with an existing Adobe account. Even though Adobe has been slow to react to Sketch it has given them time to see what users like and dislike about the app. Adobe also is releasing the application to it’s much larger user base.
XD big sell is that it allows you to build an experience from the beginning to the end. It also seamlessly integrates with your existing Creative Cloud suite. It allows you to go from wireframes to interactive prototypes. This brings in functionality that has recently become popular with apps like InVision.
Adobe Experience Features
The app is still in being rapidly developed yet there are already many features that are sure to make it popular with designers.
User Interface – The UI has a nice clean aesthetic. This is greatly appreciated as the existing Adobe suite is starting to feel bloated and aging.
Draw Vector Artwork – A feature of sketch you can use the tools that you are used to using in Illustrator to create vector graphics. You retain total control over the objects allowing you to edit border color, thickness, etc.
Photoshop & Illustrator Integration – You can pull .svg from Apple Finder but also from AI & PSD. To do this you just need to copy and paste into XD. Because it is a SVG you can edit it directly in XD.
Multi Screen Artboards – Adobe XD starts with an infinite canvas, from there you can choose to create an artboard. It allows you to create an artboard by device size (iphone6).
Repeat Grid – This is one of the most powerful tools that Adobe has put in XD. Once you have a screen with an item that needs to repeat you can select the item you want to repeat. From there you can select “repeat grid”, as you pull down the app will automatically repeat that object. Making a blog just became easier. The styles are global so a change to one of the objects will change the content in the rest of the screens. Repeat grid allows the individual content to be unique. This means that you can change the text or images to the uniform style.
Export Features for Production – Website and application designs don’t stop with the design. You still need to pass your designs to development. XD allows you to export assets as either a PNG or SVG for your development team. You are also able to save for iOS, web, or Android. You also have the ability to minify the size for the SVG direct from the export feature.
Mask Items and Add Images – You can bring any bitmap from photoshop to work with in XD. You can easily mask an image directly in XD. Once you have added an image it becomes the fill and will never become distorted.
UX Prototyping Tools – When you are done designing you can switch to the prototype mode in the top left-hand corner of XD. Once you have selected the prototype mode you can click and drag to map the application interactions. The preview tool makes it easy to test that your buttons are correctly mapped.
Record User Tests – This is where Adobe pushes past Sketch and starts to move into UX tools like InVision. You can create a recording of a user’s interactions with your prototype. Once you are done you can save a .mov file directly from the application. This lets your stakeholders view how users are interacting with your prototype.
New Adobe XD Features
The Adobe team is just getting started. They have mapped their future features in blog posts that you can read here. Highlights of the list include: real-time design preview and testing on mobile devices, responsive design support, API creation for plug-ins, and more design features.
How Will Sketch Respond?
It will be interesting to see how Sketch responds. Almost all graphic designers use Creative Cloud so using XD wouldn’t be a big switch. Sketch does have a much larger plugin library and pricing model.
Pricing?
Right now EX is free for users with an Adobe ID. Eventually it will probably be added to Adobe Creative Cloud which offers software for a monthly fee. When Adobe switched to the monthly model many users were upset and felt like they were being held at gunpoint. Adobe made the move to increase recurring revenue, increase adoption of their newest version, and decrease pirating of their software. Sketch, on the other hand is offered for a one-time cost of $99.
Conclusion
Adobe realized that UI/UX design has moved very quickly. As there are multiple devices and platforms designers need to show designs as working prototypes. Adobe XD is drinking their own Koolaid. They are pledging to update the app monthly based on feedback from their users. We’re curious to hear your thoughts. Drop them in the comments below. Are you going to switch from Photoshop or Sketch to Adobe Experience Design?
