Translating design into code is not always a quick and straightforward process, particularly when taking into consideration the responsive side (making a site scale down to fit mobiles and tablets).
As a result we often do research into any new tools that aim to improve the design and development process but at the same time maintain and improve our standards.
One piece of software that has recently came to our attention is Sketch. Sketch is similar to Photoshop but it is geared towards websites and mobile applications.
Sketch seems like an intuitive tool, but it was only when we spotted an add on called 'Launchpad by Anima' that it really caught our attention.
The design team were the first to jump into the deep end and actually try Sketch out. Some of the key positive points that came back were:
1. The multi-screen feature is great. Being able to see all the pages and work on them all at the same time helps provide an overall perspective and help identify any inconsistencies in the design.
2. Link and view the site live straight away (using Anima) removes the need to create a ‘preview’ website. Currently the designers use a tool called Invision to turn a Photoshop document into a mock website. Something that typically takes the design team an hour or two. Anima makes this process seamless in Sketch in that hyperlinks can be setup in sketch and publishing mock site is a case of pressing a ‘launch’ button. So overall there is a key improvement to workflow.
3. It’s faster! Photoshop is a very extensive versatile tool but it’s a very bulky piece of software and saving files, applying filters and opening files can take a long time. Sketch seems to be very quick in comparison.
The development team are excited about the prospect. More specifically:
1. Code generation. If the code needs generated is well structured, it will mean we are able to focus more on the functional side of apps and websites.
2. Responsive layouts being completed in the design phase. Currently the developers work from desktop designs and make the site responsive themselves.
Unfortunately, we found it difficult to gauge the quality of the code on a trial as the software scrambles/obfuscates the code generated which is disappointing. However, after signing up for a month we were able to looks more closely at the generated code and our initial impressions are positive.
Overall it’s a very interesting piece of software and if it fits around our key requirement of translating design to code to a high standard it is most likely that we will adopt it.
This in turn will speed up the design and development process while maintaining the same high standard meaning we will be able to able to offer customers more for the same price.
Find more like this via Website Design.