A new svg

Fiiz SVG

I have been playing around with some SVG logo animations. I love Fiiz. a lot. Mountain Dew Pegasus FTW!

The powers of SVG

I’ve been spending a good amount of time learning about the infamous SVG, and I would have to say that I think it’s a brilliant invention. An svg for those of you that do not know is a scalable vector graphic so basically an image that is scalable that can be used in a variety of ways, but I like to use them in my websites especially for logo’s. I recently made a logo svg for an employer of mine if you would like to see in on codepen click here to view it. I learned a good amount about the svg from the following sites please check them out.

Jon Suh → good stuff here for animating an svg.

Mozilla → This has it all and is very informative.

Text on Hover

So I had an client that wanted text to appear over an image along with a gradient when you hovered on it. I attempted to do this with my own knowledge first which ended in failure. (sorry it happens) I did do a search to find an answer to my problem and this smart talented web developer created this tutorial. It worked flawlessly for me and it only uses CSS isn’t that productive! (Be aware that it does use CSS transitions which probably won’t work on IE9 or below) Thank you Natalie MacLees.

High-Fidelity Wireframes

wireframe
In my quest of becoming the best web developer the world has ever seen I have turned my focus on UX/UI design. I found an awesome article on wireframes. For those of you who do not know what a wireframe is, it is a mock up layout of a website, or in other words a blue print of a website(look at the Image). In short the article I found talks about how important High-Fidelity Wireframes(more detailed wireframes) are and that they should be used more. I found myself agreeing with this thought and believe it to be beneficial. Here is the link if you want the short but informative read.