1124929 - SMS functionality on about:home - development

Status: RESOLVED FIXED

(Snippets :: Service, defect)

Description

[Fabio Rios [:frios]]

Attachment: sms-about-home.jpg

Background
In order to acquire more Android users, we are currently linking to this page from a simple snippet: https://www.mozilla.org/en-US/firefox/sms/

We've seen decent conversion and feel that eliminating the need to visit a new web page will increase conversion significantly.

Description
We'd like to include the SMS functionality directly on about:home. See the attached mockup. Note this is only a mockup. We will provide exact layout later.

We should still have the ability to manually change the text.

Metrics
We need to be able to track how many people used the service (clicked the button).

Date needed
February 2nd or as soon as possible.

Comment 1

[Giorgos Logiotatidis [:giorgos]]

I'll work on this next week. Schedule is a bit tight but I think we can make it.

On button click, user gets redirected to mozilla.org/firefoxos/sms page with a thank you (or error) message. Sounds good?

Comment 2

[Winston Bowden]

Hi Giorgos -

Awesome.

I'm meeting with creative team today to ask for some creative support.  Should be straightforward design.

On the experience:  We want to keep them on about:home vs taking them to that SMS page.  

For successful send - the button would disappear and a success mage would display in the box on about:home

For a failure - we'd show the failure message, but show a link to Google Play. 

I'll work on adding those two results into the mock up.

Comment 3

[Cory Price [:ckprice] (bugmail disabled, NI me!)]

:giorgos

The deployment date for this snippet has been pushed out to 2/12/15. We also have designs incoming in bug 1125319. If you want to work on the text integration, feel free, but know that the layout could change.

Comment 4

[Winston Bowden]

Do you guys have what you need in terms of accessing exact target's api?  I think Pmac (and maybe mkelly) did the bulk of the SMS work on the landing page.

Comment 5

[Fabio Rios [:frios]]

Additional items to incorporate. Please note #3-5 are wants. We don't want to delay the release for these.

1. Main message should be editable. At minimum for "landing state"

2. Logo replacement graphic is changeable: we can use with standard Firefox logo, or replace it gif or animated gif

3. Edit link that is sent via SMS:  This would allow us to add tracking to the download link received via text message. Off the top of my head, I would modify the Bitly link based on the message of the snippet so we can optimize for conversion.

4. Ability to exclude Mac users from snippet: it's estimated ~25% of Mac users have an Android, meaning this message will be irrelevant to ~75% of this audience. Can we add this to Client Match Rules?

5. One time action: can we stop it from showing or show a different state on future visits once the user has seen the "success state". 

Thanks.

Comment 6

[Cory Price [:ckprice] (bugmail disabled, NI me!)]

(In reply to Giorgos Logiotatidis [:giorgos] from comment #1)
> On button click, user gets redirected to mozilla.org/firefoxos/sms page with
> a thank you (or error) message. Sounds good?
Ideally the snippet content will update while keeping the user on about:home. Is this possible?

Comment 7

[Fabio Rios [:frios]]

Snippet copy below. Note, this copy is to be used as a place holder only as this copy may change later.

Landing state: Firefox for Android is filled with features to keep your private info private, the way it should be. Download Firefox for you Android. Standard text messaging rates apply. Also available from <a>Google Play.</a> (links to: https://play.google.com/store/apps/details?id=org.mozilla.firefox)

Success state: Success! Firefox for Android is on the way to your Android phone. You can sync your Firefox desktop with your Firefox for Android. <a>Learn more.</a>(links to: https://www.mozilla.org/firefox/sync/

Fail state: Oops. Something went wrong. We were unable to send you a text message. <a>You can also get Firefox for Android from Google Play.</a> (links to: https://play.google.com/store/apps/details?id=org.mozilla.firefox)

Comment 8

[Cory Price [:ckprice] (bugmail disabled, NI me!)]

(In reply to Fabio Rios [:frios] from comment #5)
> 4. Ability to exclude Mac users from snippet: it's estimated ~25% of Mac
> users have an Android, meaning this message will be irrelevant to ~75% of
> this audience. Can we add this to Client Match Rules?
bug 1126013 has been filed for this.

Comment 9

[Giorgos Logiotatidis [:giorgos]]

(In reply to Cory Price [:ckprice] from comment #6)
> (In reply to Giorgos Logiotatidis [:giorgos] from comment #1)
> > On button click, user gets redirected to mozilla.org/firefoxos/sms page with
> > a thank you (or error) message. Sounds good?
> Ideally the snippet content will update while keeping the user on
> about:home. Is this possible?

Yes it's possible but it increases complexity drastically. I expect that we'll route sms through bedrock (and not directly ExactTarget, thus we don't need any API keys) and that will possibly involve bedrock changes as well. I'll provide more implementation details and delivery estimations for the requested deadline early next week.

Comment 10

[Cory Price [:ckprice] (bugmail disabled, NI me!)]

:giorgos

Per bug 1125319 comment 15, we'll be sending users to the existing page to process the request.

Question: can we handle the phone number checking/JS popup on the snippet itself? At least do a check for valid phone number syntax before we send it to the sms/sent page?

A final design is requested by 2/3. If we could get this ahead of the 2/12 date, it would be appreciated.

Comment 11

[Cory Price [:ckprice] (bugmail disabled, NI me!)]

Per bug 1125319 comment 19, we are approved to move forward with development based on the mockup in bug 1125319 comment 15.

Giorgos, please let me know if you require any further creative assets, and if you have answers to the tech and timing question above that would be great.

Thanks!

Comment 12

[Cory Price [:ckprice] (bugmail disabled, NI me!)]

Per a meeting with Giorgos today: 

Since the service is U.S. only, we'll be able to validate directly on the snippet.

Less complication (and a better UI) if we forego the popover and use enable/disabled states of the button.

> 5. One time action: can we stop it from showing or show a different 
> state on future visits once the user has seen the "success state". 
This would involve some fairly complex updates to the snippet service. Of which we have some existing investigation bugs (e.g. conditional snippets). We recommend not implementing for the single snippet.

(In reply to Winston from email)
> How hard would it be to add some logic to that page that prevents 
> a user from sending more than twice in a given period of time?  
> Might help with preventing abuse of the system.
This is all handled by the ExactTarget SMS service. It's been in effect for some time on the existing landing page, and there are no concerns as far as load on the snippet service itself.

Comment 13

[Giorgos Logiotatidis [:giorgos]]

(In reply to Fabio Rios [:frios] from comment #5)
> Additional items to incorporate. Please note #3-5 are wants. We don't want
> to delay the release for these.
> 
> 1. Main message should be editable. At minimum for "landing state"

Can you please clarify which is the main message in the latest mockup?

https://bugzilla.mozilla.org/show_bug.cgi?id=1125319#c26

Comment 14

[Giorgos Logiotatidis [:giorgos]]

(In reply to Fabio Rios [:frios] from comment #5)
> 3. Edit link that is sent via SMS:  This would allow us to add tracking to
> the download link received via text message. Off the top of my head, I would
> modify the Bitly link based on the message of the snippet so we can optimize
> for conversion.

Here's that I found out:
 - When a user uses the form we subscribe them in a ExactTarget group called SMS_Android
 - Then the user receives a welcome message, which contains the link to download Firefox for Android

Therefore the message is not an one-off message, but defined in the configuration of the SMS_Android ExactTarget group. From the Snippet service (or bedrock) side cannot change the message.

Comment 15

[Cory Price [:ckprice] (bugmail disabled, NI me!)]

:giorgos - just want to confirm that we'd like to initiate a sendMetric('sms-subscribe') whenever a user clicks the button and it passes validation.

Comment 16

[Fabio Rios [:frios]]

(In reply to Giorgos Logiotatidis [:giorgos] from comment #13)
> > 1. Main message should be editable. At minimum for "landing state"
> 
> Can you please clarify which is the main message in the latest mockup?
All the text above the phone number section should customizable. So in the mockup "Get Firefox fo..." and "Send it to yo.." is all customizable. While I don't anticipate links there, perhaps making it an html field so I can adjust the formatting manually.

Comment 17

[Fabio Rios [:frios]]

(In reply to Giorgos Logiotatidis [:giorgos] from comment #14)
>  - Then the user receives a welcome message, which contains the link to
> download Firefox for Android
> 
> Therefore the message is not an one-off message, but defined in the
> configuration of the SMS_Android ExactTarget group. From the Snippet service
> (or bedrock) side cannot change the message.

Got it. No action here then. Thanks.

Comment 18

[Giorgos Logiotatidis [:giorgos]]

Here's what we have so far:
 - Button that activates after input is at least 10 characters. Input goes up to 14 characters, same as in bedrock.
 - On click send-metric is send (*)
 - After send-metric completes, we submit the form.
 - Editable header text
 - Editable main text that allows html
 - Editable Android Icon
 - Editable Brand Logo (optional, can be left blank and show default image)

Snippet Template
 - https://snippets.allizom.org/admin/base/snippettemplate/30/ 

Snippet:
 - https://snippets.allizom.org/admin/base/snippet/79/

Preview:
 - https://snippets.allizom.org/show/79/

(*) Note that a service change is required for the actual send to work. See bug 1124471

Comments?

Comment 19

[Cory Price [:ckprice] (bugmail disabled, NI me!)]

(In reply to Giorgos Logiotatidis [:giorgos] from comment #18)
> Here's what we have so far:
>  - Button that activates after input is at least 10 characters. Input goes
> up to 14 characters, same as in bedrock.
>  - On click send-metric is send (*)
>  - After send-metric completes, we submit the form.
>  - Editable header text
>  - Editable main text that allows html
>  - Editable Android Icon
>  - Editable Brand Logo (optional, can be left blank and show default image)
> 
> Snippet Template
>  - https://snippets.allizom.org/admin/base/snippettemplate/30/ 
> 
> Snippet:
>  - https://snippets.allizom.org/admin/base/snippet/79/
> 
> Preview:
>  - https://snippets.allizom.org/show/79/
> 
> (*) Note that a service change is required for the actual send to work. See
> bug 1124471
> 
> Comments?
:frios - any comments? Please also confirm that the editable fields are good in addition to the look/feel. Note: actual send is still pending, but everything else is in.

Comment 20

[Fabio Rios [:frios]]

Attachment: firefox-android_sms-functionality_snippet.png

(In reply to Giorgos Logiotatidis [:giorgos] from comment #18)
> Here's what we have so far:
>  - Button that activates after input is at least 10 characters. Input goes
> up to 14 characters, same as in bedrock.
>  - On click send-metric is send (*)
>  - After send-metric completes, we submit the form.
>  - Editable header text
>  - Editable main text that allows html
>  - Editable Android Icon
>  - Editable Brand Logo (optional, can be left blank and show default image)
> 
> Snippet Template
>  - https://snippets.allizom.org/admin/base/snippettemplate/30/ 
> 
> Snippet:
>  - https://snippets.allizom.org/admin/base/snippet/79/
> 
> Preview:
>  - https://snippets.allizom.org/show/79/
> 
> (*) Note that a service change is required for the actual send to work. See
> bug 1124471
> 
> Comments?

Nice this works great! Fields are fine, no issues there.

A few minor cosmetic tweaks and I think it's done. See slightly updated mockup for reference on the below.

- Decrease font size on header & text, 1pt should do
- Increase padding on left side of image by 1 or 2px
- button color should be blue
- decrease size of copy below line. Design has it at 8pt, tiiiinyyy
- Adjust lower copy and format to match attached image. "Also available from Google Play. SMS & data rates may apply. The intended recipient of the SMS must have consented. Learn More."

Comment 21

[Giorgos Logiotatidis [:giorgos]]

(In reply to Fabio Rios [:frios] from comment #20)
> - button color should be blue

Per comment 12 button turns blue and gets active once you enter a valid phone number. We can keep the button blue and only make it clickable once the phone number is valid or we can investigate other input handling UIs.

> - Adjust lower copy and format to match attached image. "Also available from
> Google Play. SMS & data rates may apply. The intended recipient of the SMS
> must have consented. Learn More."

Where should "Learn More" link to?

Comment 22

[Giorgos Logiotatidis [:giorgos]]

Updated:
 - Decreased header and text font size. Added some line-height in text
 - Increased padding for image
 - Changed copy and made it smaller
 - Changed text color to #484848 and link color to #0073AA to match mockup
 - Added padding between text and to form match mockup

We still need to link "Learn More"

Comments?

Comment 23

[Giorgos Logiotatidis [:giorgos]]

(In reply to Giorgos Logiotatidis [:giorgos] from comment #18)
> (*) Note that a service change is required for the actual send to work. See
> bug 1124471

This is RESOLVED/FIXED

Comment 24

[Fabio Rios [:frios]]

Giorgos, this looks great. Thanks for the note about the blue button. This works fine.

I'm pretty sure the Learn More links to our Privacy Policy. I will get back to you.

I'll get it across to Winston this morning, but I think this one is just about done.

Comment 25

[Fabio Rios [:frios]]

Giorgos, this looks good. once we set up the link it's ready to go.

The Learn more will link to our privacy policy. Unfortunately I'm not 100% sure on the exact section.

Winston, can you confirm this is the correct section: https://www.mozilla.org/en-US/persona/privacy-policy/

Comment 26

[Cory Price [:ckprice] (bugmail disabled, NI me!)]

Confirmation received via email from :wbowden

This is where it will go, but I don't think they've updated yet:
https://www.mozilla.org/en-US/privacy/firefox/#snippets

:giorgos, please update.

Comment 27

[Cory Price [:ckprice] (bugmail disabled, NI me!)]

The updated privacy policy is update and live.

Once the template has been updated with the correct link (comment 26), this will be ready for deployment.

Comment 28

[Giorgos Logiotatidis [:giorgos]]

We're good to go.

Here's the template:

 https://snippets.mozilla.com/admin/base/snippettemplate/30/