Had a ton-o-fun building out this splash page for designfaith.co last weekend. Mostly, I just wanted to have something up (thats what she said) while I build out my full portfolio site.
The nifty part – no images are being used. Everything is SVG code (check the source on designfaith.co). Learned a tonnn about SVGs and I was actually really surprised with how easy they are to work with. Anyways, here are the pros/cons I found personally during the whole process:
– Completely scalable
– Easily editable with CSS
– Quickly rendered in browser
– No image requests
– Not supported by some browsers (cough, IE)
– Limited access to some attributes
Also, I think its funny the splash page fits in a dribbble shot. #crazyresponsive
Would love to hear your thoughts on the UX, animation, SVG's or whatever else :D
over 1 year ago
Very cool! Nice idea :)
Ooooo super cool. I watched it for like 5 mins.
dude! Didn't I like this already? :) Looks really cool and hypnotic!
cool! Love the border i dont know why..
Dam you! Is this the actual size then?
@Ali – Thanks dude!
@Andrew Colin Beck – Haha, good. Keep you out of trouble for 5 minutes. My job here is done :P
@Rovane Durso – Haha, maybe. Needed some tweaks, so I reposted. Thanks for the double likes though! I have double hugs for you :D
@Eelco Guntlisbergen – Thanks! I do too and I don't really know why either. Helps make everything feel contained in the massive amount of white space? I unno...
@Patrick Rogan – Haha, yeah! It's responsive so it'll center itself on whatever device you're viewing it on. See for yourself – designfaith.co :D
@Josh White – Haha thanks yo. Naw, building that page was the first time I had used SVG. I was surprised though, they're super easy to work with. Learned a lot :D
about 1 year ago
@Josh White – Yeah man, no problem. I think it really just comes down to experimentation and learning what all the attributes associated to the SVG tag do and how to manipulate them. This would be a good place to start – link :D
11 months ago
@Alex Tass — <3
keyboard shortcuts: ← previous shot → next shot L or F like
Show and tell for designers
What are you working on? Dribbble is a community of designers sharing screenshots of their work, process, and projects.
Copyright © 2009–2014 Dribbble LLC. All screenshots © their respective owners. Shipped from Salem, Mass. USA.