Acc Navigator

  • location: homepage
  • technical requirements:

    • Interactive widget that can be placed with in a page of acc.org; its intended location is the homepage.
    • The widget will have multiple states without changing or reloading the page unless the users do a final action to link off to a result.
    • The widget will affect the URL of the page by updating the query string of the page this would be needed google analytics needs.
    • The widget should be able to respond to query strings to make it auto generate a deep linked state.
    • The data and results that power this widget should be implemented within SiteCore to allow editorial to add new term-result-pairs.
  • user experience summary: The widget will allow users to interact with simple MadLib questions to answer to allow users to discover and navigate to pages and content throughout the web domain of ACC.org.

! UX to determine the need for the Sentence Bridge and do we need to change how we represent it throughout the Widget. !


States of the Widget


Data Setup

SiteCore the (System) will store meta called (MadLib-combinations) that will be needed to run the ACC Navigator (Widget). The MadLib-combinations will comprise of first response, and second response.

First Question Answer

The Widget shows the question of “I want to” with an input-line-response and a collection of response buttons populated with by the available first responses from the MadLib-combinations. The first responses list order will be randomized. The rendered response buttons are limited to a max count and if the first responses list count are more than the max count, the system will render a shuffle button.

When the user hits the shuffle button, the current list of response buttons will transition out and the next set of response buttons will be displayed. If the shuffle mechanism reaches the end of the response list then the system will loop to the beginning of the list.

If the user types into the response line then trigger the Power User Feature

When the user clicks a response button, the response line will be replaced with the selected response button. The system will progress to the next state either a Follow-up Question State or a Result State depending if the MadLib-combination has associated second responses or can match to a result.

Follow-up Question Answer

The Follow-up UI is decorated differently than the First Question Answer to denote a change to the user.

The Follow-up requires the system to revaluate the MadLib-combinations to produce the Second Response List. If the response list is singular it will auto fill the only result and proceed to the Result State. If the result list is greater than one, then the system will render the follow up question line, and the response buttons with the shuffle button if needed. The system will also render a Restart Question button bellow the response and shuffle buttons.

The shuffle button works the same as it does with the previous state just within the Second Response List.

If the user types into the response line, then trigger the Power User Feature.

If the user clicks the Restart Question button the Widget will return to a Empty or Onload State and will ignore any URL queries that might exist as it resets.

Result State

When the Widget has only results and or no extra follow-up responses the system will show the Result State view. The view is a list of pages or items from the filtered MadLib-combinations.

Each result will render the Page Title, and a how to navigate to this page breadcrumb to the item from the Widget’s location. The results will link directly to page or item.

I want to
that are

You can find Credits that are ondemand here:


Pseudo State or Features

Empty Query Onload State

The Widget, when onload and there are no query strings to the URL, the widget will default to the First Question Answer.


Not Empty Query Onload State

The Widget, when onload and there are query strings to the URL, the widget will render the appropriate state depending on the first and second responses provided. url?first-response=abc


Power User Feature

The user should be able to type into the response line.  This will replace the basic response buttons and shuffle button with a grid of buttons based on a reductive filter of the users typed text against the current response-list.  For example typed text of credit will return all buttons with credit in their label.  A clear text button appears in the top right of the button grid and an X button at the end of the text input.   Clicking either will return the user to the basic mode of the current state of the Widget and clear out any text in the response line.  Clicking any of the response buttons will  replace the response line at the top with the selected response button and will progress the Widget to the next state.


Admin & Analytics

Admins How to Populate a MadLib-combinations

This is still being discussed but the current concept is to extend the meta data on pages to allow for adding MadLib-combinations to page. MadLib-combinations would be a combination of first response, sentence bridge, and second response. Sentence Bridge, and Second Response is Optional.

The admins should be able to create, repeat, update and delete the MadLib-combinations on a page or content.

Not included in this UI but the breadcrumb path should be included once, when adding a document or page in ACC Navigator.

! This UI is for demo purposes only !

ACC Navigator Meta Data (MadLib-combinations)

First Response Sentence Bridge Second Response
Credit that are On Demand remove
Learn about Afib remove
AFIBSap     remove
Add Meta Data To Page
Add Another required

Analytics

This system should either through google or a log system track how a the user completes a result or where it is abandoned. Abandoned is defined when the user resets the Widget.

Sample Data

Date Time Stamp, Success or Reset , First Word, Second Word, Result Clicked On



Full Pattern

I want to
Something
Button
Button
Button
Shuffle

Text search for "Credit"

Earn Credits
See My Credits
Print My Credits
Find Credits
Review Credits
Clear Text

You can find Credits that are ondemand here: