Responsive Design Pilot Apps USA gov Apps Gobierno

Responsive Design Pilot Apps. USA. gov & Apps. Gobierno. USA. gov Office of Citizen Services and Innovative Technologies 9/17/2020 1

Agenda • • • Apps Galleries History Pilot Program Pros and Cons to Responsive Design Lessons Learned Future Plans Apps Galleries Before & After Office of Citizen Services and Innovative Technologies 9/17/2020 2

USA. gov & Gobierno. USA. gov Apps Galleries • Created to provide the public with government-related mobile solutions, allow simpler access to services and information, and provide new ways for citizen engagement. • Part of our overall mobile strategy • Apps in galleries are free and must use government data or provide a government service. Office of Citizen Services and Innovative Technologies 9/17/2020 3

USA. gov Apps Gallery • Launched in July 2010 with 20 apps • Now have over 115 apps: 73 i. Phone, 35 Android, 14 i. Pad, 4 Blackberry, 46 mobile sites) • Over 1. 37 million visits Office of Citizen Services and Innovative Technologies 9/17/2020 4

Gobierno. USA. gov Apps Gallery • Launched in April 2011 • 11 apps (2 i. Phone, 1 Android, 9 mobile sites) • Over 66 k visits Office of Citizen Services and Innovative Technologies 9/17/2020 5

Pilot Program Research • Met with key stakeholders in developing strategy • Identified audience and content • Studied responsive design on various public and state government sites and discussed pros and cons • Talked with one of the developers of RI. gov, which is built in responsive design and is similar to USA. gov in terms of content and topics. • Next, our contractor built a prototype and we tweaked it from there so that design and accessibility guidelines were met. Office of Citizen Services and Innovative Technologies 9/17/2020 6

Redesign of Apps Galleries, April 2012 • Launched April 13, 2012 • Used Apps Gallery as a pilot in responsive design, which allows the site to respond to you and your device and display accordingly • New design meets devices of today and in the future • Added a rotating panel of 5 featured apps at the top (USA. gov only) Office of Citizen Services and Innovative Technologies 9/17/2020 7

Redesign of Apps Galleries (cont’d) • Based on user comments and emails, we’ve added the ability to sort by newest app and category (USA. gov only) • Added device detection, so if on an Android, only Android apps and mobile sites will display • Added multiple screen shot images • Added ratings that are pulled in from Android’s Google Play and Apple’s App Stores • Foundation of the apps galleries was built on a REST API, other agencies can leverage it and use as needed Office of Citizen Services and Innovative Technologies 9/17/2020 8

Design Team • A team of both government employees and contractors worked on the design, including developers, accessibility specialists, graphic designers, content managers and usability specialists • Majority of the design was done by Mobomo (www. mobomo. com) • Used 320 and Up and HTML 5 Boilerplate Office of Citizen Services and Innovative Technologies 9/17/2020 9

Pros to Responsive Design • Responsive/Fluid design allows the site to respond to you and your device and display accordingly • Meets devices of today and in the future • Single version • Less maintenance • Sharing links works across all platforms and devices • Future-ready • Not just about device (narrow desktop use) • Mobile first content strategy Office of Citizen Services and Innovative Technologies 9/17/2020 10

Cons to Responsive Design • • Development time and resources Cross browser and device compatibility Loading times Different devices/ different objectives Not device specific 508 compliance Content is not necessarily mobile friendly Doesn’t work on older devices (still need a plain webpage) Office of Citizen Services and Innovative Technologies 9/17/2020 11

Cost Savings • Moving the apps galleries into our existing CMS saves time and money and helps us manage all of our products in one central place. • Since we used responsive design, we have designed for current devices and any future devices. • Lastly, since the foundation of the apps galleries was built on a REST API, other agencies can leverage it and use as needed. Using the API as the foundation, it’s a "build once, use many times" approach to offering government-wide services that save the government millions. Office of Citizen Services and Innovative Technologies 9/17/2020 12

Lessons Learned • Involve design earlier in the process • Create design and accessibility guidelines so they can be used during the development process • Mock deliverables of end cases should be used to ensure that the layout works for all case • Started with design, perhaps should have worked on tech framework first • Need to incorporate other factors such as load testing (JSON being cached) – Unique URL Office of Citizen Services and Innovative Technologies 9/17/2020 13

Lessons Learned (cont’d) • Pause and have monthly reviews of progress and decisions • Should have more rigorous technical decision points (once a month) • Should have a solid schedule for review • In responsive design, should take the time to identify common elements for each resolution • Agile makes it hard to predict the timeline Office of Citizen Services and Innovative Technologies 9/17/2020 14

Future Plans • User comments & feedback • Mobile survey and metrics • Adding a mobile app /mobile site submission form on How. To. gov • Focusing on m. USA. gov and m. Gobierno. USA. gov mobile sites to see if responsive design would work, which could then lead to potentially redesigning USA. gov and Gobierno. USA. gov in responsive design Office of Citizen Services and Innovative Technologies 9/17/2020 15

Apps. USA. gov BEFORE Office of Citizen Services and Innovative Technologies 9/17/2020 16

Apps. USA. gov AFTER Office of Citizen Services and Innovative Technologies 9/17/2020 17

Apps. Gobierno. USA. gov BEFORE Office of Citizen Services and Innovative Technologies 9/17/2020 18

Apps. Gobierno. USA. gov AFTER Office of Citizen Services and Innovative Technologies 9/17/2020 19

Contacts apps. USA. gov Meghan Daly Email: meghan. daly@gsa. gov apps. Gobierno. USA. gov Laura Godfrey Email: laura. godfrey@gsa. gov Office of Citizen Services and Innovative Technologies 9/17/2020 20