NYL AARP Site Analysis Prepared by Perficient – Mike Gorgone Landing Page The landing page is the first page a User will come to on the site. The page is located at the following url. https://www.nylaarp.com/landing-pages/termquoteapply#/Step1 Depending on what is decided to be the most important content will determine what will be hidden and shown at the mobile breakpoint. This means some HTML may have to be duplicated in order for it to stack correctly at the mobile breakpoint while keeping the desktop looking like it currently does. The page content is going to have to be re-coded to work within the responsive framework (note I’m not mentioning a specific framework because the NYL Express site may not have ended up using one. See Mark Moser and or Brandon Bruno for how the mobile view was implemented for NYL Express). Sections Header Functions Global Navigation links that allow the User to move around the site. One thing I’ve noticed is that these links don’t stay on the nylaarp.com site they go to two other AARP related sites. AARP Member Benefits o This link takes you to http://www.aarp.org/benefits- discounts/?cmp=ASI_P_MU_RN_NYL Join AARP o This link takes you to https://appsec.aarp.org/MSS/join/application?keycode=FALUNYHT& cmp=ASI_P_MU_JN_ Renew AARP o This link takes you to https://appsec.aarp.org/MSS/renew/findMe?keycode=FALUNYHT&c mp=ASI_P_MU_RN_N
Transcript
NYL AARP Site Analysis Prepared by
Perficient – Mike Gorgone
Landing Page The landing page is the first page a User will come to on the site. The page is located at the following url. https://www.nylaarp.com/landing-pages/termquoteapply#/Step1 Depending on what is decided to be the most important content will determine what will be hidden and shown at the mobile breakpoint. This means some HTML may have to be duplicated in order for it to stack correctly at the mobile breakpoint while keeping the desktop looking like it currently does. The page content is going to have to be re-coded to work within the responsive framework (note I’m not mentioning a specific framework because the NYL Express site may not have ended up using one. See Mark Moser and or Brandon Bruno for how the mobile view was implemented for NYL Express).
Sections
Header
Functions Global Navigation links that allow the User to move around the site. One thing I’ve noticed is that these links don’t stay on the nylaarp.com site they go to two other AARP related sites.
AARP Member Benefits o This link takes you to http://www.aarp.org/benefits-
discounts/?cmp=ASI_P_MU_RN_NYL Join AARP
o This link takes you to https://appsec.aarp.org/MSS/join/application?keycode=FALUNYHT&cmp=ASI_P_MU_JN_
The icons in the header are just icons and don’t link to any other websites. Do we want the icons to become links as well?
Mobile Recommendations The global navigation should be moved to below the icons (like it is on the NYL Express site). This will make it easier to transition it to the mobile menu icon (hamburger or “MENU” icon). The HTML global navigation markup can then be coded so that it can transform when it hits the mobile breakpoint.
Hero
Functions The Hero section doesn’t contain any functionality it is only informational
Mobile Recommendations For the hero we’ll need to adjust the font size of the main header and the sub-header and the text should just wrap when the mobile breakpoint is hit. The Image of the AARP member and his quote doesn’t serve any purpose at the mobile level so my recommendation is for it to be hidden at the mobile breakpoint
Additional Information
Functions There is no functionality to this section it is only informational
Mobile Recommendations The title may have to reduce its font-size and wrap at the mobile breakpoint. The informational text will also start to wrap.
Free Quote
Functions Form information for the User to fill out in order to get a quick AARP quote. The quote is generated after the User clicks the “Get Instant Quote an Apply” button. The only dynamic functionality (other than the submission and quote generation) I see as of right now is the change in the display when the Yes/No radio buttons are selected for the “I am an AARP member” field.
Mobile Recommendations This is the #1 call to action and the form should be displayed below the hero information (like was done for NYL Express). The form fields will stack on top of each other at the mobile breakpoint. This form will look similar to the mobile version of the free quote form for the NYL Express website.
Looking for Higher Coverage
Functions This section is informational only.
Mobile Recommendations For mobile this section should more than likely stack at the bottom just above the footer. Also for future we may want to make the phone number a clickable link. Ex. <a href="tel:+18008652927">1-800-865-7927</a>
Footer
Functions The only functionality in the footer is the link to the Privacy Policy. The rest of the content is informational.
Mobile Recommendations For the mobile breakpoint this section will condense and the text information will wrap.
Form Error Page The Form Error page is displayed when there is a problem generating the quote for the user. For example, if the user isn’t over 50. The page is located at the following url. https://www.nylaarp.com/landing-pages/termquoteapply/Invalid
Sections
Header See the Landing Page for the Header description
Informational Message
Functions The only functionality in the footer is the link to the Privacy Policy. The rest of the content is informational.
Mobile Recommendations For the mobile breakpoint this section will condense and the text information will wrap. Also for future we may want to make the phone number a clickable link. Ex. <a href="tel:+18008652927">1-800-865-7927</a>
Footer See the Landing Page for the Footer description
Quote Result Page The Quote Result page is where a User goes after they’ve submitted their information in the free quote form on the landing page. This page is located at the following url. https://www.nylaarp.com/landing-pages/termquoteapply/Result#/QuoteResult
Sections
Header See the Landing Page for the Header description
Hero See the Landing Page for the Header description
Additional Information See the Landing Page for the Header description
Functions This section has the result for the quote information entered on the landing page. And has 4 links.
1) See Rate Chart. This link scrolls the user down to the Monthly Premiums table
2) Edit Quote. This link takes the user back to the quote form so they can re-enter their information for a free quote
3) Apply Online Now. This button/link takes the user to a wizard that allows them to apply.
4) click here 1 & 2. These links takes the user to a wizard located at the following url: https://www.nylaarp.com/Life-Insurance/Get-A-Quote. This wizard is described in the “Get-A-Quote” section below
Mobile Recommendations The only recommendation is that the text wraps, as the mobile breakpoint is hit and possibly some Font-size adjustments. Also the Apply Online Now button should increase in size and center itself. This section will also stack below the Hero section at the mobile breakpoint.
Monthly Premiums Table
Functions The monthly premiums table is informational only. There are 2 links in the summary information below the table
1) click here 1 & 2. These links takes the user to a wizard located at the following url: https://www.nylaarp.com/Life-Insurance/Get-A-Quote. This wizard is described in the “Get-A-Quote” section below
Mobile Recommendations We’ll break this information down in manner similar to the tables on NYL Express.
Functions This section is informational only. There is one link in the Who is Eligible paragraph
1) click here. This link opens a modal information box that describes the benefits of AARP membership
Mobile Recommendations For mobile the only recommendations are for the right column of information to stack under the left column at the mobile breakpoint. The click here link in the Who is Eligible section may need to have a mobile counterpart that shows the information in a section that expands and collapses below the Who is Eligible section instead of opening a modal.
Underwriting Information
Functions This section is informational only.
Mobile Recommendations For mobile the only recommendation is for the width of the container to change at the mobile breakpoint and from there the text will just wrap.
Footer See the Landing Page for the Footer description
Grief Page I cannot find the url to this page as of yet. Screenshot TBD
Sections
Header See the Landing Page for the Header description
Footer See the Landing Page for the Footer description
Apply Online Page The apply online page is located at the following url: https://www.nylaarp.com/Life-Insurance/Level-Benefit-Term/ApplicationStep1/ApplicationStep2
Get-A-Quote Page The privacy policy page is located at the following url: This page has a different layout then the landing, free quote and grief pages. Are we going to be creating a mobile version of this page?
Sections TBD
Privacy Policy Page The privacy policy page is located at the following url: http://www.nylaarp.com/Life-Insurance/Life-Insurance-Internet-Privacy-Policy-FAQ This page has a different layout then the landing, free quote and grief pages. Are we going to be creating a mobile version of this page?
