Spela Hvala
Spela Hvala
  • Видео 3
  • Просмотров 49 182
SVG Optimization - SVGOMG GUI #3
A quick way to optimize your SVG with the help of SVGOMG GUI made by Jake Archibald (an interface that allows you to optimize SVGs by selecting your optimizations, and getting a live preview of how your SVG looks with these optimizations applied). There are other ways and tools for svg optimization but this one is far the best one out there and it doesn't brake your image after optimization.
jakearchibald.github.io/svgomg/
Просмотров: 1 397

Видео

SVG animation tutorial #2, Responsive svg animationSVG animation tutorial #2, Responsive svg animation
SVG animation tutorial #2, Responsive svg animation
Просмотров 3 тыс.8 лет назад
Here are the links that I promised, this awesome article is from Sarah Drasner :www.smashingmagazine.com/2015/03/different-ways-to-use-svg-sprites-in-animation/ and a project from Joe Harrison www.joeharrison.co.uk/projects/responsiveicons and here is my cssDeck where you can find the code from this tutorial: cssdeck.com/labs/4zktgybv And of course I forgot something... if you want you can set ...
SVG animation tutorial #1, quick overview (html, css, js, GSAP)SVG animation tutorial #1, quick overview (html, css, js, GSAP)
SVG animation tutorial #1, quick overview (html, css, js, GSAP)
Просмотров 45 тыс.9 лет назад
This is my first try to make a short tutorial on svg animation that covers the process from creating an svg to animating it with js (GSAP). links used in the turotial: SVG support - caniuse.com/#feat=svg for GSAP - greensock.com SVG editor from Peter Collingridge - petercollingridge.appspot.com SVG optimizer from Jake Archibald - jakearchibald.github.io/svgomg/ I also have some short animations...

Комментарии

  • @GhulamMuhiaudin
    @GhulamMuhiaudin 4 года назад

    You are an artist by voice!

  • @edwinGiraldo
    @edwinGiraldo 5 лет назад

    You voice is great, minus the exploding mic lol - Great tutorial tho, thank you!

  • @heyyy4987
    @heyyy4987 6 лет назад

    Nice, Do it some serie. I would like to see some nice story in parallax mode perhaps.

  • @robertserac9665
    @robertserac9665 6 лет назад

    Do more tutorials please!! :D

  • @ottowhisper3315
    @ottowhisper3315 6 лет назад

    Hi from Ukraine! Tell me please? can I make SVG animation with response on two click differently?

  • @Ivy77813
    @Ivy77813 6 лет назад

    clear and practical!~~~~thankyou

  • @lancsFrogger
    @lancsFrogger 7 лет назад

    make urself a stand up desk. i'm making one myself at the moment (basically just knocking together a v basic box with a lid that opens down as a shelf for my laptop)

  • @Zombymedia
    @Zombymedia 7 лет назад

    OMG great tutorial -> It's easy and good to understand

  • @rokzabukovec4685
    @rokzabukovec4685 7 лет назад

    are you from Slovenia?

  • @wunorfleet2880
    @wunorfleet2880 7 лет назад

    Thank you, very helpful! :)

  • @nightkage3477
    @nightkage3477 7 лет назад

    Amazing, thank you!

  • @samduss4193
    @samduss4193 7 лет назад

    Hello, I enjoy your video I woul love to see a video teaching the drawing animation with SVG. I found some video on the web but they dont teach as well as you do.... take care....

  • @samduss4193
    @samduss4193 7 лет назад

    thanks for the video ;) very nice explanation .. ;)

  • @barzolaalfredo
    @barzolaalfredo 7 лет назад

    im going to start using GSAP!

  • @emmanueljimenez7274
    @emmanueljimenez7274 7 лет назад

    Thanks for you video :D Help me a lot!

  • @SagarNamye
    @SagarNamye 7 лет назад

    Tutorials are Really Best. Loving It. Please Update More. and Your Voice. Woah, Yay :)

  • @cicd
    @cicd 7 лет назад

    Very nice... thxs for sharing

  • @chelseawilliams1408
    @chelseawilliams1408 7 лет назад

    Super helpful, thanks!

  • @BOMA1able
    @BOMA1able 8 лет назад

    thx. nice tut! go on!!!

  • @gowriprasanthvm
    @gowriprasanthvm 8 лет назад

    Hi.. tutorial is amazing. Which tool you are using to draw svg?

  • @herrnebel8340
    @herrnebel8340 8 лет назад

    Get well soon! And don't skip the back exercises. ;-)

    • @spelahvala1270
      @spelahvala1270 8 лет назад

      Thank you! Yeah back exercises became a part of my daily routine now :)

  • @obelich
    @obelich 8 лет назад

    nice tutorial

  • @axe-z8316
    @axe-z8316 8 лет назад

    Hi, where are you from ? that accent is familiar, but ..

  • @SasaHasidRA
    @SasaHasidRA 8 лет назад

    Awesome work Spela! Keep shining brightly! RA

  • @giovannicriscwcc4249
    @giovannicriscwcc4249 8 лет назад

    share some paypal link !!! the value of this training is very high in my opinion and it would be pleasure offer at least a pizza for that, really. compliments

  • @Amrdys
    @Amrdys 8 лет назад

    I really need some kind of Super power to know WHO THE HECK DISLIKED THIS VIDEO!!

  • @sujeet2info
    @sujeet2info 8 лет назад

    monetize you videos!!! and thanks to give startups for SVG learning

  • @rohitgird
    @rohitgird 8 лет назад

    Such an amazing video. Highly recommended to everyone. Great job!

  • @lotwar
    @lotwar 8 лет назад

    Awesome tutorial, clear voice, hope you will make more of tutorials.

  • @mltumz5095
    @mltumz5095 8 лет назад

    im having a heart attack with your mic explosion thing!. . But great tutorial :D

  • @knowledgeispowerrr
    @knowledgeispowerrr 8 лет назад

    great tutorial, actually, don't know why you worried so much, it is very informative and I've learned a lot from it, so thank you and keep up the good work!

  • @RockuMan
    @RockuMan 8 лет назад

    Very useful. Thank you.

  • @liloo999
    @liloo999 8 лет назад

    This is grate, Im Starting to learn SVG animation and this was very helpfull

  • @briotron
    @briotron 8 лет назад

    thank you!!

  • @nedimkufi
    @nedimkufi 8 лет назад

    thank you so much great job but which program you used

    • @hambone111
      @hambone111 6 лет назад

      I think she says sketch in another comment.

  • @sami282149
    @sami282149 8 лет назад

    very nice.. thanks and we want more :D :D

  • @MaxWilliam
    @MaxWilliam 8 лет назад

    Thanks Špela. Great video!

  • @wrabac89
    @wrabac89 8 лет назад

    Great! you should record more shorter tutorials (tips and tricks with svg, hover, etc...) I think you can have awesome channel with amazing tutorials

  • @wrabac89
    @wrabac89 8 лет назад

    awesome! Just please don't tuch the mic when you are recording :)

  • @jasomtodokazal
    @jasomtodokazal 8 лет назад

    You're a great tutor and I look forward to watching more high quality tutorials. Big up!

    • @spelahvala1270
      @spelahvala1270 8 лет назад

      +jasomtodokazal Thank you very much, I'll be doing new tuts soon :)

  • @mamounmokni6814
    @mamounmokni6814 8 лет назад

    awesome ! great tutorial thx

  • @ugarz
    @ugarz 8 лет назад

    Hi, I'm glad you made this video ! You got a pretty crystal clear voice and explain well your workflow. Thanks a lot you convinced me to work with svg. I'd love to see a more complex animation with SVG and Greensock. Keep on doing it !

    • @spelahvala1270
      @spelahvala1270 8 лет назад

      +Ugo Arzur Great to hear that, SVG is really useful! Otherwise Sarah Drasner or Sara Soueidan have a lot of info on svg and svg animation as well, I learned a lot from their articles and speeches.

    • @ugarz
      @ugarz 8 лет назад

      Yeah, I'm currently learning from them too :) I've made a simple store animated behind a circle for mask following your video and I'm pretty proud of it for a first try ! But I think I have to go deeper on timelines, haha ! By the way, I'm using another tool which my please you : svgo. It's a really cool tool written in Javascript and you have two way to use it : SVGO - command-line (with NPM) : github.com/svg/svgo SVGO - GUI : github.com/svg/svgo-gui

  • @Vitr0l
    @Vitr0l 8 лет назад

    This tut is great! Thank you for showing how easy the workflow can be when using sketch + GSAP.

    • @spelahvala1270
      @spelahvala1270 8 лет назад

      +Vitr0l Thank you, it really is great :)

  • @mailethiesen
    @mailethiesen 8 лет назад

    amazing. Thank you!

  • @jerithemes5865
    @jerithemes5865 8 лет назад

    Nice this video, I learn make my first animation js :)

    • @spelahvala1270
      @spelahvala1270 8 лет назад

      +JeriThemes Thanks, that is awesome! :)

  • @creicky
    @creicky 8 лет назад

    this tutorial is very cool!

  • @gunarajesh1
    @gunarajesh1 8 лет назад

    great start to svg thank u :)

  • @juliablaustein5724
    @juliablaustein5724 8 лет назад

    Great tutorial Spela! I am looking forward to more videos! Regards from Brazil :*

    • @spelahvala1270
      @spelahvala1270 8 лет назад

      +Julia Blaustein Thank you, I'll try to find time to do more soon :)

  • @AhmedEssam-lv5vn
    @AhmedEssam-lv5vn 8 лет назад

    thank you Spela thats exactly what um looking for :D likes and subscribed .. goodluck

    • @spelahvala1270
      @spelahvala1270 8 лет назад

      +Ahmed Essam Thank you, glad to hear it :)

  • @lordzero9055
    @lordzero9055 8 лет назад

    Great tutorial i love it thanks a lot <3