I maintain a proper numbering system to be able to refer to those screens easily in other communication tools (jira, confluence, slack, Zeplin, etc.). The screenshot below describes how I name and organise the different canvas within the page for the browse flow. Let’s take the example of Browse, or how the user navigates through products to find his desired item. It reinforces the action user wants to achieve. That way it highlights what the user wants/have to perform. I like to have sections named with a verb. While Zeplin can only hand off design specs, assets, codes and styleguides. a sketch page) contain the screen design for a particular user flow/scenario. It’s easy to add more and more stuff but beware people who will read the document who be as familiar as you in the system you are building and therefore will likely to be more confused by that information galore. I try to keep it simple as much as possible and don’t shove too much info in it. a link, an action, a module, a private area etc.). I use a specific key to highlight what the content type of pages elements ARE (eg. Let’s take the example of a shopping app, it would look something like: I use pages for the different “user scenarios”. In this article, I will describe how I organise my sketch document and how I use it in conjunction with Zeplin to share the design with others. It becomes the ultimate designer/pm/dev combo to go from design screens to a working product. A Sketch plugin for working with print units (inch, cm, mm) in Sketchs pixel world. With the Zeplin open API and webhooks, you can also create custom workflows to support your specific needs. Sketch is an amazing tool in combination with Zeplin. Leverage your investments in tools like Jira, Trello, Slack and VS Code through deep integrations with Zeplin. I keep a manual versioning system and create copies just for major changes. Here’s how to start a project: Starting a Zeplin project. That way I have one central place to keep everything design-related to the project. Zeplin works as a plugin within Sketch, so uploading designs is a one click job. I am somewhere between the prototype (invision) and the build (code). Figma, InVision and Zeplin have a fixed monthly fee (around 10). Lunacy is optimized to allow you to open >100mb. Icons8 team (creators of Lunacy) continually works on improving the performance of the product. I am talking just during the production stage - when I already know what to build, why we are building it and how it should “work”. It means that you can work on Sketch files from anywhere. I took that opportunity to document my design workflow (during the production phase) using Sketch. I used them all the time and they are part of my workflow. Those documents are essentials to communicate clearly the design to the rest of the team. I recently came across the Nielsen Lab article about wireflows - a document that merges a wireframe and a task flow.
0 Comments
Leave a Reply. |