33 comments

  • Marc Edwards, 6 years ago

    Over the past few months, I’ve been challenging myself to find the quickest way to create some common and not so common icons. All the icon speed runs I’ve created so far are in this Imgur album as GIFs.

    Many of the GIFs have notes about the techniques used, but feel free to ask me anything about them. I also plan to write up some of the more complex icons as separate articles, if I get some spare time.

    I’m up to 56 images in that album. Hoping to get to 100 at least.

    16 points
  • Sacha GreifSacha Greif, 6 years ago

    Your next client, after seeing this: "So here's the list of icons we need for the UI. I think you should easily be able to do them by tomorrow? There's only 50 of them after all"…

    4 points
    • Marc Edwards, 6 years ago

      Yep, no probs!

      The only downside is that some of these took a lot of research, and a few practice runs to get the final recording done. Oh, and the icons do not form a good set. They look really bad next to each other. And, they’re not all pixel perfect. And, many of them aren’t built the way you’d want them in production.

      But, apart from those issues, sure. :D

      3 points
  • Matt RintoulMatt Rintoul, 6 years ago

    Great stuff Marc! Thanks for sharing

    3 points
  • Adam T.Adam T., 6 years ago

    Why not in Skala?

    2 points
  • Dan MooreDan Moore, 6 years ago

    Thanks for sharing! Looks like illustrator - Any tips or tricks you've discovered through this process that you might be able to share with others?

    2 points
    • Marc Edwards, 6 years ago

      Yep, these were all created in Adobe Illustrator. There’s quite a few techniques that are used across many of the speed runs. Here’s some of the more common ones.

      • Live Corners. I love dragging out those handles. Works well once you get good at crafting the ideal polyline source.
      • Using the polygon tool with a four sided polygon to draw a pixel snapped 45º rotated square.
      • Lots of the Path Finder panel for boolean operations.
      • Lots of Object › Path › Outline Stroke.
      • Lots of Object › Path › Add Anchor Points.
      • Lots of the Graphic Styles set up in the Greyprint templates.
      • Lots of use of the Greyprint actions, too (Outline Stroke and Add Anchor Points in one click).
      • A bit of use of the Width tool in Illustrator.
      • The blend tool and warp also make an appearance.
      8 points
  • Jason MJason M, 6 years ago

    So happy to see those Breath of the Wild ones in there!

    2 points
    • Marc Edwards, 6 years ago

      There’s more of those coming, if I can figure out a good way to draw korok seeds. I might attempt the divine beast icons, too. They look pretty difficult for a speed run though! Trying to get these things done in a single take can be pretty stressful.

      0 points
  • Helen . Helen . , 6 years ago

    You're my hero.

    I totally fav'ed that to my bookmarks so I can watch it again.

    1 point
  • Jacob JJacob J, 6 years ago

    Impressive work. thumbsup.png

    1 point
  • Ricardo GavinhosRicardo Gavinhos, 6 years ago

    Loved this! Thanks for sharing

    1 point
  • stephen fstephen f, 6 years ago

    wow, you make this look so easy... makes me frustrated with myself for not putting time into illustrator

    1 point
    • Marc Edwards, 6 years ago

      There’s still time! Illustrator does so many cool things. Makes icon design a lot easier.

      0 points
  • Dan WilkinsonDan Wilkinson, 6 years ago

    You just made my Illustrator skills look poop haha.

    Well done Marc, great stuff!

    0 points
  • Thomas Michael SemmlerThomas Michael Semmler, 6 years ago

    Imposter Syndrome strikes heavily lol. I would love to be able to do that too.

    0 points
    • Marc Edwards, 6 years ago

      Hopefully there’s some helpful info in the GIFs. I’m not trying to make people feel bad!

      0 points