Tag: SVG

Dispatches from the Spry Hive: Week 33

Posted by Ken Moire & filed under Tips.

This post is part of a weekly series featuring the latest buzz around the Spry Hive.

“My opinion is it’s a bridge too far to go to fully autonomous cars.”
– Elon Musk

Web Design & Development

Chris Coyier decided to jot down what goes through his head when examining a website. Good items to think about when building your next website.


Microsoft and An Event Apart are teaming up for another 10k Apart, a contest for web designers and developers to create ultra lean, compelling experiences that are under 10 kilobytes in size and don’t use JavaScript. Did we mention there are awards?


Dan Mall, former design director at Happy Cog and technical editor at A List Apart, shares his design trade secrets.


When PHP attacks:


Also found on Twitter… The importance of code reviews:


More emails are opened on mobile devices and that number is growing. Here is a great list of lessons learned from building responsive emails.


Still exploring what you can do with scalable vector graphics (SVG)? Well, learn what’s new with SVG 2.


If you prefer your sites on the static side, then you’re probably familiar with Jekyll. If you’d like to try the new Jekyll Admin before its release next week, they’re looking for early user feedback.


Misc

Twitter has some new features that allow you to better control your experience.


Uber Driverless Car

Courtesy Foo Conner / Flickr via Motherboard

Uber will begin transporting customers around with driverless cars starting this month in Pittsburgh.


After years of financial troubles and its share of controversy, Gawker will end operations come next week.


NASA is making 861 research papers available for free as part of their new PubSpace database. While you can expect the number of NASA-funded articles published to PubSpace to increase over time, the space agency will not be releasing all of their research. Exempt are materials governed by personal privacy, proprietary, or security laws.


Kick your legs up at the pool, beach or backyard and enjoy a lazy summer weekend with the Spry Hive. See you next week!

Dispatches from the Spry Hive: Week 32

Posted by Ken Moire & filed under Tips.

This post is part of a weekly series featuring the latest buzz around the Spry Hive.

“The important thing in life is not to triumph but to compete.”
– Pierre de Coubertin

User Experience

Help your human audience succeed with these eight psychology tips that can improve your designs.


Screen Shot 2016-08-12 at 1.29.21 PM

John Saito from Dropbox explains perspective in interface design in his article Is this my interface or yours?


A solid overview of what companies are testing when they conduct A/B tests.


Graphic Design

1960 Olympic Logo

Olympic logos are often the source of design controversy, so we were gleeful to see Milton Glaser rate every Olympic logo design in history.


Web Design & Development

WooCommerce is a popular ecommerce solution for WordPress, but the lack of a POS option left some stores needing more. Well, WooCommerce has just announced that it will now accept Square payments, allowing retailers to accept purchases from anywhere.


Site performance is affected by numerous factors, including image optimization, code structure and bloat. Many believe that a content delivery network (CDN) can help improve the performance of your site, but it’s not a silver bullet.


The scalable vector graphic (SVG) has numerous advantages over the traditional PNG or JPG. Chris Coyier drops science of how to correctly treat SVGs for resizing and placement.


Misc

The father of the World Wide Web is working on something that could transform the way we interact and share private data on the Internet. Help us TBL, you’re our only hope.


 

A new trailer for Rogue One: A Star Wars Story has surfaced and it does not disappoint. If you like your movie trailers overly analyzed, check out Wired’s take on it.


Thanks Obama – for the Summer playlist, that is. The White House has shared a Spotify playlist featuring favorite jams from the POTUS himself, so our source in D.C. says.


Apple Campus 2

The latest drone footage of Apple’s Campus 2 revealing the scale of the project simply boggles the mind. Our favorite features include the foam formed underground parking structure, the combination solar and fuel cell energy source powering the entire campus, and the security kiosk shaped like a late model Macbook.


We’ll be back to share more from the Spry Hive next week!

Dispatches from the Spry Hive: Week 22

Posted by Ken Moire & filed under Tips.

This post is part of a weekly series featuring the latest buzz around the Spry Hive.

“As you ramble on through life, Brother,
Whatever be your goal,
Keep your eye upon the doughnut,
And not upon the hole.”
– Margaret Atwood, The Blind Assassin

Around Spry

Spry Digital Partner Sheila Burkett is fresh back from her trip to the West where she led training sessions at this year’s CiviCon Conference, the national meetup for the CiviCRM community. Taking place in Fort Collins, Colorado, Sheila had a chance to teach users and developers how to use CiviCRM and met many of the contributors behind the open source constituent management platform. Spry Digital is proud to be marketing partners of CiviCRM, and are excited to see where this software for nonprofits is going!

Design

We’re on a never-ending quest for the lovely typefaces to use on projects. That’s why we enjoy the type tester/font marketplace known as FONTPATH.

Create Adobe

Courtesy create.adobe.com

In the latest Take 10 series by Adobe, designer Joshua Davis takes on the challenge of using 10 stock images to represent the word “weightless”, and the result is dreamy.

It’s official. This is the world’s ugliest color and it’s being used on cigarette packs in Australia to deter smoking.

CMS News

It’s hard for us to believe, but two years on and “Drupalgeddon” still remains one of the most popular vulnerabilities for hackers to exploit Drupal websites. Some will never learn.

Accessibility

Designing accessible websites for every user is important, even for those with dementia.

Web Design & Development

If you design or build websites for a living, you’ve probably scratched your head about the best way to make responsive product comparison tables. Dave Rupert shares his thoughts that the best solution is one that uses different patterns for different content.

We’re constantly amazed with what you can do with SVGs. Here are some fun distorted button effects that you can try on a project.

Glassy Films

Glassy Films website

Sometimes we just like to share other websites that make us happy. The Glassy Films website makes nice use of a double drawer navigation.

Misc

In case you live under a rock, it’s National Doughnut (Donut) Day! So enjoy a fried ring of doughy deliciousness today.

Kanye West has written some of the most memorable rhymes in hip hop. Now you can go back-and-forth with a Kanye Chatbot on Facebook messenger (with mixed results).

It’s time for everybody’s favorite chat tool Slack to get physical.

We just had to share these cute geeky zines by Bubble Sort.

Chick-fil-A’s teaches us all that to be a top mobile app, you just need to give away a sandwich.

If you live in St. Louis, you’ve gotten accustomed to a closed riverfront during major renovations to the Gateway Arch park grounds. This week, the riverfront reopened in spectacular fashion with a picnic at a rather lengthy community table.


Spry Hive out. Enjoy your weekend and see you next Friday!

Dispatches from the Spry Hive 2016: Week 6

Posted by James McDonnell & filed under Tips.

Between a thrilling Harry Potter announcement and various other updates and breakthroughs, the sixth week of 2016 produced plenty to talk about. So, without further adieu, here’s your weekly dose of the Spry Hive!

The Web

POTUS has a difficult job that requires thoughtful consideration about a variety of issues. One of those issues is now password security.

Most people know Yeezy has plenty of absurdly hilarious quotes out there. Well, put them to good use by bombarding your friends with Kanye Text.

Design

voyager-invisible-c

In their attempt to propel us into the future, NASA has recently released three absolutely stunning posters dedicated to space travel.

Apps

Instagram’s latest update on iOS and Android finally allows users to switch between accounts without logging in and out.

Mac users will be delighted to hear that you can now use virtual reality to view your desktop.

Web Development & Design

You can never have enough music for when you’re coding, so don’t miss out on this playlist curated for programmers.

Tired of the same old Lorem Ipsum when developing your websites? Switch over to Post Rationalism Ipsum!

While vector editing tools have been a cornerstone of digital design for over two decades now, the company Figma felt that the mechanisms behind creating and editing vectors were becoming archaic. That’s when they came up with Vector Networks.

Building a truly beautiful email has never been easy, especially when trying to make it responsive too. MJML took up the challenge, though, and just made responsive emails easy.

When it comes to image manipulation, Una Kravets explains how CSS’ lack of per-channel manipulation really holds it back alongside how one uses SVG to truly gain control over color.

Misc.

The Star Wars themed dance album you never knew you were waiting for, featuring Rick Rubin, Flying Lotus, and many others, has been officially sanctioned by the brand’s owners.

Ca29w5EWcAAt9Ej

Harry Potter fans were ecstatic this week as the world-renowned author J.K. Rowling announced the release date of an 8th book, The Cursed Child.

The scientific community was probably the only group of people happier than Harry Potter fans this week. For the first time ever, scientists with the Ligo Collaboration have found proof of gravitational waves.


With the conclusion of this week’s Spry Hive, we all have plenty of reasons to be excited about the future. Don’t forget to stop by next week for more!

Dispatches from the Spry Hive 2015: Week 32

Posted by James McDonnell & filed under Tips.

This week kicked off with rumor that Windows 10 had already reached 67 million machines, but Microsoft quickly quashed the tall-tale, announcing on Monday that the launch period actually saw about 18 million machines upgraded. We saw more than just rumor throughout the week, though, as Lexus’ hoverboard resurfaced and Jon Stewart made his final appearance on The Daily Show. So, hopefully you can find something to enjoy as we dig into this week’s news!

Tech

Just a few weeks ago we found ourselves drooling over the images and concepts of a real-life hoverboard announced by Lexus. Now, making some of us question reality, the popular luxury-car company has released the first video demonstration of their seemingly impossible device.

Web

If you are looking for a quick and easy way to come up with a color scheme, then we’ve found the website for you! Generating colors that looks sit well next to each other, either randomly or based on personal selections you’ve locked into place, Coolors.co is a great web-tool to use on your next project.

Design

applewatchniceday-100602617-large

Source = Microsoft

The Apple Watch has been available for a little over three months, and we are finally beginning to see more third-party applications appear in the Apple Store. One of the biggest issues slowing down the production of applications for their smartwatch is simply trying to design a user friendly experience. That might be a thing in the past, at least for email clients, as, according to MacWorld, the design of Microsoft’s Outlook app shows other companies how it’s supposed to be done.

Pulling together as many icon fonts as possible, fellow designer and developer Tim Pietrusky has made it easier than ever to find, select, and integrate icons into your next web page. We really suggest you check it out because we love icon fonts!

Development

When it comes to implementing truly original and creative design on a website, most developers will agree that there are a plethora of issues that can arise, especially around Graphical Text Effects. Well, Sara Soueidan, a freelance front-end web developer, has reached out through Adobe’s blog to help you weigh out the pros and cons of solving these problems using SVG vs. CSS.

Are you looking to create a more formal web articles that elegantly and effectively utilizes data-driven graphics, tables, and side-notes? Well then look no further than Tufte CSS, a grouping of tools that will make it easy to style your next publication.

Misc.

3049513-slide-s-01-grand-prize-national-geographic-photo-winners-shell

Photo by: Anuar Patjane Floriuk

After receiving and sorting through over 17,000 entries, National Geographic has finally chosen a winner for their yearly Travel Photo Contest. While the selected photo is expectedly stunning, one can find just as much beauty and excitement inside the photographer’s story.

Fans of Star Trek will be delighted to hear that actress Nichelle Nichols, famously known as Lt. Nyota Uhura, will be teaming up with NASA this coming September. Joining the crew aboard NASA’s newest, flying telescope, SOFIA, she will become one of the first humans to take on an active role in one of the agency’s projects as ‘non-essential personnel’.

In a teary-eyed celebration of the cast and crew behind the comedic genius of Comedy Central’s The Daily Show, Jon Stewart hosted his final show last night, bidding his adoring fans a fond farewell. While his departure certainly marks the end of a legendary, side-splitting era, we can rest assured that we haven’t seen or heard the last of him, yet.


Well, there we have it folks. This week’s news sent us looking to the stars as a Sci-Fi icon makes her way through the atmosphere and left us holding on for dear life as we try hovering for the first time. So, go forth, enjoy the weekend, and try not to get stuck in Philadelphia over the weekend or else you might end up like poor Hitchbot.

Dispatches from the Spry Hive 2014: Week 46

Posted by Ben Scherliss & filed under Tips.

In a week during which the human race somehow, some way managed to land a space explorer on a freaking COMET, much of the news was naturally dominated by the Moon of Kim Kardashian. But then, maybe this is why we compile Spry Hive each week. We’re out here trending a little differently with a little tech, a little development, and some silliness too. So let’s get on to it.

Web

If you read last week’s Spry Hive, we discussed Mozilla’s launch of a new browser for developers. As an additional part of it’s tenth anniversary the company is also launching a special release of Firefox with new features that it says puts the user in control. Much of this appears to translate into one word: privacy. New additions include a pre-installed search option which doesn’t track the user’s identity or search results and a “Forget” feature which clears-out recent activity.

With Google’s recent announcement that https sites are a positive factor in search engine rankings, many with http addresses are taking notice and coming on board. Google itself also provided a few additional positive points as to why a non-ecommerce site should go https, such as the protection of data integrity and the trust factor amongst users. If you also find that interesting, Bill Hartzer expounds a bit more in this article.

Tech

Tuesday Microsoft released a gang of hot fixes for a set of bugs called Schannel which, according to the company, could be one of the most serious threats that the Windows operating system has faced in years. As this affects nearly every version of Windows currently on the market, here’s more detail as to why you should drop what you’re doing and apply the latest update now (if you haven’t already).

Big Hero 6

Animation takes another big step forward with the release of Disney’s Big Hero 6.The film features the debut of Hyperion, which is a cutting-edge light rendering software that Disney’s artists and engineers have been working on for the past two years. In simpler terms, the software tracks how light rays bounce off multiple objects in an environment before they enter your eyes. “Seeing is believing,” may have never been as fitting as it is now.

Development

Do you suffer from “Blank Walls Syndrome?” Do you tend to think every nook and cranny is screaming for an object, painting or piece of furniture? Well, often these same urges can overcome Developers during site builds as well. It’s a concept called horror vacui, which is the natural tendency of humans to fill empty spaces with stuff. As this writer explains, the lesson for both interior design and development is simple: “If you want your software to be perceived as valuable, don’t fill every empty corner with some kind of feature or widget.”

Not to be outdone by Google’s debut last week, Amazon has now followed with their own announcement of it’s first docker-centric product. Their EC2 Container Service for managing Docker containers on its cloud computing platform. It’s available in preview now and developers who want to use it can do so free of charge.

If you’d like to manage all of your Vagrant machines in one place, take a look at Vagrant Manager for OS X, which is both customizable and has indicators for which VM’s you have up or halted.

From our friends at Javascriptissexy.com come these guides for learning Meteor for both beginners and seasoned developers. They even start-off with a comprehensive overview of the technology before you invest any time and resources.

If you’d like a little primer for SVG’s and their benefits, we like this write-up on Styling And Animating SVGs With CSS. They also go over how to export and optimize SVGs, techniques for embedding them and how each one affects the styles and animations applied.

Misc

What’s in a Gnome? Well, a lot for non-profit Gnome Foundation, which recently challenged Groupon’s use of it’s trademarked Gnome namesake. Groupon attempted to strong-arm the small company and take over the “Gnome” name for it’s new tablet point-of-sale system. The non-profit then raised over $87,000 in donations to oppose registration for the trademark, and Groupon eventually backed-off.

So, you think you’ve got skills? Well, let The Skill Project be the judge of that. Their aim is to build the largest, most accurate skills database ever made by allowing a diverse and skillful community to contribute their individual skills to a global map. The thinking is that humans have been around for centuries, yet we have no actual comprehensive database of all the various human skills.


With that, we’ve reached the finish line of Week 46. Come on back around next week for another full serving, and we’ll have you covered. And as always, please do leave a thought or comment below – we’d love to hear from you!

The Pixel Is Dead, SVG’s Are Killing Them

Posted by Phil Ecker & filed under Web Development.

What? The pixel is dead? Ok, maybe not 100%, but it’s well on it’s way and I’ll tell you why: SVG’s are killing them. First, for those of you who don’t know much about SVG’s, SVG stands for Scalable Vector Graphics. What does that mean? Simply put, it’s a graphic that is created with XML. All modern web browsers have some form of support for SVG, and there are sites like Can I Use that show what browsers support SVG’s.

Here is my list of the reasons SVG’s are better than pixel based images.

SVG’s are:

  1. Easily editable – SVG’s can be edit via a text editor being they are XML based or can be created through program like Sketch, Inkscape or Illustrator.
  2. Searchable and Indexable – Adds additional content to your site that can be searched/indexed by Google.
  3. Look great on retina displays – They don’t require libraries like retina.js or multiple versions of an image which reduces number of page requests.
  4. Scales without distorting – Since SVG’s are created with code they can be scaled without becoming pixelated, allowing you to use one image at different sizes.

There are instances where you’ll still need to use something other than SVG’s. For example, anything older than IE 9 would require the use of non-SVG images. In theses cases, using something like Modernizr is a great way to do SVG fallbacks. Or if you’re looking for something really lightweight and don’t need any gradients, you may instead opt use a Icon Font. Like SVG’s icon fonts scale well, and they have the ability to accept text based CSS being they are a font library.

With all it’s advantages, there are still instances where you’ll need to use pixels or maybe Icon Fonts, but SVG’s are still a great tool for any developer in an age of HD/retina displays.

Dispatches from the SpryHive 2014: Week 17

Posted by spry & filed under Tips.

Guys. Hold up. Tomorrow is DrupalCampSTL. How have you not grabbed a ticket yet?

We’re putting the finishing touches on our presentations so we’ll keep this SpryHive short and sweet!

  1. Have a Grunt Gulp down some Broccoli at Brunch. Or, how to give your CSS a spring cleaning tidy up.
  2. Webfonts are beautiful but also a little load heavy. A friendly hint to get your sites to load faster.
  3. Cagematch: Inline SVG vs Icon fonts.
  4. 30% of people already get the bulk of their news from Facebook. Obviously, Facebook wants in on that action.
  5. Lost Andy Warhol works found on old Amiga disks. Give that man another 15 minutes.
  6. Cookie-less, cross-device marketing. It’s a thing.
  7. The internet is going private and the demand for bandwidth is up to 138 Tbps. That is a LOT of LOLCats. 
  8. An attempt to create a universal icon set for verbs. What do you think – is “headbanging” a daily use word? We think so.
  9. The most egregious (and hilarious) misuses of quotation marks. Bad, grammar, bad! Go sit in the corner.
  10. Last week we brought you Google Easter eggs. This week, have some Chrome Experiments for your entertainment.

Have a fantastic weekend, everyone!

Dispatches from the SpryHive 2014: Week 13

Posted by spry & filed under Tips.

Happy Friday, folks! We had a visitor this week and posed for pictures. Curious? Read more.

We’ve been busy bees this week so most of our clickable tidbits are heavy on the tech details.  Hopefully, you’ll find something you can use.

  1. Another Javascript framework? See what makes Ractive.js different.
  2. A neato front-end trick using SVGs and Custom Fields in WordPress
  3. Want to level up your knowledge of Flexbox? The Complete Guide to Flexbox.
  4. Controlling image loads within your code.
  5. We’re big fans of Google Drive and were excited to play around with some of their new add-ons.
  6. Obsessive about your Android apps but wary about security? Stick with the Play Store to avoid Malware.
  7. More of an Apple person? Check out the move to bring iBeacons into the home.

That should wrap it up for this week. Get outside, make something, be awesome.