26th Dec 2010

290+ Social Media Resources From 2010

social media stamps image

We’ve provided you with nearly 300 in-depth features, galleries and how-tos in the past year to help you navigate the social media world.

Here you’ll find a comprehensive list of all of those posts, covering everything from how to enhance your Facebook profile, find videos and music, contribute to a charity and just about any other topic you can think of.

We’ve broken the posts into categories including the big ideas about social media, the most popular social sites, including Facebook and Twitter, music, videos and photos, geo-location services, education, privacy and safety, social good, activism and government, among others.

If you’re looking to get caught up on — or re-read — Mashable’s social media resources from the past year, here’s your chance.


About Social Media



Facebook


Posted by Posted by Yogi Liman under Filed under Did You Know... Comments No Comments »

26th Dec 2010

HOW TO: Land a Job at Microsoft


Everyone has a dream job. Whether it’s a company you’ve been pining to be a part of or a new product you’re dying to throw your creativity into, there’s always a line of work that seems like the perfect fit.

Though recognizing your ideal position is easy, actually getting the job is the hard part. For those looking to start a career at tech giant Microsoft, the sheer size of the company makes the hunt seem even more overwhelming. Resumes can get lost in a sea of applications, and finding the right contact to reach out to can be like searching for a needle in a haystack.

But that doesn’t mean you should give up on your dream of working at one of the most successful and dynamic corporations in the world. Here are some tips and resources from the company’s recruiters and employees for landing a job at Microsoft.


Getting Started


With so many locations and products, the first step in starting your Microsoft job search should be deciding where you want to work and what you want to create. Visiting the Microsoft Careers website can help answer these questions. There you can look for a specific position in the navigation bar or choose a country from the drop-down menu. On the Find Your Fit page, details on the company’s various professions and technologies are laid out to help you explore opportunities.

Once you apply by uploading your resume to a specific job posting on the site, it’s up for review. So how do you get that resume noticed?


Standing Out


Many recruiters use keyword searches to pull up resumes — but that doesn’t mean every other word needs to be “motivated” or “team player.” Be sure to list the names of certain technologies and programming languages you’ve used in each project you include. This will allow a recruiter to see what you know and how well you know it.

When putting together your resume, think about how you affected your environments and less about the basic facts of what you did. “Often, applicants write their resumes like a list of job tasks, but it’s even more important to call out your major achievements and the difference you made: what you did, how you did it, and why it mattered,” said Gretchen Ledgard, communications manager for Microsoft Recruiting.


Doing Your Homework


Microsoft is known for its difficult interview process and obscure questions. The best way to nail it? “Do your homework on us,” Ledgard said. Candidates who come in with knowledge about the role, team and location tend to already have an idea of how to frame their answers and are ready to ask solid questions.

Thom Mitchell, a Microsoft account technology strategist who was hired earlier this year, couldn’t agree more. He researched each person who was interviewing him and read up on the products he would be responsible for in the role and the competition for those products. He even prepared a short PowerPoint presentation about Microsoft products in case he was asked to present something on the fly (he wasn’t). When Mitchell asked questions, they were substantive and role-related — not “How are the health care benefits?” or “Is there a gym reimbursement?” More importantly, when he didn’t know an answer to a question he was asked, Mitchell simply said so and didn’t try to talk around the issue or come up with a fake answer.


Following Up


If you have questions after submitting your resume, many Microsoft recruiters are open to being contacted via social media, Ledgard said. Microsoft Careers is also open to connecting through social networks and has resources for potential job candidates on its advice hub JobsBlog.

But how do you strike a balance between keeping your name on the radar and being a nuisance? For Mitchell, the key was checking in as needed. He followed up with the recruiter after each screening interview and sent brief thank you notes to the hiring manager he interviewed with in person — but not to each person who interviewed him. Mitchell said his recruiter let him know what would happen every step of the way, so there wasn’t a need to over communicate.


Finding a Fit


There’s a big focus on not only job fit, but also company fit at Microsoft. Recruiters look for people who go above and beyond in everything they do, whether that’s taking the most difficult computer science courses or working on extracurricular projects, Ledgard said.

Still, there’s no fool-proof formula for landing a job at Microsoft. Even though the position you’re applying for might feel like the perfect match, sometimes it’s just not. Microsoft’s recruiters and hiring managers are the experts on what type of person will be a good fit for both the job and the company culture. The best advice? Relax. If it’s meant to be, it will.

Have you scored a job at Microsoft or are you trying to? What has your experience been like? Tell us in the comments below.


More Job-Related Resources from Mashable:


- 19 Resources to Help You Land a Job in 2011
- The Future of Human Resources and Social Media
- HOW TO: Score a Job Through Facebook
- 5 Ways to Get a Job Through YouTube
- HOW TO: Use Twitter Hashtags to Boost Your Job Search

Images courtesy of iStockphoto, Tomazl; Flickr, Pawel Niewladomski

More About: advice, careers, hiring, how to, interviewing, job recruiting, jobs, microsoft, resume, social media

For more Business coverage:


Posted by Posted by Yogi Liman under Filed under Did You Know... Comments No Comments »

13th Nov 2010

12 Fun Hacks for Getting More Out of YouTube


There’s no doubt that plain old YouTube can be tons of fun, but when you get bored of watching clips the traditional way, there are a ton of sites that can help enhance the experience.

Whether you want to view a video with a far-away friend, compare two clips, or find more interesting ways of browsing and sharing, there are plenty of options out there. The web community is known for creating hacks that improve your surfing experience; now we’ve dug into some of those tools and hacks built around YouTube.

Have a look through our 10 choices and let us know of any other YouTube mashups, hacks, or similar sites and services you’ve used. We’d love to hear about them in the comments below.


1. TubeReplay


This site features a super-simple premise. TubeReply will play a YouTube video over and over again, until you stop it or go mad — whichever happens first. Just enter the URL of the clip you want repeated and the site will do the rest.


2. DragonTape


DragonTape allows you to remix YouTube videos into a seamless mixtape. Search for the clips you want, drag and drop to set up the play order and then share the playlist with friends via an auto-generated URL, or embed it with the code provided.


3. YouTube Doubler


This “mashup helper” exists “because you have better things to do than work.” You can use it to compare two videos, or have fun mashing together two patently unsuitable videos. Simply enter the two URLs, decide on your VJ name, and you’re off and away. You can share your video pairing via a generated URL.


4. SynchTube


SynchTube allows you to watch synchronized YouTube videos with up to 50 other people with a chat window along the side so you can IM about what’s happening. Setting up a “room” is easy. Just enter the URL(s) of the videos you want to watch and then share the URL with your group. We can imagine tons of uses for this service, but the sweetest one has got to be setting up some videos to watch “together” with a far-away partner.


5. Infinitube


Enter your choice of keywords into this site and it will create an infinite playlist based on them. Get ready for a seamless viewing experience based on as many keywords as you can imagine.


6. Splicd


You can link to a specific spot in a YouTube video by adding #t=MMmSSs (replace MM with minutes and SS with seconds) to the end of the URL, but Spilcd (and TubeChop below) take this concept a step further. Splicd lets you cut down a YouTube video by entering start time and finish time. You can then share your edited clip with a URL or embed it with the code supplied.


7. TubeChop


TubeChop shares exactly the same principle as Splicd. TubeChop, however, lets you make your edited selection by sliding a bar along a timeline. It’s worth an independent mention as some may prefer TubeChop’s visual editing process.


8. YouCube


This unique little tool lets you create a “YouCube,” an interesting, if slightly offbeat way of sharing YouTube videos. Enter the six YouTube videos you want to appear on each side of the cube and it generates a spinning 3D cube of your videos that you can then name and share via a shortened URL.


9. MixTube


MixTube is a great, simple tool that lets you easily create and share music playlists from YouTube videos just by adding the URLs to a list. This tool is tidy and useful for songs that you can only find on YouTube, such as mashups, live performances, and other user-generated content.


10. YouFlow


YouFlow offers an alternative and more attractive way to browse videos on YouTube. Enter your key words and a selection of results will be displayed in a cover flow-style layout that you can scroll through. You can choose to play multiple videos right from the results, something that is much more difficult to do with YouTube’s queues and playlists.


11. Quietube


If the majority of YouTube comments depress you, then: a) You’re not alone, and b) There’s a solution. This browser bookmarklet offers a plain white or plain black background to view vids on. Simply install and then hit the “quietube” button after you press play on any YouTube video for some peaceful, troll-free viewing.


12. YouTube TestTube


TestTube is YouTube’s “ideas incubator,” akin to Gmail Labs, where YouTube engineers and developers “test out recipes and concoctions that aren’t quite fully baked.” You can play around with a comment search, HTML5, the lite version of YouTube (Feather), a caption editor, music discovery features and more.


More YouTube Resources from Mashable


- 10 Killer Tips for Creating a Branded YouTube Channel
- HOW TO: Add Captions To Your YouTube Videos
- HOW TO: Create Custom Backgrounds for Twitter, YouTube, & MySpace
- Top 10 YouTube Tips for Small Businesses

Image courtesy of iStockphoto, Talaj

More About: Google, hacks, List, Lists, tips, tricks, video, web video, youtube

For more Web Video coverage:


Posted by Posted by Yogi Liman under Filed under Did You Know... Comments No Comments »

17th Jul 2010

HOW TO: Give Your Photos a Vintage Look


Your profile photo is an important part of your online personality, offering a glimpse of you to the wider world. We’ve previously brought you tips for creating the perfect profile pic, and in this post we’ll be looking at some great online services that can help you create a variety of fun, vintage-looking pics for your profile.

So, for anyone who doesn’t have photo editing know-how, expensive editing software and a load of time to spare, here’s how to create a retro profile pic in a matter of minutes using some absolutely free, entirely online services.

Let us know in the comments if we’ve missed any!


The Original Shot


This is the photo we’re editing, shown here as a control pic so you can gauge how dramatic the effects we’ve picked really are. A standard snap from a point-and-shoot camera, there’s nothing wrong with this image, but read on to see how it can be made so much more fun in just a few clicks.


1. Phixr’s Cross Process Effect


The Effect

In film photography, the cross processing effect was achieved by switching different chemicals used to process print or slide films. This made for dramatic colors, contrast and grain.

Although the effects of cross processing have been known since the 1960s, it was in the 1990s that the effect reached the height of its popularity with photographers like Nick Knight bringing cross processing to fashion and studio work.

How to Get the Effect

It’s possible to recreate the effect using photo software by playing around with the color balance and contrast ratios (there are plenty of tutorials around the web to help). If you don’t have the time/inclination/correct software, then Phixr offers the effect at the click of a button.

Simply head to Phixr and hit “get started,” which will bring up account options. If you want to set up a free account you can do so from here, but you can also skip this step, which will give you access to Phixr (as long as you’re not on it for more than six hours straight, which, trust us, you won’t be).

You then need to upload your chosen pic from your computer (or via a URL) and hit the upload button, at which point the pic will be be resized if it’s too big.

After your photo has loaded, select the “color effects” button from the icon menu on the left hand side and scroll down one line to select “cross process.”

At this point there are options to adjust the brightness, contrast and opacity, but for the effect in the image above we kept it all at the auto levels pre-loaded by the site. The effects are previewed, however, so if you’d like to play around, you won’t be committed to the changes until you click “execute.”


2. Picnik’s 1960s Effect


The Effect

Although many technical advances have been made now, back in the “old days” the colors in photo prints were made up of dyes that decay with age — especially if exposed to light — hence why so many of your parents’ or grandparents’ photos take on pink or yellow tones as the years go by.

The faded color helps to date a photo almost as much as the outlandish fashions that might be found in it, and is a great effect to give your modern pic a vintage feel.

How to Get the Effect

Drop into Picnik and click the “get started now” button. Upload your chosen photo, hit the “create” tab along the top, and select “effects” from the secondary tab menu. Now scroll down the menu on the left hand side of your display and choose “1960s” which brings up further options.

You get the option to keep the round corners (we did, as it helps achieve the dated look even more) and what color you want to fill them in with (we chose white for a subtle effect) as well as how much “fade” you want. We maxed our fade in the pic above (zero percent) but again, you can play around with a preview, so feel free to experiment before hitting “apply” and saving the photo back to your computer.


3. Rollip’s Styled Lenses Effect


The Effect

In the 1960s, cheap cameras like the Holga and Diana were mass-produced as “toys” and were predictably made of cheap construction and parts, including such photographic abominations plastic lenses.

Of course, though poorly made, these low quality cameras actually produced really interesting effects such as light flares, blurs, distortion and vignetting (darker or blurry edges) that have, in recent years, gained the cameras a cult following (best seen from the Lomography movement) by those interested in the unpredictable and often beautiful results.

How to Get the Effect

If you’re at all interested in super-simple retro photo effects then you need to head to Rollip pronto as it offers over 40 options. We narrowed our choice down to this “Styled Lenses” option which emulates the kind of effect you could hope to get from a quirky old-school film camera.

To find it on the Rollip site, hit “click here to start” on the home page and then scroll through the “more effects” option until you get to page 5/10. Click “Styled Lenses” and select the photo in the top left hand corner. Once you’ve done this, it’s just a matter of clicking to browse your computer for a photo and wait for Rollip to work its magic.


4. Photobucket’s Color Splash Effect


The Effect

Coloring black and white photographs by hand using photo oils or tinting pencils was popular in the first half of 20th Century before the advent of affordable color film. Recreated digitally, it makes for a nostalgic effect and can increase the emphasis to a certain part of an image, such as a person, or a features like lips or eyes.

How to Get the Effect

You do need an account to use Photobucket, but it’s a simple email and password affair, so not too arduous to get set up. Once you’re good to go, upload an image from your computer and then hit “edit.” After your photo has loaded, select “effects” from the tab menu at the top of the page and choose the first option called “color splash.”

The software will then greyscale your photo to black and white, leaving you to choose which part you want to fill in with color. The actual coloring in is super-easy: Just dab the circle over the area you want the color restored too. We stuck to the standard size blob in the image above, which worked fine, but if what you want colored is smaller, or more detailed, you can change the blob size to suit.

Finally we took advantage of another free effect from Photobucket to complete our image and employed the “blur edges” tool (on the default setting) from the effects menu to give a blurry vignette feel. This helps focus the eye on the colorful figure.


5. Picnik’s Polaroid Effect


The Effect

Polaroid photographs are iconic and immediately recognizable as the instant photo format of choice. Polaroids ruled up to the start of of digital photography when slower, film-based formats were pushed out of the market.

Since Polaroid’s decline, nostalgia for the product has seen various groups campaigning for a revival of the format. With some success, film and cameras are now back on the shelves. It looks like Polaroid will live on for a few more years yet.

How to Get the Effect

There are various Polaroid-erizing tools on the web, the most notable of which is Poladroid, however, this requires a download and we’re nothing if not impatient. We wanted an in-browser service.

Picnik offers a Polaroid look as part of its “frames” options, but that doesn’t give the image an aged look. We countered this by using the 1960s effect (detailed above in number two) but nixing the round corners and setting the fade to 40 percent for a less dramatic effect.

Once you’ve applied that, go to the frames menu under the “create” tab and select “Polaroid.” We opted for a white background color and a five percent angle. When you’ve made your choices, it’s just a matter of saving the pic down to your computer and you’re all done!


More Tech Resources from Mashable:


- 4 Tips for Producing Quality Web Videos
- 50+ iPhone Apps to Enhance Your Photo and Video Experience
- 20+ Great Adobe AIR Apps for Photos & Videos
- 5 Ways to Share Images on Twitter
- Top 10 Robot Videos on YouTube
- Top 10 Wedding Dance Videos on YouTube

Image courtesy of iStockphoto, kevinruss

More About: Phixr, photo editing, photobucket, photography, picnik, polaroid, profiles, retro, rollip, vintage

For more Tech coverage:


Posted by Posted by Yogi Liman under Filed under Did You Know... Comments No Comments »

11th Jul 2010

5 Handy YouTube Channels for DIY and Home Improvement


The easiest way to learn how to do something practical is to first see it done properly by someone else. By breaking it down into easy-to-follow steps, these how-to videos offer an absolute wealth of knowledge that is just a few clicks away.

We’ve searched YouTube for the very best home improvement instructional video channels where experts and enthusiastic amateurs share their skills for free.

So the next time you have a DIY job to do, whether it’s fixing a leaky faucet or a more ambitious project, check out our choice of top five channels where, no doubt, there’s a handy video by someone who’s been there, done that, and can help you avoid throwing the wrench against the wall in frustration.


1. VideoJug


VideoJug is one of the big boys in the online instructional video world, and specializes in helping people do a huge range of things, with separate channels for Food & Drink and Beauty & Style.

As far as help around the house goes, the site offers a small selection from its hundreds of do-it-yourself videos on YouTube, mostly covering topics the average home-owner would be happy to tackle without paid help from a workman, such as how to bleed a radiator. And if that’s not enough, more videos can be found at its main site.

While some of them are sponsored, the advertising is not intrusive and the videos are short and sweet, offering clear and concise advice on various how-to topics.


2. Ron Hazelton


Ron Hazelton will show you how to paint evenly, apply wallpaper, wash windows and strip paint at the easy end of the DIY ladder, and he’ll show you how to drill a shank hole on the more advanced end.

His tool-side manner is great; he’s like a friendly neighbor giving you a one-to-one lesson. Hazelton sometimes offers up different methods to the viewer for them to then decide which will suit them, as shown in the video above.

His instructions are clear and easy-to-follow, and he manages to make jobs look easy, thus removing the fear-factor from any home repair chore that’s weighing on your shoulders.


3. AskTheBuilder.com


Tim Carter is the energetic, fast-talking host of the AskTheBuilder video tutorials. As well as a ton of specific how-tos, Carter offers advice that DIY novices might find quite useful, such as more general overviews of products and processes. For example, a quick ‘paint brushes 101,’ explaining which to use when, or a look at the kinds of log splitters that are available and the benefits of each.

Whether the topic is roof moss, masking tape, or evaluating the quality of 2×4, Carter’s easy manner and knack for simple explanations will keep you watching, and more importantly, hopefully get you DIY-ing.


4. HomeAdditionPlus


Mark Donovan of HomeAdditionPlus currently offers over 100 YouTube videos with info on various aspects of DIY home improvement and home remodeling.

Clean-cut and coherent, Donovan’s straight talking approach is easy viewing, although some of the videos don’t offer a compete walkthrough of every element of a process, so may be more suited to those with some knowledge looking for an overview, rather than anyone new to home improvement who needs his or her hand held through every stage.


5. eHow Home


eHow is another giant for instructional videos and its “Home” channel is chock full of clips offering advice on decor, soft furnishings, troubleshooting problems around the home, and more cleaning tips than you could shake a duster at.

Although more technical eHow (and ExpertVillage which comes under the eHow umbrella) videos show up in keyword searches, there does not seem to be an easy channel-based way to browse them on YouTube, which is a real oversight as the content is mostly decent. So do a topic search and look out for “eHow” or “ExpertVillage” as the creator.


BONUS: Gardenfork.tv


Gardenfork covers an eclectic mix of topics from beekeeping to cooking, but it earned its place on this list because of the gardening videos it offers.

With an occasional DIY, “how-to” thrown in, the gardening side of things encompasses how to build raised garden beds, make bird houses and grow tomatoes.

Host Eric’s laid-back video style, willingness to learn, and enthusiasm are infectious and dog lovers will enjoy the two lovely labs, Henry and Charlie, who are never far from the action.


More Social Media Resources from Mashable:

- 5 Handy iPhone Apps for Home Improvement
- 10 Essential Money-Saving iPhone Apps
- Top 10 YouTube News Bloopers
- Top 10 Stop Motion Videos on YouTube
- 10 Best “Get a Mac” Parodies [VIDEOS]

Image courtesy of iStockphoto, microstocker


Reviews: YouTube, iStockphoto

More About: diy, home improvement, how to, videos, youtube

For more Web Video coverage:


Posted by Posted by Yogi Liman under Filed under Did You Know... Comments No Comments »

04th Jul 2010

HOW TO: Create a Pixel Fireworks Animation Using JavaScript


Kelli Shaver is freelance developer and UI designer. You can follow her on Twitter @KelliShaver and on GitHub here.

It’s 4th of July, and for those of you in the U.S., you know what that means — it’s time to grab a beer, throw a steak on the barbecue, and blow stuff up. Why not get into the spirit of things with a little explosive goodness right on your website or blog?

In this article, we’ll create a simple fireworks effect using jQuery that can be applied to any element on your web page. Use it to add fireworks to photos, backgrounds, or anywhere else you feel like blowing up a few pixels. The result is fairly basic, but it’s still pretty cool and it will provide you with a good primer on JavaScript animation.


Setting Up the Page


To start with, we’ll need a little bit of markup, mostly for demonstration purposes.

This is pretty straightforward. We’re just setting up some basic HTML, and grabbing jQuery from Google’s CDN. We’re also calling fireworks.css and fireworks.js, which we’ll create in a moment. jQuery is my JavaScript framework of choice, so it’s what I’ll be using to create the fireworks. This takes a lot of work out of animating our explosions.

Once the markup is out of the way, we can move on to our CSS. Again, it’s fairly simple. We just need to define a couple of elements, namely the container that will hold the fireworks (‘#photo’ in this case), and a small div we can use as our base particle, which we’ll be using instead of an image, so we can easily change the color.

Let’s start with the container. I grabbed a nice photo of a lake at night from Stock Exchange and plan to use that as my background.

Most of the CSS above is simply for defining the height, width, and position of the photo on the page, but there are a few things to note. We’ve set the overflow to ‘hidden’ so that our fireworks don’t shoot off the photo, and added position:relative, because we will be absolutely positioning our particle elements within the photo. As you can see, there’s no image tag in the HTML for the photo. It’s used as the div background, instead. That way we don’t have to worry about it when manipulating the contents of our photo div.

Next, we need to define the CSS for our base particle. All we need to do is specify a height, width, and tell the browser to use absolute positioning. I’m using a 3px by 3px particle, but if you’re using a larger, or smaller photo, you may want to adjust the particle size.

Now you should have something that looks like this. I added in some CSS for page body as well, but it has no bearing whatsoever on the fireworks.


Creating the Animation


With these out of the way, we’re ready to move on to the meat and potatoes of the project — the JavaScript.

Before we can begin writing our explosion function, though, we’ll need a quick method for duplicating our particles. We could always use jQuery’s built-in clone method, but since we’ll be making a lot of copies, let’s go with something a little more efficient.

Since I’m a big fan of not re-inventing the wheel, I’ll just use a handy little plug-in I found over at jQuery Minute that extends jQuery with a .duplicate() function.

The linked article above has a good explanation of how the plug-in works, so I’ll not elaborate. For now, all we care about is that we can call it on our particle element by using .duplicate(50) for instance, which will give us 50 copies at our disposal.

Alright, now let’s really get down to business and write our explosion function. Before we begin building animations and creating elements, though, we need to define a few variables that get set whenever the function is called.

Let’s go through this step-by-step and take a look at what each of these variables are for.

sky – This is a jQuery object for the element that will contain our fireworks, built by passing the element ID at runtime, like so: explosion('photo').

colors – A simple array of some bright colors to use for our fireworks. We’ll be creating single-color fireworks, and multi-colored ones.

emitter – We create a simple div object and give it the particle class. This will be the base or center of our explosion.

multicolor – A random number from 0-10 used later to determine whether or not to make the firework multi-colored.

Now that we’ve created our emitter object, we need to add a couple of additional CSS properties to it. It’s best to do this before appending it to the DOM, so let’s do that.

Once the emitter is styled, we can append it to our container. While we’re at it, let’s go ahead and make those duplicates, as well.

Whoa! Hang on. What’s with all the math? Don’t worry. We’re just creating random numbers*. This means that when our firework goes off, it will be randomly placed on the photo.

In this case, the width is a random number between 3 and the width of our photo (400), and the height is a random number between 3 and 100, because we only want fireworks to appear in the top 100px of the photo (the sky). Why 3? No particular reason at all, other than that I wanted to ensure that the explosion is always centered a bit inside the photo’s edge.

Finally, we get the background color by pulling a random color from the array.

* To create a random number within a range, take the difference of the maximum value minus one less than the minimum value, multiply that by the value from random(), which will be between 0 and 1. Then multiply it by the maximum value. Last, wrap all of that in the floor() function, to convert the result into an integer.

Great! Now we have 51 particles sitting on our canvas in the x,y coordinates we randomly determined above. All we need to do now is give them a little animation and possibly a new coat of paint.

To do this, it means we have to loop through them. That being the case, I really wouldn’t recommend making more than 50 or so particles, because it can get a little resource-intensive on older machines.

jQuery’s .each() function allows us to step through the array of elements, executing the code inside on each of them.

You’ll notice here we’re setting an x offset and a y offset. These determine which direction the particle is going to move in, and by how much. Using the same formula as above, these offsets will be random numbers in the range of -10 to 10 (for up/down and left/right, respectively).

Remember when we generated a random number above for our multicolored variable? Now let’s use it and see if we need to create a multi-colored explosion by changing the color of the current particle. I want multi-colored fireworks a little less than half the time, so I chose to use 5 as my cut-off point. You could change it around however you like.

This should be fairly self-explanatory at this point. If the value of multicolor is greater than 5, change the particle’s background by grabbing another random color from the colors array.

Now let’s put these particles in motion. We’re going to set up an animation sequence, based on the x and y offsets we determined above. To get the total length of each particles animation, we’ll multiply those offsets by 10. This gives us a nice spread between -100x, -100y and 100x, 100y, from the center point, meaning our explosion will have a maximum diameter of 200px. Depending on the size of your photo, you may want to make this larger, or smaller (Hint: If you’re making it larger, use bigger particles for a better effect).

As you can see, we also set the animation speed to 2.5 seconds (2500 milliseconds), which gives us a smooth, uniform expansion of particles out from our center point.

All we have to do now is sort out what to do with the particles once they’ve reached the end of their animation sequence. Well, what do fireworks do after they’re done fireworking? They drop a little and fade away, so we’ll make our particles do just that.

The above animation, executed after the expansion animation has completed, drops the particle by 20px while simultaneously fading it to 10% opacity. We use the “slow” duration preset, so the particles appear to “hang” slightly in the atmosphere.

That’s it! You can now call the explode() function to set off a firework on your photo, either triggering it manually, or calling it automatically when the page loads. In the example, I’m calling it every 3 seconds via setInterval.

Unfortunately, we can’t run the animation here, but you can check out a video demo below:

I hope you enjoyed the tutorial. You can view a live example of the fireworks here, or go straight to the source.


More development and design resources from Mashable:


- Top 10 Resources for Design Inspiration
- HOW TO: Get Up-to-Date on WordPress 3.0
- 7 Hackathons Around the World and the Web
- 10 Web Design Bloggers You Should Follow
- Top 10 Beautiful Minimalist Icon Sets

More About: 4th of july, animation, fireworks, how to, independence day, javascript, jquery, tutorial

For more Dev & Design coverage:


Posted by Posted by Yogi Liman under Filed under Did You Know... Comments No Comments »

26th Jun 2010

HOW TO: Organize A Successful Meetup


This post originally appeared on the American Express OPEN Forum, where Mashable regularly contributes articles about leveraging social media and technology in small business.

Gathering friends, followers and “likers” online can only take you so far in the world of networking. Organizing a Meetup is a great way to move your virtual network to a tangible territory.

Quite simply, a Meetup is a planned event where like-minded people meet and typically chat over cocktails and listen to a guest speaker. Organizing one of these events is an excellent way to establish yourself or your business as a “go-to” person in your industry.

Yet it is easier said than done. Anyone who has ever tried to organize a dinner with just a small group of friends knows that preparation is the key to any successful event. Meetups require planning, and given that you want to make a good impression you should take your time to make sure everything goes smoothly.


1. Why Your Meetup?


First, consider why you want to organize a Meetup. Do your research and find out what groups are already meeting, and decided what your Meetup could bring to your industry. Sign up on Meetup’s website and create a personal profile to see what the scene is like already. Search for terms that pertain to your field, and decide on what is missing so you can position your Meetup to satisfy that void.

Next, you need to craft a clear lead statement that explains exactly what your Meetup is about. Break it down so that people will understand what type of conversations you hope to develop.


2. Create a Meetup Group



Meetup’s services make it easy to get the group rolling. Create your group, and choose your location, the group’s name, headline and your lead statement describing what the group is all about. Pick a theme for your group’s page; you can choose from several templates or create your own.

The next step is important. Pick up to 15 topics that describe what your group is targeting. Picking the right keywords is how you’ll find the right members for your group. Meetup’s site offers some good suggestions and shows you how many groups already exist under each umbrella topic.

Then pick a pricing plan. Meetup is free to join, but if you want to actually start a group, pricing will run as low as $12 a month. With more than 6.5 million people signed up and over 60,000 groups formed it’s the simplest way to organize a group and reach out to the most people.

Now that you have created the group, you’re officially the “organizer.” 72 hours after you have created the group the site sends out an alert blast to everyone who has listed the topics or keywords you choose to categorize the group, and invites them to join.

If you have contacts who aren’t members of the site but that you know you’d want to attend, send off a personalized e-mail informing them of your new group. You can also tweet the link to your group’s page so your Twitter followers get the message as well.


3. Grow Membership


Don’t rush to create an event right away says Yuli Ziv, who organizes the Meetups for her group Fashion 2.0 and is the co-founder of My It Things and Style Coalition. Ziv’s group has more than 1,000 members, and she has organized 20 Meetups since 2008. She advises that you wait for the membership to grow before you announce your first event.

Once you decide to put a Meetup event on the calendar make sure you announce it and give yourself some time to promote the event so that people can RSVP.


4. Format


Meetups don’t have to adhere to one format. Most include networking over cocktails and often feature a panel discussion or guest speak and Q and A session from the audience. If it’s you’re first event, you may want to try something more informal.

Julia Kaganskiy organizes the 1,300 member strong Arts, Culture and Technology group. A former social media strategist and community manager for an entertainment agency, and current Digital Learning department intern at the MoMA, Kaganskiy held her first meet up nearly two years ago as a way to meet people in the specific communities she wanted to work in.

For her first event, Kaganskiy says she ran more of relaxed gathering because she wanted to get a feeling for who would come out. “I wanted to see what fields people were in and find out what they were really interested in. I worked the room and got a sense of what kinds of questions people wanted to explore.”

Fourteen Meetups later, Kaganskiy now creates each event with a different theme or topic and invites top industry leaders as guest speakers. Sometimes she’ll invite a few speakers to speak for 30 minutes or she’ll invite four or five guests with a variety of viewpoints to each speak for 10 minutes. Either way, the goal is to get the conversation flowing.


5. Venue


Once you decide what you’ll be doing at the event, you need to tell people where to actually meet. Finding a venue to hold your event can be the most difficult part. Depending on where you live there may be more or less available space. The key is, and both Kaganskiy and Ziv agree, is to find somewhere for free.

“Find a bar on a Monday or Tuesday, and most places will be thrilled to have you. If it’s a low traffic area they’ll be more than happy to have you bring in 50 people for a couple of hours,” says Kaganskiy.

Once you have space set there is always the question of if you’ll have enough. In places like New York City, space is often an issue.

As Fashion 2.0 has grown in membership, Ziv says that they have outgrown the venues where past events have taken place. To avoid turning people away, Ziv suggests capping the number of people admitted if there is enough interest. “Some events are better in an intimate setting,” she says. “A big event doesn’t mean a great event. It could be 30 people and be just as relevant and interesting as one with 100.”

Once you have established yourself as a group, Ziv suggests making a wait list if too many people RSVP to your event. “It can make people more excited. It means it’s a special event and people want to be a part of it. This way you can encourage people to RSVP early,” she says.


6. Day of the Meetup


For everything to run smoothly, it’s important that you do some last-minute preparation before your group meets. Call the venue to confirm, and make sure they have all the equipment you need (microphones, speakers, screens). If you’re bringing your own supplies, make sure the venue knows that ahead of time and confirm that you’ll be their early to set up.

If you’re in a private room at a bar or restaurant, try to make sure that the staff know who you are and that they’ll communicate to arriving guests where the event is being held.

On the day of, don’t forget your Sharpie pens, name tags, and the RSVP list. Have someone besides yourself man the door, so you can take care of last-minute needs. If you decide not to cap your admission number, make sure to have a sign-in sheet so you can get everyone’s contact information.


7. Sponsorships



Initial Meetups tend to be low-key affairs, but once you’ve organized a few and keep gaining members, sponsorship is a great way to make your Meetup more professional and enjoyable, while taking the costs off your hands.

Getting sponsored can happen in different ways. Fashion 2.0 was lucky enough to find some of its sponsors within some of its own members according to Ziv. “We have executives in the group and it’s to their benefit to tell their companies about a relevant group with great people who they would want to reach out to.”

The benefits of being sponsored mean that Fashion 2.0 can afford a bigger venue and host events with an open bar, which definitely attracts people. “It really takes it to the next level and makes it a serious event. The fashion industry has high standards and people expect a big production,” she says.

Another way to find a sponsor is through Meetup’s website. Three years ago the website noticed that groups were starting to get sponsored by local businesses.

“Running groups were sponsored by the neighborhood running store, and we saw that there was an opportunity for big brands to come in and support these groups,” said Cindy Laning, the account manager for Meetup sponsors. Since organizers pay to use the site, Meetup is committed to supporting the success of each group, and found that groups grow, on average, 7% faster with a sponsor.

Laning explained that organizers have the option of whether or not they would be interested in sponsorship, and Meetup reaches out to groups who they think would benefit from working with, including dozens of top brands like Columbia Sports, Dove, Vitamin Water, Equinox, Blackberry, Huggies and Microsoft.

“The point is to get as many groups sponsored as possible. We reach out to the group and act as the middleman between them and the brand.”

According to Laning, Meetup has a 75% opt-in rate for sponsorship, which insures that brands are welcomed into the community. “We get qualitative feedback; brands come in and they recognize these communities by financing them or with other things. The groups are so grateful for that support, that when it comes time to make a purchase decision they are likely to use the brand that has been helping them out. It’s a pay it forward mentality.”


8. The Future


Once you’ve organized your first Meetup, start thinking about the next. Talk to people to find out what will keep bringing them back, and try to come up with innovative ideas that will place you where you want to be in your industry: a connected, relevant contributor.

“Running the Meetup was the single most important move I’ve made in my professional career thus far,” said Kaganskiy. “It positioned me at the center of this community that I was just making my way into. It allowed me to create my own networking opportunities. Because I’m creating a public service by organizing these events, I’ve gain a lot of respect.”


9. Keep Connected



The event may be over, but your work is far from done. Now that you’ve met all these new people, it’s your job to stay connected with them via your group’s Meetup page, but also through other social media platforms. Follow your members on Twitter and Facebook. Keep your community buzzing. Was there a controversial question that generated a lot of discussion? Tweet it after the event and keep people thinking about you so that they can’t wait for the next event. For example, John Hyland and Anthony Quintano of the NYC DSLR Meetup, keep up with their members via Twitter to keep conversation rolling before, during and after their Meetups.

At Fashion 2.0 there is a whole conversation on Twitter in addition to the event. Ziv says members all follow and support each other, and foster new discussions.

Kaganskiy uses her personal Twitter account to promote the group and says that following up with members on other networking sites really helps to cement the relationships. She reflects, “I was an outsider looking in. Now I have friends at every major museum in the city, and it is because I maintained those connections I made at the Meetups.”

Have you organized a Meetup in your community? Add your own tips on organizing a successful Meetup in the comments below.

For more Business coverage:


More business resources from Mashable:


- HOW TO: Improve B2B Sales Productivity with Social Media
- 13 Essential Social Media Lessons for B2B Marketers from the Masters
- 10 Essential Social Media Tools for B2B Marketers
- HOW TO: Build A Twitter Strategy for Your Business
- Why Small Businesses Shouldn’t Take Social Media for Granted

Image courtesy of iStockphoto, iofoto

More About: business, meeting, meetup, networking, social networking


Posted by Posted by Yogi Liman under Filed under Did You Know... Comments No Comments »

08th May 2010

5 Ways to Send Real-Life Gifts To Your Twitter Friends

The online nature of Twitter means that it’s highly unlikely you know the physical addresses of many of the people you follow, which if you want to send them something in the real world, could be problematic.

Whether it’s a Twitter buddy’s birthday, someone’s a little under the weather, you want to say thank you, or just be awesome, there are a variety of services out there that can help you out in such a situation.

We’ve pulled together a list of five websites that, utilizing just a Twitter handle and a credit card, will have actual gifts winging their way in the real world to your online friend in no time at all.


1. ParcelGenie


Perhaps aimed at the younger Twitter user, ParcelGenie offers affordable gifts across the categories of “fun,” “flirty,” “cheeky,” “cult” and “celebratory” with Love Hearts and strawberry lip gloss the current most popular items while we were visiting. Basically, if you’re looking to send a Twitter contact a Whoopee cushion, or a badge that reads “boob inspector” then this is your new go-to place.

Once you’ve signed in via oAuth, the site auto-selects a gift and someone from your followers to send it to as a kind of demo. This is unnerving at best, and frankly terrifying at worst as you sit petrified, scared to move the mouse as the site lines up “After Dinner Willies” for your boss, complete with an auto-generated message. Obviously you have to actually add the item to your cart before anything really happens, but it’s a point worth noting for the faint of heart.

On the practical side of things, you can only send gifts to people that are following you. Once you have selected an item and a recipient, you choose whether you want the gift to be public, private or anonymous, after which ParcelGenie messages the giftee asking for an address and, assuming your buddy provides the requisite info, the parcel is then sent.

Delivers To: The U.S., Canada, UK, Australia, plus some European countries
Gifts Available: Keyrings, badges, candy, drinks, mugs, magnets, various other low value items


2. Tigerbow


This good-looking site offers a more grown-up selection of giftery with books and movies catering to any get-well soon scenario, flowers and food great for thank yous, and comedy tees. There’s also a card-sending service which is available worldwide (unlike the gifting that’s currently U.S.-only), with the nifty option to design your own.

Once you’ve registered, verified your email and selected your gift, it’s just a matter of signing in to Twitter, selecting a contact from the list and then adding a Twitter message (there’s a separate option later in the checkout process to add a message to go with the actual gift). At this stage you can chose whether you want the recipient to be able to see the gift they are getting, or keeping it a surprise.

The giftee then gets a message from Tigerbow, can view your message on the site and then decide whether they want to accept, and if so, where they want the parcel sent. If the recipient refuses the present, then you won’t be charged and at no point is any address info shared.

Delivers To: The U.S. only for gifts, cards worldwide
Gifts Available: Flowers, cards, foodie items, t-shirts, books, movies


3. Twitgift


Twitgift currently offers a very limited selection of items made up of mostly cookies and a few geek-themed phone cases and jewelry. However, the site is actively looking for suppliers with “interesting, unique or tasty” products, and is supposedly making plans for expansion to other countries, so it’s definitely worth bookmarking.

Boasting a super-simple user experience, you simply sign in via oAuth with your Twitter account, select the gift you want to send, enter the Twitter name of who you’re sending it to and enter payment info.

The recipient then gets a tweet that is customizable, but along the lines of: “I just bought you a @twitgift! Claim your @twitgift at http://twitgift.me/claim/” The recipient can then visit Twitgift to add their shipping details (at which point the service tweets you to let you know the gift has been accepted). Alternatively, if the gift is not claimed in a week, the order is canceled and nothing is charged to your card.

It’s worth noting that unlike other services, the @mention nature of the notification means you can use Twitgift to send gifts to people who don’t follow you.

Delivers To: The U.S. only
Gifts Available: Cookies, phone cases, jewelry


4. Twegistry


Once you’ve oAuthed the sign-in on Twegistry, you can browse the online present selection which includes some nice gifty bits as well as some sexy underwear – so, clearly ideal for the stalker market.

Simply enter your recipient’s Twitter name and select the gift (prices include both shipping and taxes) and then checkout via PayPal.

Twegistry will then send a message containing an @mention to the person you’re sending the present to with a link so that they can either accept or decline. Like Twitgift, the way this system is set up means the person you want to send something to does not need to follow you back in order to generate the message.

If they do decline, then your purchase will be refunded, otherwise the gift will be sent off to them pronto.

Delivers To: The U.S. only
Gifts Available: Flowers, candy, cakes, teddy bears, saucy undies


5. SendSocial


In addition to being UK-only at this stage, SendSocial works on a different principle than the services outlined above as it does not restrict your choice of gift. It’s more a social delivery service that will help you send anything to a Twitter user.

Just sign in with your Twitter ID via oAuth, enter your name, email and address info (and go through the email verification process) and select the Twitter name of the person you want to send something to.

The service then generates a tweet along the following lines “@[recipient] I would like to send you [item], via SendSocial. To accept, go to http://sendsocial.com/r/[unique link]” Once the receivee accepts and enters their address, SendSocial creates a barcoded address label (so the actual location is not revealed at any stage) for you to print out, stick to your parcel and wait for the courier to collect.

Pricing is worked out on a weight basis, with anything up to 2kg costing just £3.99 (around $6) to send and the service takes between three to five days once the parcel has been collected.

Delivers To: UK only
Gifts Available: None – send your own



For more social media coverage, follow Mashable Social Media on Twitter or become a fan on Facebook




More Twitter resources from Mashable:


- 5 Free Services for Pre-Scheduling Your Twitter Updates
- What Twitter’s New Ad Model Could Mean for Small Business
- 10 Dos and Don’ts for Brands on Twitter
- HOW TO: Spring Clean Your Twitter Account
- 4 Tips for Tapping Into Twitter Conversations

Image courtesy of iStockphoto, fotosipsak

Tags: parcelgenie, sendsocial, tigerbow, twegister, twitgift, twitter


Posted by Posted by Yogi Liman under Filed under Did You Know... Comments No Comments »

25th Apr 2010

HOW TO: Disable Facebook’s “Instant Personalization” [PRIVACY]

Last week, Facebook added a suite of new features that let websites like Pandora and Docs.com access some of your personal information and use it to instantly personalize your experience. Pandora, for example, will recommend streaming music stations built around artist’s you’ve Liked on Facebook in the past.

Most of the time this information is harmless and you shouldn’t worry too much about it being used for nefarious purposes, but if you want to err on the side of caution, you can actually opt out of the program for privacy reasons — the option is called “Instant Personalization” and it’s sitting deep inside of Facebook’s privacy settings pages.


Opting Out at Specific Sites


You can either turn Instant Personalization off entirely at Facebook, or you can opt out at individual websites on a case-by-case basis. The latter is easy; the first time you arrive a website that uses Instant Personalization, a bar will appear at the top of the page letting you know that’s what’s happening and giving you the option to either accept that or to tell it “no thanks.”


Blocking Instant Personalization For All Sites


The feature is on by default when you first arrive at a site, though, and if you’re sure you never want to use it anywhere, you can dig deep from your Facebook home page to make sure no other website can ever access your Facebook information for Instant Personalization purposes. To do that, start by clicking on “Account” in the upper-right corner of the Facebook homepage. Select “Privacy Settings” from the list that drops down below.

You’ll be presented with a list of five privacy settings pages. You can do a lot with these pages — customize who can see your profile info and news feed updates, for example — but the option we’re looking for now is right in the middle: “Applications and Websites.” Give that a click.

There it is at the bottom of this list: “Instant Personalization.” Consider clicking “Learn More” by the top item, too, though, as it explains exactly how your other privacy settings affect what information is shared with other applications and websites. Anyway, click “Edit Setting” by “Instant Personalization” at the bottom.

This last stop in the rabbit hole tells you what Instant Personalization does, and provides a lone check box at the bottom to enable or disable it. It’s on by default. Click the check box to turn it off.

There you go. It’s done! Facebook won’t share your personal information with websites for Instant Personalization again until you re-enable this feature. You can do that by going back and re-checking the box at any time, so if you decide you want the new features after all, this isn’t irreversible.


Preventing Friends From Sharing Your Info


You should be aware that friends can still sometimes share your information from their own profiles with websites even though this is turned off. This is easy to change. Just jump back one level to “Applications and Websites” and click “Edit Settings” by the second option — “What your friends can share about you” — instead of “Instant Personalization.

Here you can check and un-check boxes to specify what information your friends’ connections can share with other applications and websites. If you un-check everything here, none of your information will be shared. It’s nice to be able to choose exactly what you are and aren’t comfortable with, though.



For more social media coverage, follow Mashable Social Media on Twitter or become a fan on Facebook



Tags: docs.com, facebook, how to, instant personalization, Open Graph, pandora, privacy, social media, social networking, social plugins, yelp


Posted by Posted by Yogi Liman under Filed under Did You Know... Comments No Comments »