jQuery Emoji Picker

posted on June 20th, 2016 in Freebies, Programming, Tutorials

While at Wedgies last year, my team decided that we wanted to hop on the April Fools Day bandwagon and release something to hopefully garner a little press. But rather than creating something silly and useless, we thought it would be more fun to create something that people would actually use. And that’s how the jQuery Emoji Picker was born.

Quickly after being hired at Wedgies, my team learned about my love and adoration for emojis. This led to us discussing adding emojis to Wedgies polls, however, I wasn’t able to find a plugin that I liked enough or which had the features I felt would lead to a comfortable experience for the user, namely:

  • Search by shortcode
  • Recently used
  • Easy-to-understand taxonomy/sorting
  • A clean design

Additionally, I wanted the developer (in this case, us) to choose which emoji set to use out of the 3 popular sets: Apple, Twitter (my personal favorite), and Google.

The most difficult part of the picker was the taxonomy. The JSON data that we used for the emojis was based upon the wemoji repository, but the data had no specific ordering to it. Smiley emojis were intermixed with symbols and food and flags, etc. Because the ordering and taxonomy was incredibly important for users being able to find the emoji they were looking for, I spent an entire day ordering the data appropriately. Ooof.

This has been one of my favorite projects to work on to-date, in part because I really love emojis, but also because it’s been a highly useful project both professionally and personally. There’s still some bugs and tweaks to work out, but it makes me immensely happy to see others using and contributing to it as well.

I have installation instructions written on the Github repository, so I won’t reiterate them here.

0

Your Skillset Isn’t Enough

posted on January 14th, 2015 in Opinion

Lately, I’ve been doing a lot of thinking about what makes a developer great beyond their skillset and knowledge. I am now unemployed for the first time since I was 18, and when I got the news that the startup I was employed at was closing its doors, I didn’t worry or panic (too much). I am in the very fortunate position to have a career in an industry where jobs are many and talent is scarce. But despite this, jobs aren’t always offered to those who possess the greatest or most impressive skillset. I am certain that there are many developers more skilled than myself, but who also have more trouble finding a job than I do.

While this is by no means an all-inclusive or decisive list, here are some things that I’ve discovered along my 8-year career as a developer and designer that have helped me become a well-rounded developer and member of the community.

Be Industry-Agnostic

If you take a peek at my resume, you’ll see that I’ve worked in a menagerie of industries: education, marketing & advertising, online retail, startups, moving & transportation, fashion, and gaming. While not necessarily at all to be a successful developer, there is something to be gained by working for so many widely different companies and industries.

For example, while working at my university, I got great insight into how the education industry functioned (as well as the politics that went along with it). The marketing agency I worked for taught me how to manage several different projects at once and how to adhere to client timelines and budgets.

At Zappos I learned about version control (which isn’t something I’d used when working on such small teams). I learned how to code for a high-traffic website. I learned that larger companies also mean more overhead and more politics, which means less productivity.

Startup life gives me the freedom and productivity that I crave, but I also learned that they are high-risk (I’ve lost my job twice now). I learned a lot about creating MVPs and A/B testing that I wouldn’t have otherwise. I also learned how much I enjoy distributed teams and working async.

Being industry-agnostic has given me the experience to know what it’s like working at companies large and small, profitable and not, fast-paced and slow. Most of all, it’s helped me understand exactly what makes me the most happy and productive.

Big Names Matter

If possible, work for a company whose name you’ve heard of and who is famous for its tech. Think Apple, Facebook, IBM, Twitter, etc.

Having a big name on your resume can say a lot more to a potential employer than you think. For example, having Zappos on my resume tells people that I have experience working on high-traffic websites (which says that I’m probably familiar with caching and minification techniques), that I have experience working on large teams within a large organization, and that I was deemed a culture fit by a company well-known for great customer service.

Perhaps it’s coincidence, but the number of headhunter inquiries I receive multiplied tenfold once I had Zappos on my resume. It doesn’t have to be a “forever” job, especially if big companies aren’t your thing (they’re not mine).

Be A Jack Of All Trades

This one is a toss-up. There are great arguments for being good (not great) at many things, and also great arguments for being a master of just one or two things. But because this is about that path that led me to where I am today, I am going to include it.

While I don’t consider myself advanced or an expert in anything except for perhaps CSS, I know a good deal about a lot of things. If you were to hire me (and only me), I could: take business requirements and translate them into wireframes, design the site or app in Photoshop, make educated UX decisions backed by data and research, cut the template into pixel-perfect html/css, develop the front-end into a single-page app (AngularJS) or via Ajax/jQuery, write an API that retrieves and stores data into a relational or nosql database, and deploy the site. Sure, my designs may not be as cutting-edge as a full-time designer may have created, and my back-end architecture may not be optimal, but everything works and functions as it should. And you just saved yourself from having to hire a separate designer and possibly another developer.

I am always upfront with potential employers and clients that while I have a wide range of skills, I am not always the best fit for a job if they are looking for an expert. Pretending otherwise will just get you in trouble and cause a lot more stress for yourself.

One thing to note is that I really enjoy both design and development. If you hate design (or development), it’s simple: don’t do it. There’s nothing wrong with being a front-end only developer, or being really good at back-end and databases but sucking at design. It’s all preference. But I will say that once I began dabbling in and improving my design skills, a lot more job opportunities came my way.

Participate In The Community

This is probably the most important piece of advice I can give, and it has absolutely nothing to do with development or skillset. Become a part of the community you’re in, whether it’s your workplace, your school, or your city. Participate in hack-a-thon competitions, go to meet ups, attend conferences, give talks and presentations, and work on side projects. Share your work with others and ask others about their work.

There’s something to be said for word-of-mouth recommendations, and nearly every job I’ve gotten has been because of a recommendation from someone I’d previously worked with. But none of those recommendations would have happened had I not built those relationships with the people in my community.

Be A Good Person

You would think this one is a no-brainer, but it isn’t. Here are just a few tips for being a decent human being:

Be humble
You may very well be the smartest person in the room, but letting everyone know so on a consistent basis isn’t doing you any favors. Believing that certain work is “beneath you” don’t make you look smart – it makes you look like an asshole. Some of the best people I’ve ever worked with were people who are incredibly smart and talented, but who would never admit it or feel the need to be validated by others.

Help people
Don’t wait for someone to ask for help: offer it. If you’re short on work but see someone else struggling to keep up, offer your assistance. If someone expresses an interest in learning Photoshop and you happen to be a Photoshop whiz, offer to meet over lunch to go over a few basics. Share articles with people who might find them interesting. Give lunch-and-learn presentations on something you think would be interesting or helpful to others. Answer questions on stackoverflow if you can. If you can’t help, find someone who can. And never, ever, expect anything in return. One day, if you ever find yourself needing some help, you’ll find a line of people at your door ready and willing to return the favor.

Do what you say you’re going to do
Did you promise to give your client a project estimate? Did you tell your manager you’d have that project done by Friday? Did you agree to give your coworker a code review? Did you make lunch plans? And did you actually do all of those things when you said you’d do them? I hope so. Don’t be a flake. No one takes flakes seriously.

Get to really know people
Ask someone how their weekend was. Invite the new person on the team to lunch. Find some common topics and interests to discuss with your deskmate. Ask if your coworker’s sick child has been feeling any better. Smile. Say hello. Make jokes. Remember birthdays.

Get to know the people behind the computers. And do it because you want to.

A Few Other Tidbits

Learn (and use) proper grammar and spelling.

Accept that everyone has different tastes. Just because you’re a hardcore Apple user doesn’t mean that you have to poke fun at or bash those who prefer PC. If someone likes coding in PHP, let them enjoy it. You may have a million reasons why you don’t like it (and some of them are likely very valid), but unless the topic is up for discussion, leave it alone.

Work hard, play hard, and learn to take a joke.

Keep in mind that not everyone you work with is going to be a developer. You’re going to be working with designers, project managers, finance and marketing experts, and more. Leave out the programmer terminology and jargon when communicating to non-developers and never make anyone feel dumb because they don’t understand. Every job has its purpose.

Do things that need to be done, whether it’s in your job description or not. Are you a back-end developer who found a styling bug? Fix it yourself, or if you can’t, at least point it out so that it’s not left for someone else to discover later on. If the product manager comes directly to you instead of your manager to ask some questions, answer them. Do what needs to be done to get the job done, and done well.

And finally…

Don’t write long and boring blog posts that no one will read. jklol. But seriously, if you did make it this far, thank you. I hope at least one thing I wrote was useful (especially to those who may just be starting out). If you have any additional advice or experiences on what makes a great developer, please leave a comment!

1

Adding Seasonal Flair To Your Site

posted on January 8th, 2014 in Tutorials

One thing I enjoy doing to websites is giving the site different visual treatments depending on the season or holiday. For example, during the winter I’ll add snowflakes to the background, and in the spring I like adding little pops of color, whether that be through images or background colors. This is really easy to do, and all you need is some basic CSS knowledge and a little bit of client-side programming knowledge. The example below uses PHP, but it could easily be translated into any client-side or templating language.

The PHP


  <?php function findSeason() {
      if(date('m') == '01' || date('m') == '02' || date('m') == '12') {
         return " class='winter'";
      } else if (date('m') == '03' || date('m') == '04' || date('m') == '05') {
         return " class='spring'";
      }
  } ?>

This code just checks to see what the current month is, and if it’s January (01), February (02), or December (12), it returns the markup for winter. If it’s March (03), April (04), or May (05), it returns the markup for spring. You could extend this code for Summer and Spring as well, or also just check for singular months:


  <?php function findSeason() {

      // Return October
      if(date('m') == '10') {
         return " class='october'";
      }

      // Return Halloween
      if(date('m') == '10' && date('d') == '31') {
         return " class='halloween'";
      }
  } ?>

The PHP code can then be placed in your HTML markup, like so:


  <!-- Adding the season to the body tag -->
  <body<?php findSeason(); ?>>

The CSS


  body {
    background:transparent url('/images/background.png') top left no-repeat;
  }

  .winter {
    background:transparent url('/images/background-winter.png') top left no-repeat;
  }

  .spring {
    background:transparent url('/images/background-spring.png') top left no-repeat;
  }

The body styles will be overridden when you apply the .winter or .spring class to them. When the month/season/holiday is over, the class will no longer be applied and your default body styles will be used.

There are endless possibilities for styling your site – enjoy!

0

Freebie: Vector Snowflakes

posted on December 20th, 2013 in Design, Freebies

Merry Christmas, everyone! Here's a little freebie from me to you that will hopefully add a little holiday cheer to your designs or websites. I had so much fun creating these... there are endless possibilities when creating snowflakes! If you'd like to create some snowflakes of your own, I highly recommend following Veerle's Snowflake tutorial. Enjoy!

download

1

Sushi San

posted on December 3rd, 2013 in 8byte8, Design

I recently added a new theme to my mobile & web slot game, Slot Stravaganza, called Sushi San. I’m really happy with how this theme turned out. I love the cute colors and I think adding expressions to the symbols adds a lot of personality.

This is my second attempt at digital illustration and I think it’s definitely an improvement over my previous theme, Sweet Shoppe. I did do a lot of “research” beforehand, though, which basically consisted of doing a Google image search for anything “kawaii”. Hey, real artists imitate, right?

sushisan

Slot Stravaganza is free to download and play. It’s available on mobile devices and the web. To find out more, check out the website (which I also designed and built!).

0

Next Page »