Game Design

Perfect Positioning For Your Mobile Game Offers

Written by
UserWise
Mike Moran
November 25, 2020
in this article
  • Title 1
  • Title 2
Thank you! Your submission has been received!
Oops! Something went wrong while submitting the form.
Subscribe to our blog
0
minute reading time

You’ve learned the basic psychology behind why users hit the buy button. You’ve danced with the different pricing strategies, and you’ve shared a beer or two with the marketing tactics that get your audience trigger-happy with their thumbs. But something’s still missing.

You’ve learned the basic psychology behind why users hit the buy button. You’ve danced with the different pricing strategies, and you’ve shared a beer or two with the marketing tactics that get your audience trigger-happy with their thumbs. But something’s still missing.

You’re lacking the icing on the cake. The pizzazz. The sparkle. You’re lacking the exclamation point that gets them excited. The encore that doesn’t just make them click, but that makes them happy with their decision to click.

That’s why we’re here: to give you that sparkle, so you can go forth and spread joy. Ready for the sparkle bomb? Of course you are.

When it comes to in-game offers, looks matter.

Ignore everything you learned in elementary school -- use your own eyes as your secret weapon, and give a critical look to each and every offer you release. Is it attractive? Is it exciting? Does it pull you in? Or, does it bore you? Does it overwhelm you? Does it make it easy for you to ignore?

The missing element you’ve been so frantically searching for is the visual. Because we, as people, are visual creatures. We make decisions based on first impressions all the time -- and that has the power to either help you level-up the success of your offers, or destroy any chance you have of getting your users buying.

If your mind’s already racing -- how do I make an in-game offer pretty?! -- stop it. Take a breath. In, out, repeat.

That’s the very reason we’re here.

See, game designers have spent their entire careers trying to make sense of the visual world. To achieve optimal gameplay experiences, yes, but also to achieve optimal sales. They’ve staked their livelihoods on just how crucial the visual is to the success of a game. And now, we’re bringing all of their hard-earned insight to you.

Straight from the horse’s mouth.

We’ll guide you through the rules and the suggestions. We’ll give you every piece of the knowledge puzzle. And we’ll be your sherpa as you ascend full-speed ahead.

The Optimal Placement

Phone screens might be getting bigger by the year -- or nowadays what seems like the month -- but they’re still small. Really teeny-tiny. Especially when compared to the other screens we get entertained by. So, with that said, it’s pretty obvious that every inch of a user’s mobile screen is invaluable real estate

In order for your screen space/property investment to pay off, you need to have chosen the right location for your needs. How big is the offer, and is it centered on the screen? How big are its buttons, and where are they physically?

If you’re thinking these are way too many details for something as basic as placement -- you have things backwards. Because the truth is, nothing’s more important than placement.

Example A: position your in-game offer too high, and you risk your user never leaving the world of the game -- eyes still focused on the backdrop, they’ll get out of the offer as soon as they can.

Example B: position your in-game offer too low, and -- while it’ll be physically easier for your users to click the button you want them to click -- it won’t call for the same degree of focus as a centrally-placed offer would.

Clearly, physical location matters as a whole. But so too does the location of the buttons. And when we’re talking button location, what we’re really talking about is two distinct areas: the comfort-to-reach area, and the hard-to-reach area.

The what? Keep reading -- we’re about to blow your mind.

Pick up your phone. Move your thumbs naturally. The places where it’s easy for them to reach -- in the bottom left half-circle, usually -- make up your comfort-to-reach area. That area is where you want all of your ‘positive action’ buttons to go: buy, learn more, start the trial. They should be so easy to hit that not hitting them becomes the challenge.

 

Image 2020-11-18 at 8.59.11 AM

 

Conversely, the hard-to-reach area takes up the upper third part of the screen. There should never be a positive action button there, but there can be a negative action button -- a close or a leave now -- so that the user has to physically work to get back to the game.

Want an example? Coming right up. Imagine an offer that appears in the middle of the screen, three different item options inside. It’s big enough to comfortably fit the visuals of the items, but it’s not so big that we can’t still see the game world in the background. Instead of a small buy now button, it’s a whole bar, covering the bottom of the offer box. And the escape button? It’s miniscule, hanging at the top left.

Getting your placement right is like a painter buying the right canvas. It’s your first step as an in-game offer artist -- and when you nail it, you’re ready to get into the fancy stuff.

Summary: The first step to captivating visuals is the right on-screen placement. When you get your offer/button placement right, you’re able to pull more focus -- and drive more sales.

Colors matter

Speaking of fancy -- let’s get into the step that boasts the most vibrancy. The step that incites the most visceral excitement, that manages to energize and persuade with little more than a second needed to get the job done.

Yeah, we’re talking about color. And when it comes to color, the first impression is everything.

First, let’s look at the game as a whole. Every game has a color scheme -- a selection of carefully curated hues that evoke a specific mood from its users. For instance: Angry Birds is full of reds, oranges, and yellows; this evokes high energy, high urgency, and yes, anger. But anger in a fun way.

 

angry-birds

 

Words With Friends, on the other hand, relies on blue hues with accents of orange. Blue evokes calmness, rational thought, and a slower pace, while orange adds in a flash of jovial energy.

 

words-friends

 

Based on the color scheme of the game you’re working with, you’re going to want to make sure that your offers’ coloring is in alignment. Not necessarily the exact same -- because you want to get your users’ attention with something new -- but similar enough that the offers don’t feel out of place. You want them to feel like they were sent by the game, looking out for its users’ best interests.

Once you have your scheme down, play with where you want the focus to go. Offers should always be minimalistic, so that users aren’t forced to do the legwork to decipher them -- so, add the strongest, most captivating colors to the offer elements that are most crucial to understand.

A ‘DISCOUNT’ banner, for instance, could be bright red. A ‘BEST DEAL ALERT’ ribbon could be bright orange. But those bursts of color only work if the rest of the scheme is lighter, softer, and less radiant. So use your contrast wisely.

And, while you’re figuring out the color situation for inside your offer, don’t forget about the color happening outside. The users should be able to see the game world they left behind at all times -- but they shouldn’t be able to see it vividly. The general rule here is to cover the game world in a semi-transparent dim, so that users are assured that what they left behind is still intact and waiting for them. (That way, they can focus on the clear messaging in front of them without distraction.)

We’ll leave you with this: one game design expert recently noted, “Color is arguably the second most important aspect of your app, after functionality.”

So here are your next steps. First, make sure your offer works properly. Second, get its colors into fighting shape.

Summary: Choosing the right colors -- for inside and outside the offer -- is crucial for capturing your users’ attention, evoking a sense of trustworthy authority, and getting them informed (and buying!) fast.

Sliders

While we would’ve loved to incorporate a section on the wonders of little hamburgers, the sliders in question here are a feature used heavily in mobile game design. And while they don’t satiate your hunger, they do satiate your need to feng shui your screen space.

Sliders are, essentially, moveable pieces of content. Not moveable in terms of users being able to move the box around the screen, but moveable in terms of them being able to -- well, slide -- the content to reveal new content.

They can work side to side. They can work up and down. The direction doesn’t matter; what does matter is that your users are able to see everything they need to see clearly, without the offer box being cluttered. In other words: they’re in total control.

 

1_QGVinTgEkI9L6Kh7slGn2w

Image originally sourced from Amir Dori's article on Game UI Design

They’re the ones sliding the content. They’re the ones deciding what to read and when to read it. By giving them a feature that invites their active interaction with the offer, you’re giving them a way to pay more attention to the opportunity in front of them. And when they’re paying attention, when they’re thinking about the benefit that the power boost or the new weapon can give them, they’re all the more inclined to buy in.

Sliders are a great way to optimize your screen space

 

Sliders give you feng shui, but they also give you user interaction. That’s a double-win if we’ve ever seen one.

Summary: Sliders are a design feature that help you keep your screen space organized -- and your users interacting with the offer. (And where there’s interaction, there’s selling power.)

The Right Messaging

When we talk about visuals, usually the coloring and imagery components come to mind first. But we’d be remiss if we didn’t give language its fair time to shine. (And we’re never remiss.)

Language is, by all accounts, your most persuasive tool. When used correctly, it can inform, motivate, and impact in memorable ways -- and no, you don’t have to be a mastermind wordsmith to get it working for you.

What you do have to be is specific.

We know that the average person spends 15 seconds on a site before deciding whether or not they want to further interact with it -- which means, for your teeny tiny offer, you have even less time than that to leave an impact. With just a few seconds on your ticking clock, you need to get your message across quickly, succinctly, and in a way that drives them to act. So how do you choose your words?

You take the verbatim effect into account. People don’t care about the intricacies of the message -- what they care about is the overarching point. Don’t waste your precious words on outlining the details; instead, make every offer read like a well-crafted headline. Call out the names of the boosts, the abilities, and the add-on weaponry or apparel -- and use those call-outs to evoke their power.

 

Be clear with your game offer headlines

 

Here’s an example: an offer box that includes The Fire-Resistant Cloak, The Dragon-Slaying Dagger, and the Bleeding Wound Healing Potion. The titles give you a clear sense of what the items can do and what’s at stake if the users don’t buy in -- and they only take a few words, in each case, to do it.

Another psychology-backed messaging rule to take into account here is that of clustering. Playing off of the verbatim effect, which is based on the impatience of users, clustering is grounded in the belief that users simply can’t remember all that much. And if you expect them to, they’re going to tap out of the process.

To get around that, smart game developers know to cluster pieces of information together, so that their audience can make decisions quickly and assuredly -- without having to do the mental work they don’t want to.

For in-game offers, that looks like combining similar items to paint a clearer picture, faster. If you have an offer box where you’d like to include eight different items/boosts/abilities -- sure, you could use sliders to get it done. And you could use sparse messaging, abiding by the verbatim effect, to get it done without overwhelming your users.

But if you really want to pull them in, you cluster different groups of those items together.

Example A: The Healing Package, which includes a potion, a shield, and a health boost.

Example B: The Warrior Package, which includes a dagger, an invisibility cloak, and a power boost.

It’s so much easier for users to understand the offer, visualize the impact, and recall why they’re motivated to act when the value in question is overarching. It’s not just a single weapon or potion with a single use-case -- but a package that will make their entire gameplay safer. It’s not just a one-off power boost or new ability, but a package that will make their entire entrance into battle more successful.

Your users are lazy. The less dots you give them to connect, and the less legwork you make them do on their own, the more sales you’ll see. With clustering, you can keep it all simple. (And, if you want a recap of what clustering can mean for your pricing -- we’re talking much more $$$ -- head back to our last article Part 2: How to price the perfect offer.)

The bottom line here is that words matter. Make sure you’re picking the right ones, and using them in the right ways, to achieve your offers’ greatest potential.

Summary: The right language is just as important as the right imagery. Use it to inform, persuade, and impact -- so that your users have the motivation they need to buy in.

Designing the Bundle

It’s already pretty clear that bundling is key. When you bundle different items/abilities/boosts into one offer, it helps your audience’s interest go up, it helps the average order value go up, and it helps the stakes of what happens if they don’t act go up.

But, if the offer options in the pop-up box include two single-item offers and a bundle, or two smaller bundles and one bigger one, how do you make sure that your users are understanding the value of the bundle you want them to choose?

How do you work overtime to persuade them that the best option -- from a price and an impact standpoint -- is the biggest option?

You use visuals. Because even the slightest visual tweak, even the most subtle burst of visual difference, has the power to steal attention. And where there’s stolen attention, there’s a higher likelihood of action.

So let’s talk visual difference. For starters, the option you want your audience to choose should be the largest. Physically. It should take up the most space, be the most centrally located, and have its text and images be greater in size than the text/images in the other offers.

It should also be the most visually compelling. Its colors should be the most striking, the most vivid, and the most attention-grabbing, and the images inside should be the most attractive -- and inviting.

If you’re selling a Weapon Package, a Healing Package, and a Total Triumph Package -- with the latter including the best items from both of the former options -- you need the Total Triumph Package to radiate. So get specific with your visual choices.

Here’s an example: maybe the Weapon and Healing Packages only have small images of the items inside of them, like swords and potion bottles, but the Total Triumph Package has a large picture of your user’s character mid-action. We can see the character’s face, looking victorious. We can see the new items around them, sparkling with power.

Your users are going to connect more with a character than they are with a potion bottle or a sword, and your number one priority is to drive that connection. Because when they can envision the personal impact, they’ll want to make it theirs a whole lot more.

Repeat it with us: impact leads to action. Impact. Leads to. Action.

Summary: In order to get your users clicking the biggest offer, you need to fill it with the most captivating visuals: striking colors, larger text, and images your audience can identify with.

Goodbye X’s

When your users are immersed in a game they love, the last thing they want to do is pause -- even when that pause is for an offer that could enhance their gameplay. Their instinctive reaction, more often than not, will be annoyance.

That means you have to do everything in your power to make sure they stay with the offer long enough for that annoyance to pass -- so that they can understand the true merit of what’s being advertised to them.

A huge -- huge -- part of that is their escape route. Namely, the little ‘x’ in the top right corner that your users have been conditioned to expect, from years and years of gameplay. So flip that expectation on its head. Really Hulk out on it.

When your users instinctively move their thumbs to the top right corner of the offer -- seconds after it pops up on their screen -- make sure there’s nothing for them to click. Force them to take in their surroundings, to find where their trusty off-ramp has moved to, because when they’re doing that -- what they’re really doing is immersing themselves in the offer.

Taking in what’s for sale. Reading the messaging and scouring the imagery. Like it or not, they’re being absorbed -- and as they’re being absorbed, their annoyance level is going down.

So how do you achieve this effect in all its maximized glory? How do you defy your users’ escape route expectations, while still keeping an escape route in play?

First, you get rid of the ‘x’ entirely. Choose a different word to be your Get Out Now button, so that as your users’ eyes are scanning the offer for their trusty ‘x,’ they come up empty-handed. (When they don’t know what they’re looking for, it takes them a whole lot longer to find it.)

Plus, since your audience equates the ‘x’ with all of the annoying content they’ve tried to escape over the years, not having it anywhere near your offer means that you’re effectively stopping your users from seeing it as ugh.

 

Drop the x and try an alternative.

 

Is this a dark pattern? Some might suggest it. Feel free to join the conversation on LinkedIn.

 

You’re showing them, visually, that this content, this offer, isn’t annoying. It’s helpful.

Next, avoid the top right corner like it’s the plague. Find new, creative places to drop your escape button -- and keep mixing it up. Different offers should have different escape route locations to keep your users guessing, and to keep their eyes on the prize: the offer as a whole.

Escape button locations could be as simple as the bottom left corner, or as revolutionary as a small tab in the middle of the bottom bar. Here’s a solid example: an offer appears and, after two seconds, a small tab in the bar spanning the length of the bottom of the box reads, “I don’t need a boost.” Or, if you’d like to stick with the classics, it simply reads: “Close.”

Remember: make your users search for their escape. Because the longer they spend searching, the more time you have to convince their annoyance to dissipate -- and drive action.

Summary: Avoid the top left ‘x’ button with everything you’ve got; the harder you make it for your users to find their escape route, the more time you’re giving the offer to be absorbed. And offer absorption leads to action.

The Right Side

That’s a beautiful segue into talking about the right side as a whole, if we do say so ourselves. (And we do. We do say so.)

Here’s the Sparknotes: the right side is literally the right side for your positive action buttons, because it drives way more immediate, active response than its left-er counterpart. Why? We’re glad you asked. Drumroll, please...

First, let’s work under the assumption that the majority of your audience uses their right thumb to lead-operate their phone. (Since up to 95% of the global population is thought to be right-handed, this seems like a fair assumption.) With the right thumb being the dominant thumb, it’s much more poised to act -- and act quickly -- than the left thumb. We’re not trying to start a thumb war, but it’s pretty clear that, as a result, the spatial configuration of buttons should reflect that difference.

In other words: put the buttons you want your users to be hitting in the comfort-to-reach area for the right thumb. Hence… the right side.

Second, coming back to the widespread expectation that the button to leave the offer will be on the right side -- putting the positive action buttons there instead forces users to pause. It forces them to take in the offer. And by now, we know that pauses to take in the offer are always a good thing.

Let’s look at a simple example: Angry Birds throws a pop-up into the game when a user’s about to leave, asking: Are you sure you want to quit? But they put the yes button on the left, and the no button on the right. Makes you stop to think, doesn’t it?

For an in-game offer, that logic would look like this: in the center of the box, there are three different offer options. On the right side, there are two buttons, one on top of the other -- the first reads, “Go to the store!” and the second reads, “Buy now!” (The ‘Buy Now!’ button only becomes clickable when one of the offer options has been selected.)

 

Place negative actions on the left, positive actions on the right

 

The escape button, simply reading ‘Leave These Offers Behind,’ is much smaller -- and located inside the box, at the bottom left corner.

The effect? The users eyes are drawn to the positive action buttons first, presuming that of the two, one must be the escape. Of course, in this case, neither of the buttons takes them back to the game; one takes them to the game store of goodies, and one takes them to check out. But because these buttons caught their eye first -- and because they’re so gosh darn easy to hit -- the likelihood of them being hit is much higher.

See? We told you. The right side is the right side.

Summary: Positive action buttons should always be placed on the right side -- because users are quicker to use their right thumbs, and because they’re expecting escape buttons to be there instead.

Show Off Your Popularity

Okay, easy, tiger. Not your popularity. The popularity of your offer.

How it’s faring among its audience. Whether your users are happy with their purchases. Whether they’re buying more than once. Whether they’re voting the offers into homecoming court. You get the point.

The key here is to call on your offer’s social proof to help convince your audience that buying in is the right decision -- because look at how many other smart, active players have bought in too, and look at how they’re doing as a result.

So how do you do that? If you’re looking to use the buying decisions of the audience as a whole to convince an individual user to buy in, then a purchase counter might just be your best friend.

Alongside the title of an offer option -- the Power Boost Bundle, for instance -- pin up a counter that reads the number of times the option in question has been purchased. “Bought 3949 times” can go a long way in convincing a user that not only is the bundle valuable, but that other people, just like them, have believed in its value too.

The less alone your users feel in their buying journey, the lower the risk they’ll perceive there to be. And the lower the risk, the higher the likelihood they’ll hit that ‘Buy Now!’ button.

But that’s not the only use case for social proof here. In fact, far from it. Once you understand the foundation behind why the counter can be so undeniably effective, you have the toolbox you need to get creative. So here’s your push: get creative.

Maybe, instead of a general “Bought 3949 times,” you switch it up to “purchased by 942 game champions” to showcase that not just anyone buys the offer -- but that winners buy the offer.

Or maybe you use the counter to remind your user how many times they themselves have bought into an offer. Take the Flying Boost for example: if you have a user that’s bought it four times in their game history, and you pop the offer up with a banner that reads, purchase a 5th time!, you’re grounding the offer in a low-to-no-risk scenario. Because your user already knows what the boost will do for them; they already know that they like it, and that they’ve historically liked it enough to buy it again. More often than not, a little nudge like that is all it takes.

It’s been written -- by people a lot smarter than us -- that the key to leveraging social proof for all that it’s worth is by “simply and honestly depict[ing] what the majority of others who are similar to your target audience are already doing that you’d like your audience to do, too.”

The counter checks that box. Get creative with it, make it your own, and get ready to boost your persuasion power.

Summary: By including a ‘counter’ of times purchased next to a specific offer, you’re leveraging social proof to persuade your users that the offer is valuable, and the risk is low. That will lead to results.

Some Final Notes

Popularity matters. First impressions decide your fate. Looks are the most important thing.

Look, we know your mom won’t be happy with this article. We know it’s not something you’d quickly share with your first grade teacher, or with your pre-teen son. But it is, for all intents and purposes, the key to you grabbing your profitability potential by the horns.

Because the psychological framework -- the foundation of your offer strategies -- is important. Getting your pricing into the right shape at the right time is crucial too. But there’s no such thing as a cake without icing.

Or maybe there is, and we’ve been too focused on the cakes with icing to notice.

That’s why you have to leverage every chance you have to make your in-game offers stand out. It’s not just about generating sales -- it’s about keeping your users interested.

Offering them more tricks, more abilities, more varied gameplay. Because if there’s no opportunity for growth, there’s no opportunity for sustainable long-term interest. And that’s no good for anyone.

The positioning component, the visual component, is the key to enacting killer offers that resonate. And when you have killer offers on the table, your users can’t help but buy in; and when they buy in, they become more invested in the game. And yeah, more likely to buy in again.

So take your visuals seriously. They’re the driver of the whole cycle -- the finishing touches that make sure your game doesn’t just have what it needs to flourish today, but has what it needs to flourish down the line too.

Nail down the right colors. Amp up the right messaging. Show off the right imagery to get your audience connected, excited, and moving their thumbs.

That’s it -- that’s the rationale. Those are the suggestions, and those are the examples. We’ve given you everything we know, everything we have, and now it’s your turn. You’ve got to bring them to life.

Because the sparkle? It’s waiting. It’s up to you to bring it home.

Want more tips like this?

We're launching the UserWise Academy -- the #1 community for game makers to learn and grow. Enroll for F-R-E-E today and we'll notify you when we launch.

👇

academy-cta

 

We use cookies to enhance your browsing experience, personalize content, and to help us better understand how you use our sites. By using our site, you agree to our Privacy Policy page.