140 vector devices & mockups for Sketch by Meng To(designcode.io)

almost 6 years ago from Emile-Victor Portenart, Founder, Designer @ Marker.io

  • Meng ToMeng To, almost 6 years ago

    Thanks for posting this Emile-Victor!

    This project is a follow-up of the iOS 9 GUIs I released a few months earlier. 3 years ago, I couldn't imagine creating such complex vector illustrations in Sketch, but now that the vector tools have matured, combined with the awesome Magic Mirror Plugin, this is all possible.

    Happy to answer any question about the process! :)

    6 points
    • Joe Blau, almost 6 years ago

      Your work is amazing.

      Thanks!

      2 points
    • Kurt MadsenKurt Madsen, almost 6 years ago

      I'm curious what these donut charts/pie graphs are meant to represent. Can you shine some light on that for me?

      Screenshot

      0 points
      • Meng ToMeng To, almost 6 years ago (edited almost 6 years ago )

        YES! I was hoping that someone asked this. I did some research and the only thing I found was a donut script which didn't exactly do what I wanted.

        The way I did it was a lot more straightforward: you create the donut in Sketch, export that to SVG and extract the code. Then, you take the dasharray="450,900"(The dasharray values are the same in Sketch's border options), animate it in CSS using transition. That's it! https://designcode.io/cloud/sketch/CCzgdl3UUAAYFfu.mp4

        0 points
        • Kurt MadsenKurt Madsen, over 5 years ago

          But what do they mean? What is the 100% on these and how does it relate to the number you have in the middle of the donut?

          1 point