[ad_2]

Source link

The post Making logos work for the web appeared first on The Roldan.

If you read any of the countless web design trend reports that came out earlier this year, you likely read about the promise of large, hero-sized cinemagraphs placed prominently on homepages everywhere. So where are they?

While a few fashion-forward companies are using them on their websites, the cinemagraph has been largely relegated to showcase round-up articles and reddit pages.

Well I say enough is enough. It’s time that cinemagraphs rise up and take their proper place as the web page heros they were destined to become.

WHY CINEMAGRAPHS WORK

The idea of following a web design trend simply because it was forecasted never really excited me. But what if you could actually pioneer such a trend? And what if it actually had a purpose, and solved a problem at the same time?

The human eye loves motion.

When it comes to cinemagraphs, all of the above statements are true. While it has certainly been discussed, (and even forecasted as a trend in web design,) very few websites are actually using them. As a result, they haven’t even come close to reaching a critical mass, so they are still mesmerizing to most web users.

Not quite a photograph, not quite a video, cinemagraphs are inherent eye-candy because they fool the viewer just long enough to make them take a second look. In the A.D.D. era we live in today, anything you can use to make a user pause — even for just an instant — counts as a small win for one very important reason:

You’ve got their attention.

One particularly effective way of attracting a bit of attention on a website has always been video. The human eye loves motion. But a large hero video (even a short one) is so bulky. Sure you can compress it within an inch of its life, but then it just looks… compressed. Or you can leave it alone and suffer the consequences of a slow-loading web page.

But by using a cinemagraph, you can save a lot of bandwidth while still satisfying that need for motion. Actually, you’re upping the ante, because you can capitalize on the novelty aspect of a cinemagraph — People just don’t see them very often, and are impressed when they do.

So now that you know why cinemagraphs deserve a place of importance on the web, let’s take a high-level view of how to bring one to life.

Glendevon Motors uses a cinemagraph in its hero area to convey a mood and stand out as a “premium brand” amongst its competitors.

OPTION 1: USE A PRE-EXISTING CINEMAGRAPH

There are many instances when sourcing a ready-made CG is acceptable, or even preferred to making your own. I’d say that if you can find what you need, and it’s in your budget to get the rights to it, then that’s the way to go. The only question is: where do you find it?

The good news is, you’ve got options. They will be largely determined by your budget, (or your client’s,) but there are many sources out there. There are even a few free ones to choose from. However, if you have eighty bucks to spend, Shutterstock has a pretty decent selection of high-definition CGs.

(Tip: They don’t have a stand-alone cinemagraph section, so you just have to search for the term “cinemagraph,” plus your other search terms within the “footage” section.)

If you manage to find what you were envisioning, you’ll probably still want to compress the file to a certain degree. More on that in a bit.

Option 2: Make Your Own

The whole point of using a CG instead of a video is that it is meant to be a bit of a mind-trick.

Maybe you couldn’t find what you had pictured. Or maybe you’re just a die-hard DIY’er, and I respect you for it. So how exactly does one make a cinemagraph from scratch?

First, it helps to have the right equipment and a plan. Here is what I recommend to get started:

• A camera that can shoot video
• A tripod
• A model and/or any necessary props
• A computer
• Access to a video editing program (optional)
• Access to Adobe Photoshop or a more dedicated cinemagraph editing software, such as flixel

That is what you’ll need in order to make a cinemagraph. But in order to make it effective, you’ll need a great idea.

WHAT MAKES A GREAT HERO CINEMAGRAPH?

While the general theme of your CG will be largely dictated by the niche of the website itself, there are certain universal points to keep in mind when setting the scene. Be sure to:

• Keep it subtle: The whole point of using a CG instead of a video is that it is meant to be a bit of a mind-trick. Some of the best CGs look very still, then surprise the viewer with a subtle motion. Speaking of subtlety, make sure the overall composition isn’t overly busy or brightly colored if you are layering text and a CTA on top of it. Remember, the CG should play off those elements, not distract from them. Speaking of which…
• Leave room for the real hero: Make sure you know where you want your headline, subheader and CTA button to go within the cinemagraph. This will affect where you place the main action in the composition.
• Keep it anchored: Of course, a CG has some motion, but the scene overall needs to be very still to properly contrast the movement. A tripod should help with background movement and camera stability. If your model’s eyes are meant to move from side to side, make sure she keeps her head very still at the same time.
• Make it loop-able: Since you want the file to be relatively small, you will need to loop the action so it repeats as seamlessly as possible. Plan for this when setting the scene. Ideally, the first position should very closely match the final position, closing the loop.
• Use a person if possible: Studies have shown that images with people in them keep people’s attention much more than ones that don’t. This also holds true for CGs. Extra points if you can manage to have your model looking in the direction of the CTA. This has been shown to draw the user’s eye there as well.

Once you have all your elements in place, try to shoot about 20-30 seconds of video, repeating the desired motion several times, with about 5 seconds of keeping things completely still in between. This should give you enough raw footage to turn into an eye-catching cinemagraph.

PUTTING IT TOGETHER

While I won’t go onto the step-by-step process of turning a video into a cinemagraph, there are several options available to you. You can shell out $299 to use a dedicated cinemagraph design program, but you can put a nice CG together using Photoshop, (which I’m guessing you already use.)

COMPRESSING THE FILE

Whether you made your CG from scratch, or sourced an existing one, you want to make sure it loads quickly. Whether your final output file is a gif or video (which I recommend,) your compression will rely on two separate factors:

1. Quality
2. Length

Personally, I try to go for the highest quality possible in any large format hero image, video or cinemagraph. In my opinion, sacrificing the quality of any file that is meant to make such a visual impact is a shame. In order to balance this out, I try to make my cinemagraph loop as short as humanly possible.

The action will have an effect on how short the loop can be — a train buzzing by can be much shorter than a slow, deliberate eye glance, which might look somewhat spastic if it repeated too quickly. Take the below example from web agency The Deep End. Since all that is needed here is for one train car to match the next in order for a pretty seamless loop, I managed to cut it down to around one second.

Even though I managed to keep the action extremely succinct, I still knew the file size could be reduced for an even quicker load. I ended up using a free online video compressor called ClipChamp. I was able to compress the video down from several megabytes to a svelte 319 KB. Remember, most users will bounce from your site after only three seconds of waiting, so it pays to be quick.

And if your end result is left with artifacts from extreme compression, you can always employ a tried and true trick used on imperfect hero videos — mask it with a semi-transparent patterned overlay.

Interested in seeing how others have used cinemagraphs as hero images? I’ve got some good news, and bad — There aren’t too many more to show, which is the bad news. But the good news is, if you were to put this plan into action, you would be on the vanguard of what promises to be a pretty big trend.

Here are a couple that I managed to find around the web:

Gilt Taste [Editor’s note: This site is shut down.]

The Nature Conservancy

Final thoughts

A cinemagraph can not only kick an otherwise boring website project up a few notches, but it can actually impact its success too. If you combine it with a killer headline and compelling call-to-action, you can really grab your users’ attention. What you do with that attention is up to you.

[ad_2]

Source link

The post Cinemagraphs in web design appeared first on The Roldan.

These promises are of course lies! Every business has money. The trick is, getting them to part with it. Here are some handy ways of creative billing and other methods for turning a cheapskate into a great client… who pays your invoice!

A new client or another douche?

The great thing about businesses that demand free work is that they usually don’t realize, in the end, that they have no rights to the copyrighted work you have created. Free work followed by broken promises can be followed by legal suits to pay you for the rights they never legally had.

That, of course, is not a good way to do business in the long term, but the idea is on the table if you’ve been screwed in the past and never signed over the copyright for your work. A letter warning the client they are using copyrighted material in breach of promise can get a rise from a client, but they’re not just going to roll over and show you their wallet.

It’s best to lay some ground rules from the start. First, chances are you haven’t laughed out loud in the client’s face because you are interested in working for their company. If only they would pay you!

Well, there’s a chance they want you to work for them just as badly or they wouldn’t be going out of their way to risk an eternity roasting in Hell by lying to you. Seriously, they see you have the talent that they both want and need, and they respect design just enough to know they can’t use an art student — although they might use that threat as a negotiating position.

You have the upper hand in negotiations because you have nothing to lose by turning down working for free. The only other things you’ll need are the guts and knowledge to know how to negotiate an acceptable solution for both parties.

Real ways to get paid

You’ll know whether the prospective client is just cheap, or doesn’t actually have any money for design within the first few moments of your first meeting. If they are cheap, They’ll tell you why you should be working for free. Whatever you say next in defense of your need to be paid will be met with one of these two reactions:

1. An angry threat that they can get an art student to do the work for free, thereby denying you the rare chance to ply your trade, or:
2. They will be interested in what you have to say, because they truly do respect you as a freelancer and never thought of other ways you could be paid a fair fee for your work.

There are ways to gamble on the client but assure yourself of payment either in barter, investment, or extended payments. Barter may in some cases be illegal as it is taxable but hard to track for the IRS.

1) BARTERING

Bartering a fee may include:

1. Trading work for office space. This is fairly common. Many freelancers want an official office space that has a conference room, receptionist, better address for a more professional appearance, and other people around. (You know, so they stop wearing a bathrobe for six straight days and keep talking to themselves because they feel like the only person to survive a zombie apocalypse.)
2. Trading for hard goods, such as groceries, office supplies, equipment or any goods the company manufactures or sells.
3. Trading work for “exposure” is one of those lies many free work-seeking clients use. Sure, if Disney is promising exposure, that might be tempting (although they have lots of money for design work), but a smaller firm, blog or website might actually be great exposure and allow you a link back to your professional website. You have to weigh how much exposure is gained/work you might get vs. the work required of you.
4. Complete creative control. If you are desperate for portfolio pieces, having complete creative control will give you a better professional sample than having to water down your creative abilities because the client wants orange type on a blue background. This, however, is not a sound reason to give away your work, but if push comes to shove, it’s a last ditch offer to do free work.

The problem is that barter is a swap of services or goods that are worth money and must be declared on one’s taxes as income. If you are trading services for several thousand dollars of work, then that’s what you legally must declare on your taxes. Still, if you receive these at wholesale prices, even paying taxes on those goods will leave you ahead of the taxes owed.

2) INVESTMENT

Investment credit and a percentage of the company:

If you argue about having to provide thousands of dollars to use your design work to help build up a startup, you might demand a percentage of the company itself, just like those who have invested financial funds. While this ploy never seems to work, even with the best intentions on the part of the client, it might happen with a savvy client who needs ongoing work and respects design enough to see that he/she needs an experienced, competent professional. I suppose this is why it never happens!

If it does happen, you’ll need to hire a lawyer (they don’t work for free, oddly enough) to make sure:

1. You are legally a partner.
2. You have access to company records to make sure you are being paid your true percentage.
3. You can’t be bought out of your percentage for pennies on the dollar.
4. You have limited liability so you won’t be the only partner being sued, or going to prison if the startup fails.

As with any investment, there is a chance to fail, however, imagine being part of a growing company as a partner, even with a small percentage. You might be the “Corporate Creative Director” and assured of a career move that will continue to grow and pay you an income.

3) EXTENDED PAYMENT

Extended or deferred payment can assure you of a legally binding way of recovering fair payments down the road. This can include:

1. Invoicing for the full fee, but giving an extended payment time of several months.
2. Invoicing for the full fee with tiered payments spread out over a longer period of time.
3. Invoicing for the full fee, with the intention of claiming the unpaid fee as a tax loss for a tax break (check with an accountant for how much you can legally claim on your taxes – accountants, like lawyers, also never seem to work for free, or extend payments).

An extended payment needs a strong, iron-clad contract to assure that if payments are missed, or stop completely. Make sure the contract calls for interest payments and that any legal costs are paid by the client if the extended payment agreement falls apart.

Conclusion

Naturally, being paid in full and in a timely manner is the ideal situation, but in the freelance business, sometimes you have to think quickly on your feet when provided an opportunity that may seem to be a scam to start off, but end up truly being an opportunity… just like the client promised you, but not with “rich friends”, “exposure”, or possible “lots of money later”… at least not without the aforementioned contract!

The post 3 successful ways to get paid by a client who has “no money” appeared first on The Roldan.

I had a boss who told me that when she started her million-dollar business, she made sure her stationery, cards, etc. were the best stock, printing and design she could get. She said it sold her company to prospects before she had ever opened her office. Without sounding cocky, you must sell yourself to a prospective client so they feel they are lucky to have you as their designer.

Don’t stand for being beaten up

We all know the type of client who wants everything for nothing. They make lame promises, threats, and insults to put designers in their place. They want to make the designer feel as low as dirt, hoping the designer will work for free, or very little. We complain about these types of clients but do little to correct their behavior. It’s time to nut up, or shut up!

The first thing you must understand is that there is a difference between having the confidence to elevate yourself in the eyes of the client, and being a douche-bag to others around you. Too often, designers beat on each other. Most designers, if not all, carry a fear that their peers won’t respect their work. The truth is: it only matters what the client and you think of your work.

In art school, where teachers post your work on the wall for critiques, allowing every member of the class to enjoy the sound of their own voices, the lesson is not to see what you did wrong… or right. Class critiques are to teach you how to hear criticism of your work from others. We know not every student in your class will make it in the creative field. In some schools, the rate of graduates who find work in their area of study is as low as 12%, so why would 88% of the critiques mean anything to you?

The art school critiques are misplaced lessons. They should not be for you learning to take criticism, but for you to learn how defend your design decisions and how to convince clients you made the right ones.

I’ve always been amazed at the amount of working professionals who ask other designers what they think of their design ability. My quick and pointed answer when I’m asked to look at someone’s portfolio, is to ask them what they think of their work. If they say they don’t know or aren’t confident about their decisions, they’ll never make it in the creative field until they grow a pair and find confidence in their ability to love their own design decisions.

Other designers are not your partners

There are numerous self-congratulatory groups on Facebook, LinkedIn and sites like Dribbble where such “designers” go for affirmation – usually from other designers who have time on their hands because they’re not busy with work of their own.

If you ask ten designers what they think of your design, you will get ten different opinions of what you did wrong. The only thing you did wrong was ask other designers for their subjective opinions. It’s not that they’re wrong, they just aren’t right. They weren’t there with the client, they didn’t hear the creative brief and they weren’t privy to the changes the client wanted. They also aren’t the ones who sign your checks. So perk up, because you’ll never know what the client will think until you show it to them.

If you are busy seeking the approval of other designers, how can you be confident enough to seek the approval of a client?

I love retelling the story of a local designer who specialized in real estate design. He created templates for real estate agents to order sales sheets for each new property listing and he made a large, six-figure salary. His family enjoyed a good life, he put money away and saved for his kid’s college fund. He also felt like he wasn’t a “true designer” because other designers made fun of his work.

Those designers who passed judgement on his specialty were always unemployed, complained about the lack of work, but somehow felt they were better than this man; and their opinions drove him insane. He shouldn’t have cared that others had some weird standard of what a designer should be. Part of their standard was to not be able to find work or pay their bills.

Pluck up your courage and confidence

If you aren’t confident with your own design ability, you have to discover why. Are you just not happy with the final design when you are left to your own decisions? Do client changes send you into an indecisive depression?

When you are going to present preliminary sketches to a client, do you obsess over the worst one, hoping it won’t be picked? Then get rid of it! If only two sketches are exciting to you out of three, then present two sketches. If the client asks why there aren’t more, say these two are the strongest concepts that will solve the design solution. If they want to see more, make them tell you why the presented solutions don’t solve the problem. Assert your professionalism and don’t position yourself as a design slave.

When you let go of the part of you that is more concerned about what other designers think and concentrate on what you like about your work, you will find your creative juices flowing freely. That will end up pleasing your clients. Project approved, check received, design successful! That’s all you need to be a great designer.

Be big in your own mind

Getting back to perception, it’s odd how some clients think. At one of my corporate jobs, the head of the creative department told all freelancers that they had to brand themselves as a large studio, and not just as Jane Doe Design. They needed to have a studio name that made it seem like the company was dealing with large, multi-designer studios. Yes, it was ridiculous because that would leave out Milton Glaser Design and other well-known design firms, but the perception was what won out.

Now you need to think big. As odd as it may sound, bull honky makes the world go around. Well, maybe it’s not that odd, so why not join society and hype yourself? I’m not telling you to lie and cheat. I’m telling you to start focusing on the positive things about yourself, and not the negative things that keep you down.

Like the lesson from my former boss who set herself up as a professional before she even started work, you need to ooze success. This goes for networking and how you present yourself and your brand, to how you speak to people. Humble-but-confident is the key. Almost, as my old boss used to say, as if you don’t care if they become your customer or not.

My old boss would actually kick people out of her office, and I was always amazed that they would come back, begging to deal with her. She was very talented and it showed. There is also the human response to want what you can’t have.

Some of my biggest clients were people who approached me with offers for me to do freebies or work cheap. It was my polite manners and insistence that I could not work cheaply that made me one of the highest paid freelancers among my peers. When the higher pay wasn’t available, I negotiated less work, such as one concept presentation, and limited changes. All the time, having a cool exterior, I was falling apart in one big panic attack inside. When that doesn’t show on the outside, people, as hard-arsed as they may be, decide your poker face is enough to convince them that you can’t be pushed around.

It is true that there are some people who only offer free work opportunities to freelancers, but there are those who decide they will pay a fair wage when confronted professionally and convinced that you are worth the payment.

Conclusion

I was impressed with an art student I met at a Phoenix, Arizona art school where I was a guest speaker. She had the swagger, but without the attitude. Her portfolio was expensive and professional, well put together, like a book and not a mish-mash of sloppy samples just thrown in. Her outfits were always well put-together, her cards, stationery and website were clean and beautiful, and she spoke with a confidence that made me think she was an older student and not someone right out of high school. She was set apart from the other students and she obviously didn’t care. She had her target of success in sight. She is a very rare example of an art student who has it so together, but doesn’t step on others to elevate herself.

We’ve remained friends and I’m fascinated by her quick rise to success. I wasn’t the same way in art school. It took me years and plenty of hard and painful lessons to find the right balance of ego and attitude. If I could summarize the lessons I’ve learned to ooze success, even when times are tough, as they can be for all of us, they are these:

1. Don’t get cheap with your brand! Your brand is the first impression of your professional standing.
2. What matters is a satisfied client and your opinion of yourself and your abilities. Ignore what other designers think. They don’t pay your bills.
3. Negativity is a drain of valuable energy. Worry about your career, and not the careers of others.
4. Don’t brag, but don’t shrug and talk your work down either.
5. Always smile at a client and never take an insult of a bad offer personally.
6. Never lose your cool! Look at every situation as a test of your ability to solve a negotiation in your favor.
7. It’s artwork not artplay! Don’t let clients get that mixed up.
8. Stand your ground. Walking away from a non-paying, or low-paying project costs you nothing.
9. Start your first fee offer high. If you agree to a discount, then you won’t lose income and the client will appreciate your flexibility, without losing respect for your professionalism.
10. Your career is your life! Take it seriously and don’t let your peers sabotage it with their opinions or standards. Misery loves company. Quit that company!

The post How to boost your personal brand as a designer appeared first on The Roldan.