Edit product
Your Cart
    Subtotal

    Is this your street address?

    Card

    路路路路 路路路路 路路路路 4242
    Test card

    05/18

    Card

    Use a different card?

    Card

    pp paypal

    or pay with

    We do not keep any of your sensitive credit card information on file with us unless you ask us to after this purchase is complete.

    or pay with

    Please confirm your location:
    You'll be charged .

    Your purchase was successful!

    We charged your card and sent you a receipt

      Gumroad Library

      Download from the App Store or text yourself a link to the app

      $0+

      Isometric grid and elements for sketch

      Isometric version of illustrations & designs are one of the eye-popping styles preferred by the majority of the graphic artists, illustrators and designers. I've made this file & distributing on Gumroad as my 2nd freebie after getting a lot of requests especially from sketch app users. Also, check out my earlier UI color resource freebie that shared on Gumroad before. 


      Here is the isometric grid + elements pack I posted on Dribbble recently. If you're a sketch app user, you'll definitely love this isometric grid along with the given isometric elements in this pack for Free. Enjoy this freebie and buy me a coffee if you like 馃槑 


      What's Included

      1. Isometric grid for sketch (more than 1600x1200px)

      2. Basic isometric elements as you see them on the product snapshots. 

      *You need sketch 51.3 and above in order to open/edit this file. 


      The Process

      I did spend a lot of time to figure out how the hell I can use the SSR method aka scale, skew, and rotate within Sketch app.

      But, sketch app won't let you skew directly. You can skew any vector shapes by using the transform tool followed by scaling + rotating. The principle I have applied was to create the base isometric grid using the same -30 degree, -150 degree and its vertical axis having equal spacings. Just ignore the exact measurements for now. :) It's just a grid, and not a geometry class 馃槑

      Basically, 1. you can draw a box/rectangle shape over the grid 2. rotate 45/-45 3. place the shape to match the grid after the rotation 3. now use the transform command (cmd + shift + T), now select one of the 8 nodes (in my case, I select the bottom center one) and use the keyboard up/down key to transform the shape until it matches one of your isometric grid units. Yeah it鈥檚 a manual process though. But believe me, once you鈥檙e done with all the basic elements, it鈥檚 just a matter of compositing. 4. now use the rotation tool to rotate -60, 60, 120, -120 respectively to get your desired angles/isometric faces. That鈥檚 the trick.

      *The isometric grid template for sketch is larger than 1600x1200, which is best suitable for website headers, landing pages, etc. But, just make sure you don鈥檛 resize the grid using the sketch scale tool. It will increase the thickness of the lines/strokes inside the grid. Just use the resize method using height/width in the right inspector panel.

      I鈥檓 sharing this isometric grid + elements for free no matter how much espresso I had making this project. 馃槑 I hope you like it.

      Connect with me via

      You can also connect with me via DribbbleLinkedIn, Pinterest, Twitter, Behance, GitHub, Medium, Codepen, Instagram, Facebook, Google+, Quora, or eMail at anytime. Cheers! Also, if you would like to be part of our UX slack community, join us by using our self invite link, or get it from our GSIUXD website. Thank you so much for your 馃挅

      Sorry, this item is not available in your location.
      Sold out, please go back and pick another option.

      You've purchased this product

      Give it a rating:

      See it in your library

      View in Library

      Name a fair price:

      0 ratings

      • Size 3.92 MB

      Checkout

      Isometric grid and elements for sketch

      Enter your info to complete your purchase

      Card

      路路路路 路路路路 路路路路 4242
      Test card

      05/18

      Card

      Use a different card?

      Card

      pp paypal

      or pay with

      We do not keep any of your sensitive credit card information on file with us unless you ask us to after this purchase is complete.

      or pay with

      Please confirm your location:
      You'll be charged US$0.

      Your purchase was successful!

      We charged your card and sent you a receipt

        Gumroad Library

        Download from the App Store or text yourself a link to the app

        Good news! Since you already have a Gumroad account, it's also been added to your library.

        Powered by Gumroad