profile picture

IAMZR BLOG

Hi, I'm Zach (@Bluetidepro). I'm a front-end web designer from Indianapolis that now resides in Chicago. I'm a passionate creative that has lots of things to share....
framerjs:

Creating GIFs
By Jorn van Dijk
A great way of showcasing interactions or animations on the web is by using GIFs. Compared to video files, they’re relatively small in size. Here’s a short tutorial on how to export great looking GIFs.
1. You can use QuickTime from Apple to record directly from your screen. Open it and go to ‘File -> New Screen Recording’. Make sure to deselect 'Show Mouse Clicks in Recording' from the Screen Recording window.

2. It’s best to keep your recordings short. Think a bit up front about how you want to compose your recording. Background, perspective and dimensions are valuable presentation assets. Keep your recording under 5 seconds and your GIF will stay reasonable in size. QuickTime will export the video in 60FPS when you save the video as a .mov file.

3. Photoshop is great at exporting GIFs. Open the .mov file and go to ‘File -> Save for Web’. Select GIF as the file extension, and you’ll be presented with the settings from the screenshot above. Your GIF will look best if you set Colors to 256 and Dithering to ‘Diffusion' with a value of 100%. Keep an eye on the file size shown in the bottom left of the preview window. The optimal settings are different for every GIF, so play around until you're satisfied with the result.
Pro Tip: Try rendering your video in 30FPS for smaller file sizes. In Photoshop, go to ‘Export -> Render Video' to change the frame rate.
Final step: hit save and you’re done!

framerjs:

Creating GIFs

By Jorn van Dijk

A great way of showcasing interactions or animations on the web is by using GIFs. Compared to video files, they’re relatively small in size. Here’s a short tutorial on how to export great looking GIFs.

1. You can use QuickTime from Apple to record directly from your screen. Open it and go to ‘File -> New Screen Recording’. Make sure to deselect 'Show Mouse Clicks in Recording' from the Screen Recording window.

2. It’s best to keep your recordings short. Think a bit up front about how you want to compose your recording. Background, perspective and dimensions are valuable presentation assets. Keep your recording under 5 seconds and your GIF will stay reasonable in size. QuickTime will export the video in 60FPS when you save the video as a .mov file.

3. Photoshop is great at exporting GIFs. Open the .mov file and go to ‘File -> Save for Web’. Select GIF as the file extension, and you’ll be presented with the settings from the screenshot above. Your GIF will look best if you set Colors to 256 and Dithering to ‘Diffusion' with a value of 100%. Keep an eye on the file size shown in the bottom left of the preview window. The optimal settings are different for every GIF, so play around until you're satisfied with the result.

Pro Tip: Try rendering your video in 30FPS for smaller file sizes. In Photoshop, go to ‘Export -> Render Video' to change the frame rate.

Final step: hit save and you’re done!

Stock Photography is Ready for it’s Return

Note: It takes to read this post.

Stock Photo

In the past few years, I’ve heard increasing amounts of clients/colleagues discuss and ask for my opinion on the usage of stock photography on their websites. The various points of views and debates regarding stock photography usage can be all over the place. Some professionals think stock photography only dilutes your brand, and lowers the value of your content. Others will swear by its usage because of the many benefits like the costs or availability. It can sometimes be a tough sell to executives who have only heard the bad press buzz that stock photography has received. And in fact, when I was working at Angie’s List as a UX/UI designer, there was a big movement from executives for never using stock photography for the website user interface (UI), but there was never a clear understanding regarding why we were told this. So lets take a step back and look at the real problem of stock photography – the poor usage of stock photos that are seen in the wild and the true basic understanding of what stock photography is and isn’t.

Imagine you are talking to someone who has only ever tasted pizza once (impossible, I’m sure, but bear with me). They tell you about how much they hated it and how they will never try it again because the first time they ate pizza, it was just so horrible. So naturally, you query about their pizza, asking them where they got it, what toppings they ate and what of style it was made. You then try to explain to them that the gas station slice of pizza they had was nothing compared to the amazingness of Chicago deep dish pizza (let’s be honest – it’s the best). But there they are, unwilling to try it again because they assume all pizza is just as shitty as the single lukewarm slice they got at a local BP gas station. If you are anything like me, you would also be pretty upset that they had built up this misconception of pizza all because of the one bad experience they had. That is my (tasty) analogy about how stock photography is viewed by many people.

Read More

Adiós 2013. Hello 2014!

Note: It takes to read this post.

2014

Now that we are a few days into 2014, I thought it would be a perfect time to go back and recap 2013, and then talk about the upcoming year of 2014. At the start of 2013, I made the post “Goodbye 2012. Hello 2013!" which went through my 2013 new year resolutions, thoughts, goals, etc. Little did I realize at the time how changing of a year it was going to be, though. There was quite a few unexpected turns early on in the year. Now before I dive to far into all of that and then 2014, I wanted to at least recap my goals I had set for 2013.

My work resolutions for 2013 were:

  • FAILED - Finish my first HTML5 game, Sulli
  • PASSED - Take a bigger stab at learning Ruby (via Treehouse)
  • FAILED - Launch “The Theme Fox
  • PASSED - Continue to grow my skills in PHP, CSS, HTML, and jQuery/Javascript.

Based on the above goals I had set for 2013, I would have gotten a big fat stinking “F” (50%). Sighhhhhhh. Ha. I’m okay with this, though. I think 2013 was still quite the year for me. It was definitely life changing in many ways:

  • In May ‘13, I left work at Angie’s List in Indianapolis, IN for a job at ParkWhiz.com in Chicago, IL
  • I went to CSS Dev Conference in October (see my review) in Denver, CO
  • I released v2 of my jQuery plugin, JamCity
  • I redesigned my blog (as you can see! ha)
  • I had my “Golden Birthday” (turned 24, on December 24th)
  • I made a tons of memories throughout the year

While that is just a small list of some amazing things that happened to me in 2013, it does help give more light to my busy life in the past year. I also think it helps give credit to why I fell short on my 2013 goals.

Lets now focus on the future, onto 2014. I want to say that I have a good feeling about this year. I like to think that since I just had my Golden Birthday, that I’m now gifted with good luck all year while I’m 24. So, naturally, I like to refer to 2014 as my “Golden Year”. Haha. Some exciting things happening during my Golden Year range from my brother getting married in the Spring, to taking a few vacations to new places that I have never traveled to before. I also have quite a few goals and resolutions for this year.

2014 Resolutions & Goals:

  • I’m going to take a second stab at getting “The Theme Fox" launched (after missing that goal in 2013)
  • I’m going to be journaling every day of 2014 (via Evernote) in a private notebook for myself
  • I’m going to try to get at least one speaking engagement at small conference or meet-up
  • I’m going to be more serious with using Mint.com to track my financial goals/budgets
  • I’m going to continue to grow as a front-end developer by pushing my skills and knowledge further
  • I’m going to be blogging more often (I even have a good list of topics/posts already)

Those are my main goals for 2014. There are plenty of other small personal goals I have for myself, as well. I think the main goals will be very challenging for me, but I feel very motivated, inspired, and confident that I’ll accomplish them all and make 2014 one incredible Golden Year!

As always, wish me luck, and also have yourself the best 2014! :)

Addding a blog to your Storenvy store

Note: It takes to read this post.

storenvy

Recently, Storenvy announced an awesome new feature where they added support for custom pages in your store. I know this has been a long awaited featured because it now opens up lots of possibilities on new features and pages you can include in your store. One of the things this will now allow you to do is to integrate your existing blog service (Wordpress, Tumblr, Blogger, etc.) into your Storenvy store. After this feature was launched, I was approached by my good friend Adam Hendle (the Director of Community at Storenvy) to help them out by writing a nice little blog post tutorial on how to add a blog to your Storenvy store on their newly created blog for store owners. You can find that official blog post here on the new Storenvy resources blog for store owners. I also just wanted to briefly talk about the background of the blog post to give some more insight on the plugin I created.

Read More

CSS Dev Conf 2013 Review

Note: It takes to read this post.

cssdevconf

Earlier this week I attended the CSS Dev Conf 2013 (put on by Environments for Humans) in Estes Park, CO at the famous Stanley Hotel (where Dumb & Dumber was filmed, and where Stephen King got his inspiration for The Shining). The conference went all out and spared no expenses at this amazing location for a small to medium size group of us CSS hackers. While expensive (for me it was $545.00 after a $50.00 discount code), the conference aims to make it the ultimate CSS conference in the USA. Before I dive more into the in-depth review, I would like to give a quick Tl;dr:

Tl;dr

Overall the conference was great. It was a bit pricey for only 2 days of speakers after you factor in the flight from Chicago and hotel (easily over a grand after everything), but not many conferences these days are cheap. There were probably only 2 of the 12-ish presentations (that I saw) that were sub-par from what I was hoping/expecting. I would easily go again next year as long as the distance and price are right again, and don’t go up even further.

Read More

Goodbye 2012. Hello 2013!

Note: It takes to read this post.

2012 was very good to me. I got a new job, new place, met lots of new people, built up lots of friendships/relationships, and many other great things. One thing I always try do in a new year is make new year’s resolutions, however I have never actually publicly shared those resolutions. I’m going to try something different for 2013 and share those resolutions here on my blog, in hope that they push me a bit harder to stay on track with them. I feel that if I post them online I will be more accountable and pushed harder to stick to these resolutions for the full year. I have broken down my resolutions below…

Work Resolutions:

  • Finish my first HTML5 game (it will be free), Sulli.
  • Take a bigger stab at learning Ruby (I already started learning on Treehouse), on a more serious level.
  • Launch “The Theme Fox" and get a few themes/plugins finished then put on sale.
  • Continue to grow my development skills in PHP, CSS, HTML, and jQuery/Javascript..

I feel like this is a good start. I’m very determined to knock out all of these resolutions by the end of the year. I want to make 2013 even more awesome than  2012!

Wish me luck! :)

From Quora: What should I do when my client says that my design is plain?

Note: It takes to read this post.

From Quora: Where should be the best location for a search bar on a website?

Note: It takes to read this post.

Instagram Blog: Thank you, and we're listening

instagram:

Yesterday we introduced a new version of our Privacy Policy and Terms of Service that will take effect in thirty days. These two documents help communicate as clearly as possible our relationship with the users of Instagram so you understand how your data will be used, and the rules that govern…

From Quora: Who are the best iOS UI/UX designers to follow on Dribbble?

Note: It takes to read this post.

From Quora: Are people with visual problems something UX designers need to think about?

Note: It takes to read this post.

How I got to know “everyone”

Note: It takes to read this post.

image

One thing I hear a lot from friends and family is, “Zach, you know everyone!” While they are obviously joking to some degree, they do often wonder how I got to know all of these people from around our city to all over the world. If there is one thing I understand in life, it is the power of networking. I will admit that I’m a very personable person which makes networking easier for me. I have always been the type of person that loves getting to know new people. I enjoy hearing stories about people’s lives, their work, and making relationships. I wanted to write this post for people who brush off networking because they are just simply bad at it or don’t recognize the value. I want to show them that the work put into networking is well worth the tremendous value it holds, and that it is not very hard to do.

Read More

From Quora: Are social networks really necessary for a freelance designer?

Note: It takes to read this post.

From Quora: What are tips for designing UI for both the iPhone 4/4S and the iPhone 5?

Note: It takes to read this post.

danetattoo:

#picstitch#space#tattoo sorry for the contrast only way I could get a good shot:( (Taken with Instagram)

My new tattoo by Dane!

danetattoo:

#picstitch#space#tattoo sorry for the contrast only way I could get a good shot:( (Taken with Instagram)

My new tattoo by Dane!