Sketch Plugin Help
- Started
- Last post
- 5 Responses
- nylon
So I have design a site for desktop in Sketch.
I now need to do the mobile version.
Is there a quick way for the computer to figure out the percentage the fonts should reduce to?
Is there a plugin to duplicate the styles and reduce them for the mobile version...
I look forward to your witty responses!
- shapesalad0
Start again and use https://framer.com ???
Automatically resizes your design for different screen sizes.
As someone moving back into UI/Interactive design, having looked at all the tools, Sketch, Invision studio etc - I was quite disappointed. Only Framer appeared to be semi ok.
Back in 2006, using Flash, it's symbols and movie clips, 9-slice scaling and some very simple and light Actionscript I was able to design dynamic layouts and elements that resized depending on screen size. And with a little extra Actionscript take those to fully live websites.
In 2018, the whole process seems antique. Export PNGs, measure the font sizes and gaps between things, tell all that to your frontend dev team, then some back and forth etc.
It was a quick one man job back in 2006.
- hotroddy0
add media query breakpoint to reduce font. I change the css in the browser. browser developer tools are rudimentary but useful to see what looks good. particularly with font sizing.
- zarkonite0
@shapesalad you should maybe have another look at Invision, there's no need to export to PNG or measure anything. You can get specs right out of your prototype. Basically you can go from sketch, to wireframe, to design and prototype in just one suite. There's even a tool for client feedback.
Figma is also really practical and easy, have a look. I haven't used it too much but I audited it for my team.
- brandonp0
Autolayout is handy for setting margins and padding for when you scale down to tablet/mobile. Check out the link:
- zarkonite0
@nylon Don't you need to re-do your entire layout to make it work on mobile?