3

I'm looking for some input on your best practices/workflows for creating app wireframes for both iOS and Android.

I'm working on a project now that needs quite high fidelity wireframes for an app we are creating, both for Android and iOS. The problem is how do I best share styles between the two files? If I create symbols of for instance a table, the width of the table won't match, since iOS and Android differs. So I have to detatch the element from the symbol. The problem is now if I want to change a color for instance, I will have to rememeber to update it in both versions. Font/typography settings will also differ between these two.

How can I structure my workflow when developing for both platforms, to reduce duplication of work?

Since I'm using Google Drive sync for Invision, the Android/iOS wireframes will have to be in seperate files as well. :/

  • 1
    In terms of best practice, "high fidelity wireframe" isn't a thing. – plainclothes Jun 22 '16 at 4:41
1

Styles before symbols

Your best bet is to use styles rather than symbols for most layout units. Where the is a good reason to use a symbol (eg global nav), the component items of that symbol should use a style that is synced across files.

Plug-ins fill in the gaps

For the synchronization, I'll have to do some research and get back to you. There is a plug-in that allows you to manage certain style properties in a Google Sheet. You could reference each file to the same sheet. As with most needs in Sketch, there are a few Plug-ins you might want to try. Do some GitHub sleuthing and experiment.

Bottom line

You'll just have to be disciplined. Sketch hasn't yet tackled cross-ffile synchronization.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.