Category Archives: Show & Tell

Show & Tell: Google Video – How Video Gets to You

by

0

screen-shot-2016-12-06-at-1-13-48-pmGoogle always has awesome animations. They truly are on the forefront of CSS animations. So I was watching a video (Sharon Jones & The Dap-Kings ‘This Land Is Your Land’ live in Chicago) on YouTube the other night, and it was a bit choppy. Google put up a notification bar below the video asking if my video playback was having trouble. Curious, I clicked the link. I was first presented with a Google Video Quality Report. From the page: “There are many factors that influence your video streaming quality, including your choice of Internet Service Provider (ISP). Learn how your ISP performs and understand your options.”

There is also a link that explains how video gets from them to you. This is the part that I loved. The animations show you in simple terms how video travels from them to you, using an image from the video you were watching as an example. Have a look!

Show & Tell: 10 HTML+CSS+JS experiments to try out

by

0

screenshot-2016-11-29-12-29-05I found an article hosted by the CSS Design Awards site that shows off 10 experiments using HTML+CSS (and sometimes JavaScript) to produce some amazing effects.

There’s an effect called tearable cloth, which, while not very practical, shows the amazing things you can do with HTML, CSS and Javascript. There’s a peelable sticker, which I could see used to reveal a coupon code on an e-commerce site. There’s a “jelly” scroll effect for mobile devices that looks sharp. There’s also, for you diehard Star Wars fans, a Star Wars-like text scrolling effect like the movies. And then my favorite, the 3D unfolding dropdown menu.

All of the effects are presented through codepen, so you can see how to implement these effects in your work. Check out the article on CSS Design Awards.

 

Show & Tell: Dealing with the Pressures of Constant Creativity

by

0

This week’s show & tell is an article that could prove useful in our futures. In a world where we are pushed and pressured to think creatively – and do it quickly – sometimes we’re just not feeling it. Envato’s blog (the people behind Tuts+) has some tips for us.

https://envato.com/blog/dealing-pressures-constant-creativity/

Show & Tell: Duet Display

by

0

Duet DisplayIf you’ve ever wished your Mac had a touch screen, good news! An ex-Apple Engineer came up with an app for that.

The app is called Duet Display, and it turns your iPad or iPad Pro into a touch screen-capable additional monitor for your Mac. You only need to connect your iPad and Mac using the Lighting connector and run the app, and voila!, your iPad is an additional and powerful screen for the Mac. Continue reading →

Show & Tell: Bright Bright Great

by

0

Bright Bright GreatI am in love with Bright Bright Great’s landing page. Everything from the background video to the typography made me fall in love with their site.

For those not in the know, Bright Bright Great is a design, strategy, and technology agency based in Chicago’s Avondale neighborhood (OK, if you want to get super technical, they’re in the Belmont Gardens neighborhood, but we won’t split hairs).  Continue reading →

Show & Tell: Material Design for Bootstrap

by

0

Material Design for Bootstrap marries together the best of Google’s Material Design and Bootstrap in one easy-to-use framework.

Material Design for Bootstrap marries together the best of Google’s Material Design and Bootstrap in one easy-to-use framework.

It’s no secret that I love Bootstrap. I’ve started using the new 4.0 Alpha version for my redesign/rebrand project, and that’s been quite an undertaking since there’s a lot that has changed in the way Bootstrap does things.

But while I was researching the new 4.0 Alpha version, I ran across something new and unexpected. May I introduce to you Material Design for Bootstrap, putting together the best of Google’s Material Design and Bootstrap.

Continue reading →

Show & Tell: COLOURlovers

by

0

COLOURlovers ScreenshotOne of the coolest websites I’ve been following for a few years now is COLOURlovers (yes, spelled the proper British way). Much like Adobe Color (formerly Adobe Kuler), it hosts user-generated colour pallets that you can peruse and use. COLOURlovers actually pre-dates Adobe Kuler/Color by a few years. Like the Adobe Color website, it also allows you to download most colour pallets (except those the author chooses to disallow downloads) as an .ASE file for use in Illustrator and InDesign, .ACO for use in Photoshop, as well as colour pallets in many other different formats, including plain text with HEX codes for the web.

Definitely worth checking out for inspiration for your next design or web design project.

Show & Tell: Brand New

by

0

screenshot-2016-09-27-09-22-14Being a design geek, I dig checking out the newest brand refreshes as they’re released. On the blog Brand New by the design firm Under Consideration, they present the latest brands, review them, and let the design community weigh in.

The real star here is the comments section. I know we’ve all trained ourselves not to read the comments (because, you know, you’d like to keep your blood pressure in check and not have a stroke), but the commenters here are usually on their game with comments that are either well thought out or a bit whimsical. It’s safe to read the comments. Really, it is.

Show & Tell: CSS-Tricks

by

0

CSS-Tricks Screenshot

CSS-Tricks always has informative articles about new CSS features and methods, as well as an ever-evolving ‘almanac’ of CSS selectors and properties and how to use them.

CSS-Tricks has got to be, hands down, one of the most interesting and useful resources on the web I have ever found. As CSS has evolved, so too have the methods of doing things, and CSS-Tricks keeps you up to date with the latest.

The site also has an ‘almanac’ feature, where you can lookup CSS selectors and properties. They then show you how to properly use the selectors and properties to achieve the results you’re looking for.

Continue reading →