Page tree

Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.


Info

This is a widget that can be used on every page for navigation. Rather than using the Atlassian User Interface (AUI) nav component, I instead used buttons, so "blue hyperlinked" items refer to those that can be selected and this example with "Overview" without blue text refers to the selected state. Note the right-aligned nav idea to allow people to choose methods on the fly.

HTML

<nav class="aui-navgroup aui-navgroup-horizontal" style="position: absolute;">
<div class="aui-navgroup-inner">
<div class="aui-navgroup-primary">
<div class="aui-nav-heading"></div>    		

 	<button class="aui-button aui-button-light">
	Overview><span class="aui-icon aui-icon-small aui-iconfont-home-filled"></span>
		Home 
	</button>	 

	     <button class="aui-button aui-button-link aui-dropdown2-trigger" aria-controls="servicesabout-dropdown">How We Can Help  >
		About HCD
	</button>
	<aui-dropdown-menu id="servicesabout-dropdown" aria-controls="servicesabout">
		<aui-section id="servicesabout">
        	<aui-item-link href="#">Coaching</aui-item-link>
			<aui-item-link href="#">Community<https://qnetconfluence.cms.gov/display/HCD/What+Is+HCD">What is HCD?</aui-item-link>
  			<aui-item-link href="#">Standards</aui-item-link>
			<aui-item-link href="#">Training<https://qnetconfluence.cms.gov/display/HCD/HCD+Phases">HCD Phases</aui-item-link>
		</aui-section> 
		</aui-dropdown-menu>  

	<button class="aui-button aui-button-link aui-dropdown2-trigger" aria-controls="resultsservices-dropdown">Customer>
How ResultsWe Can Help
	</button>
	<aui-dropdown-menu id="resultsservices-dropdown" aria-controls="results">
		<aui-section id="resultsservices">
        			<aui-item-link href="#">Case Studies<https://qnetconfluence.cms.gov/display/HCD/How+We+Can+Help">What's In it For Me?</aui-item-link>
  			<aui-item-link hreffor="#">Data-driven Results<consulting-dropdown">Consulting & Support</aui-item-link>
		</aui-section>
		</aui-dropdown-menu>

	<button class="aui-button aui-button-link aui-dropdown2-trigger" aria-controls="insights-dropdown">Insights  
	</button>
 			<aui-dropdownitem-menulink idfor="insightseducation-dropdown" aria-controls="insights">
		<aui-section id="insights">
        	<aui-item-link href="#">Blog<>Education & Outreach</aui-item-link>
 			<aui-item-link hreffor="#">Methods<guidance-dropdown">Guidance & Best Practices</aui-item-link>
  			<aui-item-link hreffor="#">Videos<resources-dropdown">HCD Learning Library</aui-item-link>
		</aui-section>
		</aui-dropdown-menu>
		
		<button class="aui-button aui-button-link">
		<a href="#">Contact Us</a>
	</button>		
</div>

<div class="aui-navgroup-secondary">
<div class="aui-nav-heading"></div>
<button class="aui-button aui-dropdown2-trigger" aria-controls="methods-dropdown"><span class="aui-icon aui-icon-small aui-iconfont-configure"></span>
  Methods & Tools  
</button>

<aui-dropdown-menu id="methodsconsulting-dropdown" aria-controls="right-aligned">
		<aui-section id="right-aligned">section> 
        			<aui-item-link href="https://qnetconfluence.cms.gov/display/HCD/Affinity+Diagram">Affinity Diagram<Coaching">Coaching</aui-item-link>
         
			<aui-item-link href="https://qnetconfluence.cms.gov/display/HCD/Card+Sorting">Card Sort<Support">Research & Design</aui-item-link>
		</aui-section>
	</aui-dropdown-menu>

  	<aui-dropdown-menu      id="education-dropdown">
		<aui-section> 
			<aui-item-link href="https://qnetconfluence.cms.gov/display/HCD/Change+Management">Change Management<Community">Community of Practice</aui-item-link>
        			<aui-item-link href="https://qnetconfluence.cms.gov/display/HCD/Collaborative+Sketching">Collaborative Sketching<Training">Training</aui-item-link>
		</aui-section>
	</aui-dropdown-menu>

        	<aui-itemdropdown-linkmenu href="https://qnetconfluence.cms.gov/display/HCD/Content+Audit">Content Audit</aui-item-link>
        id="guidance-dropdown">
		<aui-section>
			<aui-item-link href="https://qnetconfluence.cms.gov/display/HCD/ContentCMS+Design+InventorySystem">Content>CMS Design Inventory<System</aui-item-link>
         
			<aui-item-link href="https://qnetconfluence.cms.gov/display/HCD/ContextualHCD+Maturity+InquiryModel">Contextual>HCD Maturity Inquiry<Model</aui-item-link>
        			<aui-item-link href="https://qnetconfluence.cms.gov/display/HCD/ConversationMeasuring+Customer+GuideSatisfaction">Conversation>Measuring Customer Guide<Satisfaction</aui-item-link>
        	 		<aui-item-link href="https://qnetconfluence.cms.gov/display/HCD/DesignPaperwork+aReduction+SuperheroAct">Design>Paperwork aReduction Superhero<Act</aui-item-link> 
		</aui-section>
	</aui-dropdown-menu>      

    	<aui-dropdown-menu id="resources-dropdown">
		<aui-section>
			<aui-item-link href="https://qnetconfluence.cms.gov/display/HCD/Developing+a+UX+Measurement+Plan">Develop a UX Measurement Plan<Recommended+Reading">Books, Articles & Podcasts</aui-item-link>
        			<aui-item-link href="https://qnetconfluence.cms.gov/display/HCD/DiaryEnterprise+StudiesPersonas">Diary>Enterprise Study<Personas</aui-item-link> 
        			<aui-item-link href="https://qnetconfluence.cms.gov/display/HCD/Empathy+MapsMethods">Empathy>HCD Map<Methods</aui-item-link>
        			<aui-item-link href="https://qnetconfluence.cms.gov/display/HCD/Feedback+Loop">Feedback Loop<Videos">Videos</aui-item-link>
		</aui-section>
	</aui-dropdown-menu>

	<button class="aui-button       <aui-item-link href="https://qnetconfluence.cms.gov/display/HCD/How+Might+We">How Might We?</aui-item-link>
        aui-button-link aui-dropdown2-trigger" aria-controls="studies-dropdown">
		Case Studies
	</button>
	<aui-dropdown-menu id="studies-dropdown" aria-controls="studies">
		<aui-section id="studies">
			<aui-item-link href="https://qnetconfluence.cms.gov/display/HCD/Interviews">Interview<ESRD+Ecosystem">ESRD Ecosystem</aui-item-link>
        			<aui-item-link href="https://qnetconfluence.cms.gov/display/HCD/JourneyHCD+Maturity+MappingModel">Journey>HCD Maturity Map<Model</aui-item-link>
        			<aui-item-link href="https://qnetconfluence.cms.gov/display/HCD/KanoHQR+Service+AnalysisDesign">Kano>HQR Service Analysis<Design</aui-item-link>
         
			<aui-item-link href="https://qnetconfluence.cms.gov/display/HCD/Mash-up">Mash-up<HQR+Customer+Satisfaction+Survey">HQR Customer Satisfaction</aui-item-link>
        			<aui-item-link href="https://qnetconfluence.cms.gov/display/HCD/Mind-Mapping">Mind Map<Program+Resource+System">Program Resource System</aui-item-link>
        			<aui-item-link href="https://qnetconfluence.cms.gov/display/HCD/Personas">Persona<QPP+Customer+Satisfaction+Survey">QPP Customer Satisfaction</aui-item-link>
        			<aui-item-link href="https://qnetconfluence.cms.gov/display/HCD/Problem+Statement">Problem Statement<SOG+Travel+Robotic+Processing+Automation">SOG Robotic Processing Automation</aui-item-link>
		</aui-section> 
	</aui-dropdown-menu>     
 <button   <aui-item-link class="aui-button aui-button-link"> <a href="https://qnetconfluence.cms.gov/display/HCD/ProductOur+Prototype">Product Prototype</aui-item-link>
        <aui-item-link Services">Services</a>
</button>   
   <button class="aui-button aui-button-link"> <a href="https://qnetconfluence.cms.gov/display/HCD/ProjectHCD+Design+Brief">Project Brief</aui-item-link>
        <aui-item-linkBlog">Blog</a>  
</button>      
<button class="aui-button aui-button-link"> <a href="https://qnetconfluence.cms.gov/display/HCD/QualityContact+MetricsUs">Quality>Our Metrics</aui-item-link>
    Team</a></button>
</div>   

<span style="margin-left: 20px;">    <aui-item-link href="https://qnetconfluence.cms.gov/display/HCD/Responsive+Breakpoint+Diagram">Responsive Breakpoint Diagram</aui-item-link>
        <aui-item-link href="https://qnetconfluence.cms.gov/display/HCD/Service+Prototype">Service Prototype</aui-item-link>
        <aui-item-link href="https://qnetconfluence.cms.gov/display/HCD/Sitemap+Diagram">Sitemap Diagram</aui-item-link>
        <aui-item-link href
	<a id="myCustomTrigger" title="Open pop up form to send support request"><button class="aui-button aui-button-hcd">Request Support ↗</button></a>
</span>
</div>
</div>
</nav>


<!-- This code is generated by creating a Jira issue collector. See https://confluence.atlassian.com/adminjiracloud/using-the-issue-collector-776636529.html -->

<script type="text/javascript" src="https://qnetconfluenceqnetjira.cms.gov/display/HCD/Stakeholder+Mapping">Stakeholder Map</aui-item-link>
        <aui-item-link href/s/d41d8cd98f00b204e9800998ecf8427e-CDN/-x7af9p/805003/be09033ea7858348cd8d5cdeb793189a/2.2.4.7/_/download/batch/com.atlassian.plugins.jquery:jquery/com.atlassian.plugins.jquery:jquery.js?collectorId=9b8f30b2"></script><script type="text/javascript" src="https://qnetconfluenceqnetjira.cms.gov/display/HCD/Storyboarding">Storyboard</aui-item-link>
        <aui-item-link href="https://qnetconfluence.cms.gov/display/HCD/Tree+Testing">Tree Test</aui-item-link>
        <aui-item-link href="https://qnetconfluence.cms.gov/display/HCD/Usability+Testing">Usability Test</aui-item-link>
        <aui-item-link href="https://qnetconfluence.cms.gov/display/HCD/User+Research+Plan">User Research Plan</aui-item-link>
	</aui-section>
</aui-dropdown-menu>
</div>
</div>








/s/1b790b95b2447c56c496350719f839e3-T/-x7af9p/805003/be09033ea7858348cd8d5cdeb793189a/3.1.0/_/download/batch/com.atlassian.jira.collector.plugin.jira-issue-collector-plugin:issuecollector/com.atlassian.jira.collector.plugin.jira-issue-collector-plugin:issuecollector.js?locale=en-US&collectorId=9b8f30b2"></script>

    <script type="text/javascript">window.ATL_JQ_PAGE_PROPS =  {

	// ==== custom trigger function ====
	"triggerFunction": function(showCollectorDialog) {
		//Requires that jQuery is available! 
		jQuery("#myCustomTrigger").click(function(e) {
			e.preventDefault();
			showCollectorDialog();
		});
	},	
	// ==== Add the code below to set the field values. Find the values by viewing Create Issue source code ====
	fieldValues: {
		
 		'components' : ['15601']
	}		
};
</script>