revised content phone content

This commit is contained in:
Beverly Nguyen
2024-10-02 09:52:44 -07:00
parent 4eff686e17
commit cecfeb7441
7 changed files with 58 additions and 144 deletions

View File

@@ -1,7 +1,7 @@
{% macro circle_number(number) %}
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 100 100">
<circle cx="50" cy="50" r="45" stroke="black" stroke-width="4" fill="none" />
<text x="50%" y="50%" text-anchor="middle" font-size="50" font-weight="bold" fill="black" font-family="Arial"
<svg xmlns="http://www.w3.org/2000/svg" class="svg-circle-icon" width="24" height="24" viewBox="0 0 100 100">
<circle cx="50" cy="50" r="37" stroke="#005ea2" stroke-width="7" fill="none" />
<text x="50%" y="50%" text-anchor="middle" font-size="40" font-weight="bolder" fill="#005ea2" font-family="Arial"
dy=".35em">
{{ number }}
</text>

View File

@@ -23,72 +23,23 @@
delivered, how people engage with messages, and how they take action.
</p>
<h3>Message delivery</h3>
<p class="text-bold">Benchmark: 80% of texts are successfully delivered</p>
<svg width="200" height="200" viewBox="0 0 36 36">
<!-- Background circle -->
<path stroke="#e0e0e0" stroke-width="3.8" fill="none" d="M18 2.0845
a 15.9155 15.9155 0 0 1 0 31.831
a 15.9155 15.9155 0 0 1 0 -31.831" />
<!-- Progress circle -->
<path stroke="#005EA2" stroke-width="3.8" stroke-dasharray="80, 100" fill="none" d="M18 2.0845
a 15.9155 15.9155 0 0 1 0 31.831
a 15.9155 15.9155 0 0 1 0 -31.831" />
<!-- Percentage Text -->
<text x="18" y="20.35" font-size="7" text-anchor="middle" fill="#005EA2">80%</text>
</svg>
<caption>this is a placeholder image for now</caption>
<p class="font-body-lg text-light">Benchmark: <span class="text-bold">80%</span> of texts are successfully delivered</p>
<p>
You may discover that some numbers are temporarily or permanently unavailable due to service being discontinued,
numbers changing, or being a landline.
</p>
<h3>Engagement</h3>
<p class="text-bold">Benchmark: Engagement rates with texts ranged from 17% to 26%</p>
<svg width="200" height="200" viewBox="0 0 36 36">
<!-- Background circle -->
<path stroke="#e0e0e0" stroke-width="3.8" fill="none" d="M18 2.0845
a 15.9155 15.9155 0 0 1 0 31.831
a 15.9155 15.9155 0 0 1 0 -31.831" />
<!-- Progress circle -->
<path stroke="#005EA2" stroke-width="3.8" stroke-dasharray="80, 100" fill="none" d="M18 2.0845
a 15.9155 15.9155 0 0 1 0 31.831
a 15.9155 15.9155 0 0 1 0 -31.831" />
<!-- Percentage Text -->
<text x="18" y="20.35" font-size="7" text-anchor="middle" fill="#005EA2">80%</text>
</svg>
<caption>this is a placeholder image for now</caption>
<p class="font-body-lg text-light">Benchmark: Engagement rates with texts ranged from <span class="text-bold">17%</span>
to <span class="text-bold">26%</span></p>
<p>
The highest rate of engagement with a text comes within hours of sending. Engagement rates include any kind of
action
taken due to a text, including replying “STOP” to prevent future texts.
action taken due to a text, including replying “STOP” to prevent future texts.
</p>
<h3>Appointment requests</h3>
<p class="text-bold">Benchmark: Requesting appointments after receiving texts ranged from 4% to 9%</p>
<svg width="200" height="200" viewBox="0 0 36 36">
<!-- Background circle -->
<path stroke="#e0e0e0" stroke-width="3.8" fill="none" d="M18 2.0845
a 15.9155 15.9155 0 0 1 0 31.831
a 15.9155 15.9155 0 0 1 0 -31.831" />
<!-- Progress circle -->
<path stroke="#005EA2" stroke-width="3.8" stroke-dasharray="80, 100" fill="none" d="M18 2.0845
a 15.9155 15.9155 0 0 1 0 31.831
a 15.9155 15.9155 0 0 1 0 -31.831" />
<!-- Percentage Text -->
<text x="18" y="20.35" font-size="7" text-anchor="middle" fill="#005EA2">80%</text>
</svg>
<caption>this is a placeholder image for now</caption>
<p class="font-body-lg text-light">Benchmark: Requesting appointments after receiving texts ranged from <span
class="text-bold">4%</span> to <span class="text-bold">9%</span></p>
<p>
Requesting appointments is a specific type of engagement. Provide a phone number or link to an online appointment
request form.
@@ -99,83 +50,24 @@
document submission, and maintenance reminders.
</p>
<h3>Appointment reminders</h3>
<p class="text-bold">Benchmark: Clients were 79% more likely to keep their appointment after receiving a text
reminder.</p>
<svg width="200" height="200" viewBox="0 0 36 36">
<!-- Background circle -->
<path stroke="#e0e0e0" stroke-width="3.8" fill="none" d="M18 2.0845
a 15.9155 15.9155 0 0 1 0 31.831
a 15.9155 15.9155 0 0 1 0 -31.831" />
<!-- Progress circle -->
<path stroke="#005EA2" stroke-width="3.8" stroke-dasharray="80, 100" fill="none" d="M18 2.0845
a 15.9155 15.9155 0 0 1 0 31.831
a 15.9155 15.9155 0 0 1 0 -31.831" />
<!-- Percentage Text -->
<text x="18" y="20.35" font-size="7" text-anchor="middle" fill="#005EA2">80%</text>
</svg>
<caption>this is a placeholder image for now</caption>
<p class="font-body-lg text-light">Benchmark: Clients were <span class="text-bold">79%</span> more likely to keep their
appointment after receiving a text reminder.</p>
<p>You will likely see more completed appointments.</p>
<p class="text-bold">Benchmark: Clients were 55% more likely to complete an interview after receiving an interview
reminder</p>
<svg width="200" height="200" viewBox="0 0 36 36">
<!-- Background circle -->
<path stroke="#e0e0e0" stroke-width="3.8" fill="none" d="M18 2.0845
a 15.9155 15.9155 0 0 1 0 31.831
a 15.9155 15.9155 0 0 1 0 -31.831" />
<!-- Progress circle -->
<path stroke="#005EA2" stroke-width="3.8" stroke-dasharray="80, 100" fill="none" d="M18 2.0845
a 15.9155 15.9155 0 0 1 0 31.831
a 15.9155 15.9155 0 0 1 0 -31.831" />
<!-- Percentage Text -->
<text x="18" y="20.35" font-size="7" text-anchor="middle" fill="#005EA2">80%</text>
</svg>
<caption>this is a placeholder image for now</caption>
<p class="font-body-lg text-light">Benchmark: Clients were <span class="text-bold">55%</span> more likely to complete an
interview after receiving an interview reminder</p>
<p>You will likely see more completed interviews.</p>
<h3>Document submission</h3>
<p class="text-bold">
Benchmark: Clients were 6% more likely to complete document submission after receiving a customized list of required
documents via text
<p class="font-body-lg text-light">
Benchmark: Clients were <span class="text-bold">6%</span> more likely to complete document submission after receiving
a customized list of required documents via text
</p>
<svg width="200" height="200" viewBox="0 0 36 36">
<!-- Background circle -->
<path stroke="#e0e0e0" stroke-width="3.8" fill="none" d="M18 2.0845
a 15.9155 15.9155 0 0 1 0 31.831
a 15.9155 15.9155 0 0 1 0 -31.831" />
<!-- Progress circle -->
<path stroke="#005EA2" stroke-width="3.8" stroke-dasharray="80, 100" fill="none" d="M18 2.0845
a 15.9155 15.9155 0 0 1 0 31.831
a 15.9155 15.9155 0 0 1 0 -31.831" />
<!-- Percentage Text -->
<text x="18" y="20.35" font-size="7" text-anchor="middle" fill="#005EA2">80%</text>
</svg>
<caption>this is a placeholder image for now</caption>
<p>To encourage response, provide a custom list of the needed documents and information about how to submit them. </p>
<h3>Reminders</h3>
<p class="text-bold">Benchmark: Text reminders improved case maintenance rates by 21%</p>
<svg width="200" height="200" viewBox="0 0 36 36">
<!-- Background circle -->
<path stroke="#e0e0e0" stroke-width="3.8" fill="none" d="M18 2.0845
a 15.9155 15.9155 0 0 1 0 31.831
a 15.9155 15.9155 0 0 1 0 -31.831" />
<!-- Progress circle -->
<path stroke="#005EA2" stroke-width="3.8" stroke-dasharray="80, 100" fill="none" d="M18 2.0845
a 15.9155 15.9155 0 0 1 0 31.831
a 15.9155 15.9155 0 0 1 0 -31.831" />
<!-- Percentage Text -->
<text x="18" y="20.35" font-size="7" text-anchor="middle" fill="#005EA2">80%</text>
</svg>
<caption>this is a placeholder image for now</caption>
<p class="font-body-lg text-light">Benchmark: Text reminders improved case maintenance rates by <span
class="text-bold">21%</span></p>
<p>You may see less turnover in your case rates.</p>
</section>
{% endblock %}

View File

@@ -52,13 +52,13 @@
</div>
</li>
<li class="usa-card flex-1 usa-card--media-right width-full">
<div class="usa-card__container border-0 width-full">
<div class="usa-card__container border-0 width-full overflow-hidden height-phone-lg">
<img class="width-full" src="{{ asset_url('images/phone_grey.svg') }}" role="img" alt="Phone" />
<div class="position-absolute flex text-cener padding-5 padding-top-8">
<div class="position-absolute flex text-cener padding-5 padding-top-9">
<p class="text-center">Write an introductory text before you start sending messages:</p>
<p class="text-center">Department of Social Services: Welcome to text updates from the {{ circle_number(1) }}
<b>State Department of Social Services.</b>{{ circle_number(2) }}<b>Well always text you from this
number,</b> save us to your contact list. Our goal is to {{ circle_number(3) }} <b>keep you up to date on
<p class="sms-message-wrapper text-center">Department of Social Services: Welcome to text updates from the
{{circle_number(1)}}<b>State Department of Social Services.</b> {{ circle_number(2) }}<b>Well always text you from
this number,</b> save us to your contact list. Our goal is to {{ circle_number(3) }} <b>keep you up to date on
your account status.</b> {{ circle_number(4) }} <b>We will never ask for personal details in a text.</b>
{{ circle_number(5) }} If you have questions about how we protect your privacy, see
state.gov/privacy. <br />{{circle_number(6) }}<b>Reply STOP to stop.</b>
@@ -93,8 +93,8 @@
<li class="usa-card flex-1 usa-card--media-right width-full">
<div class="usa-card__container border-0 width-full height-mobile overflow-hidden">
<img class="width-full" src="{{ asset_url('images/phone_grey.svg') }}" role="img" alt="Phone" />
<div class="position-absolute flex text-cener padding-5 padding-top-8">
<p class="text-center">
<div class="position-absolute flex text-cener padding-5 padding-top-9">
<p class="sms-message-wrapper text-center">
{{circle_number(7) }}<b>Dept of Social Services:</b> Hi {{circle_number(8) }}<b>Julie,</b> Your Medicaid
renewal is closing December 31, 2023. You can renew online at {{circle_number(9) }}<a
href="https://www.application.yourstate.gov" target="_blank"
@@ -103,7 +103,8 @@
</p>
</div>
</div>
<p class="text-center font-sans-xs">For example, weve seen Medicaid programs use trust-markers in renewal texts</p>
<p class="text-center font-sans-xs text-italic">For example, weve seen Medicaid programs use trust-markers in renewal
texts</p>
</li>
</ul>
@@ -120,9 +121,9 @@
<li class="usa-card flex-1 usa-card--media-right width-full">
<div class="usa-card__container border-0 width-full overflow-hidden guidance">
<img class="width-full" src="{{ asset_url('images/phone_grey.svg') }}" role="img" alt="Phone" />
<div class="position-absolute flex text-cener padding-5 padding-top-8">
<div class="position-absolute flex text-cener padding-5 padding-top-9">
<p class="text-center">Dont forget about using auto-response text</p>
<p class="text-center">
<p class="sms-message-wrapper text-center">
Dept of Social Services: This number is unmonitored. To {{circle_number(11) }} <b>contact us, call
888-123-4567</b>. We will never ask for personal details in a text. If you have questions about how to
protect your privacy, see state.gov/privacy {{circle_number(12) }} <b>Reply “STOP”</b> to this phone number

View File

@@ -30,7 +30,7 @@
},
{
"p_text": 'The <a class="use-link usa-link--external"
href="https://www.federalregister.gov/documents/2021/02/12/2020-29016/government-and-government-contractor-calls-under-the-telephone-consumer-protection-act-of-1991"
href="https://www.fcc.gov/document/fcc-provides-guidance-enable-critical-health-care-coverage-calls"
target="_blank">FCC has ruled</a> that <b>Federal</b> and <b>State</b> programs are exempt from the TCPA and can send
text messages to the public without consent if conducting official business. Without explicit mention in the ruling,
local governments, phone carriers, or any texting intermediaries might require it.'

View File

@@ -40,7 +40,7 @@
</ol>
<p>For example, getting a person to update their mailing address:</p>
<ul class="usa-card-group flex-1 flex-wrap padding-top-2">
<ul class="usa-card-group flex-1 flex-wrap padding-top-2 guidance-flex-container">
<li class="flex-1 width-full height-full padding-bottom-2">
<div class="usa-card__container border-0">
<ol class="guidance-list">
@@ -60,9 +60,14 @@
<li class="usa-card flex-1 usa-card--media-right width-full">
<div class="usa-card__container border-0 width-full">
<img class="width-full" src="{{ asset_url('images/phone_grey.svg') }}" role="img" alt="Phone" />
<div class="position-absolute flex text-cener padding-5 padding-top-8">
<div class="position-absolute flex text-cener padding-5 padding-top-9">
<p class="text-center">Write an introductory text before you start sending messages:</p>
<p class="text-center">{{circle_number(1) }}State Medicare Agency: Hello, MEDICARE has attempted to send you an update about your claim, but the mail was returned. {{circle_number(2) }}Please go to https://www.medicare.gov/account/login?utm_source=TEXT, {{circle_number(3) }}log in to your account, and click “My Account Information” to verify that your address is correct. If you are having difficulty logging in, {{circle_number(4) }}call 1-800-MEDICARE for assistance. {{circle_number(5) }}We will attempt to send the mail again in 14 days.{{circle_number(6) }}
<p class="sms-message-wrapper text-center">{{circle_number(1) }}State Medicare Agency: Hello, MEDICARE has attempted to
send you an update about your claim, but the mail was returned. {{circle_number(2) }}Please go to
https://www.medicare.gov/account/login?utm_source=TEXT, {{circle_number(3) }}log in to your account, and click “My
Account Information” to verify that your address is correct. If you are having difficulty logging in,
{{circle_number(4) }}call 1-800-MEDICARE for assistance. {{circle_number(5) }}We will attempt to send the mail again
in 14 days.{{circle_number(6) }}
</p>
</div>
</div>