Closed Bug 967852 Opened 10 years ago Closed 10 years ago

Updated Firefox + Android illustration for Sync set up flow

Categories

(Marketing :: Design, task)

Product:
Marketing
Component:
Design
Platform:
All
Other
Type:
task
Priority:
Not set
Severity:
normal

Tracking

(Not tracked)

Status:
RESOLVED FIXED
Due Date:

People

(Reporter: deb, Assigned: smartell)

Details

Attachments

(2 files)

startscreen.png
65.21 KB, image/png
Details
verifiedscreen.png
87.22 KB, image/png
Details 
>>Project/Request Title:
Updated Firefox + Android illustration for Sync set up flow

>>Project Overview:
We're going to prompt Desktop users who set up a Firefox Account & Sync to install and use Firefox on Android, as part of the Sync set up flow.

There is a screenshot of the screen in question that I will forward to Sean Martell.

>>Creative Specs & Deliverables:
We need two things:

1) an illustration/logo (we were thinking an updated (and larger) version of this https://mozorg.cdn.mozilla.net/media/img/mobile/illo-fxandroidphone.png?2013-06) - we're flexible if there's a better illustration to use, of course, but time is somewhat of the essence.

2) copy - ideally something short and pithy that prompts users to also install Firefox on their Android device and signing into their Firefox account there.

>>Launch Date:
2014-02-14

>>Creative Due Date:
2014-02-10

>>Mozilla Goal:
Firefox Android

>>Points of Contact:
ARRAY(0x7f442a046868)
Alternately, Ian suggested the Android guy wearing a Firefox tshirt (he has a PSD file for it) :: http://image.e.mozilla.org/lib/fe9915707361037e75/m/1/Android_Hearts.jpg

Will attach two screenshots here: one of the Sync start screen and one for the Sync verified screen.  The suggestion is that we do the prompt & branding on the verified screen, and consider possibly including it on the start screen.

All relevant UX folk are cc'd here.
Attached image startscreen.png — 

    
    

    
  
Assigning to Sean - sounds like he's had some outside-the-bug convos and knows what to do.
Assignee: jbalaco → smartell

    
  
Status: NEW → ASSIGNED

    
    

    
  
Is there any way to know if the user already has Firefox for Android? Should we be showing a download and install message to everyone?

Something like this might be generic enough to cover all users:

Sign in on Firefox for Android to sync your mobile device

    
    

    
  
The purpose of this promo area is to funnel more new users into our Android product, and so I think we should be explicitly directing people to the Play Store where they can remote install Firefox onto their devices. Given that, I don't think that a softer "Sign in to Firefox for Android" line covers that requirement to the extent we want.

> Is there any way to know if the user already has Firefox for Android? 

I am guessing no. 

> Should we be showing a download and install message to everyone?

I think we do, for now, yes. I would say that the value in that potential uptick of new users far outweighs any possible negative feeling a current Fennec user might have in seeing a "install Firefox for Android" banner. 

If we can reword the banner for existing Android users at some point down the road, great, but I definitely wouldn't make that an initial technical requirement for this feature.

    
    

    
  
Yeah, we're definitely trying to drive Desktop users to install Firefox on their Android device to get full value out of their shiny new Firefox Account & its cross-device Sync capabilities.

We should also keep in mind that someone with an Android phone may also have an Android tablet, so we might want to show it to people who even already have Firefox on one device, so they know that they can install it and get the full Sync experience on their other devices as well.

    
    

    
  
Awesome, thanks for the context. Would this work?

Get Firefox for Android and sign in to sync your mobile devices

I know that's a bit long, but maybe it could be formatted with "Get Firefox for Android" in big type and "and sign in to sync your mobile devices" in smaller type below it.

    
    

    
  
(In reply to Matej Novak [:matej] from comment #5)
> Is there any way to know if the user already has Firefox for Android? Should
> we be showing a download and install message to everyone?
> 
> Something like this might be generic enough to cover all users:
> 
> Sign in on Firefox for Android to sync your mobile device

We will have to do some kind of filtering from the FxA account server, because FFOS users creating Firefox Accounts will go through the same verification process, and we probably don't want to advertise our Android product to these folks.

    
    

    
  
(In reply to Matej Novak [:matej] from comment #8)

> Get Firefox for Android and sign in to sync your mobile devices

Nice. One question -- are syncing "your mobile devices", or might it be "your tabs, bookmarks, passwords & more" like we call out in other parts of the flow

    
    

    
  
(In reply to Ian Barlow (:ibarlow) from comment #10)
> (In reply to Matej Novak [:matej] from comment #8)
> 
> > Get Firefox for Android and sign in to sync your mobile devices
> 
> Nice. One question -- are syncing "your mobile devices", or might it be
> "your tabs, bookmarks, passwords & more" like we call out in other parts of
> the flow

I can see it both ways. The latter is more clear, but significantly longer. They'll also have already gone through the flow and seen those details. In this case I thought it was better to mention that they can have all their browsing data on their phones and tablets. But if you think it's better to call out that data specifically, I'm fine with that as well. It's just a question of it will fit and not look to long or overwhelming.

    
    

    
  
Definitely concur on filtering this out for FxOS users.  Is there a way to do that easily?

I agree with the "shorter is better" in this situation, re: text.  As Matej says, users will have just gone through the sign-up flow and should understand the fiddlybits, so "Get Firefox for Android and sign in to sync your mobile devices" seems sufficient.

Alternately: "You can also *Get Firefox for Android* and sign in to sync your mobile devices" or something.  Maybe give it more of a "hey did you know?" sort of feel?

    
    

    
  
+1 to Deb's option in comment 12.

How important is it that we say "sign in"? Is it sufficient to just tell users that sync is on Firefox for Android as well.

Here are some other options:

You can even sync your mobile devices. Get Firefox for Android.

You can even sync your mobile devices. Get Firefox for Android and sign in.

You can even sync your mobile devices. Get Firefox for Android and sign in to get started.

Stay in sync on the go. Get Firefox for Android.

Get Sync on your mobile devices with Firefox for Android.

Get Sync on your mobile devices. Get Firefox for Android.

    
    

    
  
I like all of these :)

    
    

    
  
I kind of like "Stay in sync on the go. Get Firefox for Android." Short, to the point, starts with a value prop and ends with a clear call to action.

Poooossible alternate: "Stay in sync on the go: Get Firefox for Android." but at this point I'm possibly being ridiculous. :)

Final wording/punctuation is up to Matej, of course.

    
    

    
  
I think it entirely depends on how it's laid out. Given that the second line will probably be a link, it doesn't need the period. I imagine it will end up something like this:

Stay in sync on the go:
<a>Get Firefox for Android</a>

    
    

    
  
Works for me.  I guess we're just waiting on the updated illustration now?

    
    

    
  
Hey all,

Here is where I am thus far - http://cl.ly/image/3U383j3M0p1l

Example in use: http://cl.ly/image/2r3V113m171d

I think it keeps it fun and playful - whimsical even - without getting too detailed in the artwork so it doesn't distract from the task at hand.

Thoughts? concerns? pie recipe?

    
    

    
  
Alt option to throw down moar of our color palette: http://cl.ly/image/1r3c0s412M1L

    
    

    
  
I dig both the all-blue and the multi-colour, so will leave final call on that up to the UX crew. Thanks a ton, Sean :)

    
    

    
  
Other example (perhaps changing the text color to our green also) http://cl.ly/image/2P0e0o213m0U

    
    

    
  
Hey sean, these look great! 
 
Do you have high res versions of these images for me to fuss around with?

    
    

    
  
Hey Sean, thanks for these!

I'll admit, these illustrations weren't actually what we were asking for -- they look great, and in fact I think we can probably use them, but the intent here was actually to add some kind of promo graphic *in addition* to the content that was already on these screens. 

These endpoint screens all need to convey a primary message, whether it's "Verification email sent" or "Email verified" or whatever, and the Android promo thing was meant more as a second thought on those screens. Here's a quick sketch of what I mean.


    +-------------------------------------------+
    |                                           |
    |                                           |
    |                                           |
    |             Email Verified                |
    |                                           |
    |                                           |
    |              +----------+                 |
    |              | checkmark|                 |
    |              |  graphic |                 |
    |              +----------+                 |
    |                                           |
    |                                           |
    |          Your account is ready!           |
    |                                           |
    |                                           |
    |                                           |
    +------------------------------------------->
    |                                           |
    |  +------+                                 |
    |  |      |  Stay in sync on the go:        |
    |  |      |  Get Firefox for Android        |   <--- the graphic we needed help with
    |  +------+                                 |
    |                                           |
    +-------------------------------------------+


Also, the heart and the Android guy is cool, but might make more sense as the Android promo graphic, not as the main "success" graphic which should probably be a little more platform agnostic.

    
    

    
  
Ian-

1. you are an ascii genius
2. that was my thought as well.

    
    

    
  
I'll let you in on a little secret: http://www.asciiflow.com/#Draw :)

    
    

    
  
(In reply to Ian Barlow (:ibarlow) from comment #25)
> I'll let you in on a little secret: http://www.asciiflow.com/#Draw :)

i formally rescind my praise

    
    

    
  
http://cl.ly/image/2Y2C1j0e1E3E

I've sent along the far left option with the weeeee hearts to John as a smart object PSD.

<3

    
    

    
  
The wee hearts one is adorbz. <3

    
    

    
  
Friendly ping to jgruen and rfeeley -- it seems to me like we have what we need to make this promo message real: we have the illustration, we have the copy, we have a rough idea for placement in the UI. What else needs to happen to push this forward?

    
    

    
  
This is completed! Resolving some old boogz. \o/
Status: ASSIGNED → RESOLVED
Closed: 10 years ago
Resolution: --- → FIXED

          You need to log in
          before you can comment on or make changes to this bug.
        






  

    
  







  

    

      
Attachment

      

      
      
      
      
    

    

      

        

          

            
General

            

              Creator: 



            

            
Created: 

            
Updated: 

            
Size: