computech concomitantly blog

Mobile User Experience of the National Broadband Map

Posted on: Friday, January 27th, 2012 by Ivan Djordjevic

By: Ivan Djordjevic

A few days ago, the National Telecommunications and Information Administration (NTIA) along with Federal Communication Commission (FCC) released the mobile, optimized version of the National Broadband Map website. Computech led the development and completed all phases, from design, information architecture and user experience, to data integration, geospatial and back-end development.

Early in the information architecture phase we all agreed to leverage the unique features of the mobile devices, such as geo location capabilities, touch screen, gesture input and interaction, as well as the lower connection speeds, transfer and data usage,  and different nature of the mobile user experience.  This meant that the effort would not only produce the mobile version of the website, but a completely new user experience.

Users on-the-go do not require all of the features of the desktop version of the website.  However, if they, would like to access all the pages found on the desktop version of the website, they are still able to do this through a link provided on every page.

In addition, mobile users typically do not spend the same amount of time reading long description pages.  The attention span of a mobile user is even smaller than that of a regular desktop user.

The ability to access desired information through the least number of interactions is essential.  More specifically, ease of navigation by utilizing touch and gesture device capabilities makes the whole experience pleasant and enjoyable.

Design and Information Architecture

In the spirit of transparency and open data, following the principles of information design, Computech designed the information architecture of the mobile site around the philosophy of distraction-free content delivery.  The main content of the site captures the primary focus of the user.  Our design hides every other feature on the page into sections via slides.

Consistency in branding and design assures user familiarity with the overall experience, as it follows already established information flow.  However. slight variations in the secondary element treatments allow a subtle distinction between the sites.

Our technical implementation includes the maximum usage of CSS-defined design styles, allowing the User Interface to include a low number of HTTP requests, leaving the connection for the data integration.

Focus on performance

Data power both the desktop and mobile versions of the site, streamed through the same APIs.  Backbone Framework of the website, written specifically to solve the unique nature of the collected broadband data, allowed us to reuse a fair amount of back-end and data integration modules.

All four levels of our caching mechanism proved essential in assuring high performance for both versions of the site.  Nature and frequency of the data collected, along with caching at the Database, Application Server and two levels at the Web server, make both sites up to 100 times faster than if we had developed them in the most conventional way.

Front-End and User Interface

The architecture of the MVC+ Framework, which we developed specifically for the National Broadband Map, gives us the control of every feature and every aspect of the site.  This holds true due to the fact that we power the site by a large number of small deployable unites or modules that we connect and interweave in many ways to achieve the desired effect.  Further, flexibility and vast number of combinations allows us to insert any new modules in any place and at any level.  This is the main driving power to a lean development process, one that was crucial in delivering the project in time and to the customer’s satisfaction.

With such a framework in place, expanding the front-end with additional modules to drive the mobile user experience took much less time than anticipated.  The decision to add an additional framework to back the front-end side of the website played an important role in delivering the product on time.

While we strongly considered limiting the utilization of the trendy responsive design techniques, given the limited focus of the device support (iOS and Android powered devices) we needed to target, and to assure lowest amount of front-end code that needs to download via mobile connections, we decided to separate the desktop and mobile version of the site.

Liquid layout leveled the slight differences in the viewport sizes of the screens.  It turned out to be a good decision as we have saved enough kilobytes to speed up the overall performance of the site.

JQuery Mobile was a clear choice as the web framework for development of the mobile site.   JQuery mobile performed with excellence in complementing the current framework, taking the lower level tasks of front-end development, leaving us to focus more on the integration of the modules.

JQuery Mobile also allowed us to add swipe gesture to the pages, which were required in order for the user to easily flow from one screen to another.  We left pages with text longer than the width/height with the usual up/down scroll, as this would be the most natural assumption of the mobile user.

Tablet

Computech built the desktop version of the site to nearly full compliance, and with slight upgrades to some of the UI elements, we were able to deliver the mobile version quickly.  Our initial strategy when building the desktop version included considerations that ensured tablet devices would have no major issues with most of the pages.  Map pages also worked well, even though they do not use the bundled technology, but a custom base map and desktop version of the mapping technology.

The Future is Mobile, powered by Computech.

Experience our latest mobile solution.
Visit nbm.gov on your iOS or Android powered devices.

MiCOFETEL Site Utilizes GIS and Cloud to Provide Interactive Portal for Mexican Telecommunications

Posted on: Tuesday, November 8th, 2011 by Computech

The MiCOFETEL website – launched October 17th – functions as a portal with the objective to support a dialogue between citizens, the government, and broadband providers.  Visitors use the site to find information about broadband speeds and prices for different providers so they can make informed decisions.  Users are also able to download a mobile application and run a broadband speed test to determine their actual speed.  Users are also able to enter a complaint about a service that they are receiving and they can also view information on other complaints by provider or region.

Computech helped build this website by providing data analytics, custom software development and visualizations in a slick interface that integrated with COFETEL’s existing website design.  The project needed to be completed within a few weeks, giving us a tight deadline and thereby making our approach both lean and agile.  Our methodology allowed us to create unique tools for the Mexican government such as interactive maps with a minimum architectural footprint (no GIS server required) or a modern and spatially enabled speed test that captures where these tests are being run, creating a GIS layer on the fly and saving many hours of post-processing typically necessary to publish results.

On the software architecture side, Computech used standard open source tools, enabling the team to iterate rapidly and flexibly and adapt to changing requirements and new and unexpected challenges.  The key to this architectural approach is our extensive experience with RESTful APIs, as exemplified by our previous work at fcc.gov/developer and the National Broadband Map.  Having the site built on top of APIs allowed us to completely decouple the front end from the back end, enabling parallel development and improving the separation of concerns and future maintainability of the project.

In addition, our approach proved to be critical in the final deployment of the system, as the web and map services are being hosted by Computech in the cloud.  We have developed a virtual infrastructure built on top of Amazon’s Elastic Compute Cloud (EC2), providing an end-to-end solution for our customers, lowering their total cost of ownership and minimizing risk.  Having all web services running in a cloud-hosted environment allowed us to monitor and allocate resources dynamically when the website launched.  We will be monitoring its traffic over the next few weeks and make needed adjustments as more people learn about the site and usage increases.  We are very excited about the evolution of this important resource for the Mexican citizens.

The Importance of Data in MiCOFETEL

Posted on: Tuesday, November 1st, 2011 by Paul Salasznyk

By: Paul Salasznyk, Ph.D

Last week, with support from Computech, the Comisión Federal de Telecomunicaciones (COFETEL) launched MiCOFETEL, a website that collects and disseminates telecommunications information for consumers within Mexico.  The site also serves as a means for COFETEL to assess the status of telecommunications within the nation.  Computech’s contribution to the interactive portal focused on broadband, a topic that we have become intimately familiar with during our work on the FCC’s speed test, National Broadband Map and various broadband-related data analysis projects.

Data is the foundation of the MiCOFETEL website.  Of paramount importance was Computech’s ability to familiarize itself with Mexico’s geographic and broadband landscape, shape relevant broadband data into a usable format for analysis, design a means to collect important data from consumers (data that was not readily available), and exhibit the data using visualizations.  These steps exemplify Computech’s standard data analysis methodology, described in more detail in the detailed steps below.

Data Familiarization

-   To gain an understanding of the broadband landscape within Mexico, Computech learned about broadband providers and technologies in the nation, read published broadband research on broadband and studied available broadband datasets.

-   To perform analysis for particular geographies within Mexico, we familiarized ourselves with Mexico’s geographic composition (state, municipalities, etc.) and the relationships they have with one another.

Standardizing, Coalescing, and Analyzing Datasets

-   To establish a standardized data format, Computech transformed millions of data records on broadband pricing, speeds and complaint data into a geographic “common denominator” for each provider and geography.  Computech then extracted useful insights from this standardized data.

-   To highlight relationships and synergies between similar (but different) datasets, Computech merged and analyzed data from disparate broadband data sources.

Crowdsourcing Data

-   To collect other required broadband data, Computech created a portal that collects broadband data from consumers, including location, provider, pricing and speeds which Computech then analyzes and visualizes.

Data Visualization

-   To highlight the analyzed broadband data, Computech created a series of charts, graphs, maps and tables that most appropriately exhibit the analyzed data.

-   To improve each consumer’s experience with the visualizations, Computech added interactive functionality, allowing users to filter for various criteria and compare broadband data to other providers and geographies.

Computech’s contributions to the MiCOFETEL site are anchored by its expertise with data – from familiarization to analysis and visualization.  Going forward, Computech will work with COFETEL to incorporate additional data sources and improve functionality of the portal, to further increase Mexican consumer understanding of broadband within their nation.

COFETEL Launches MiCOFETEL Website

Posted on: Tuesday, October 18th, 2011 by Paul Salasznyk

By: Paul Salasznyk, Ph.D

Yesterday, the Comisión Federal de Telecomunicaciones (COFETEL) launched a website (http://micofetel.gob.mx/) that displays a wide array of information about the Mexican telecommunications industry.  COFETEL, which regulates, monitors and promotes the efficient development of telecommunications throughout Mexico, tasked Computech with the construction of several key portions of the new website, including a speed test application and several maps and visualizations of telecommunications information.  Here is a summary of Computech’s contributions to the MiCOFETEL website:

1) Speed Test Application and Data Visualizations

In order to provide Mexican consumers with a measure of their broadband connection quality, Computech worked with online speed test provider Ookla and developed a broadband speed test portal.  (http://www.micofetel.gob.mx/medidor_de_velocidad)  Highlights of the speed test portion of the website include:

-  A report of download speed, upload speed, and latency of each internet connection (speed test) on the website as well as IPhone and Android Applications for mobile devices.

-  A place for COFETEL to collect location, broadband provider and price information from consumers

-  Estimates of download durations (for a online book, song and movie), based on a consumer’s download speed

-  Average broadband speed information in the area where a consumer runs the speed test, as well as speed information for other providers in their location

-  A summary page that highlights broadband speed test information for each state, municipality and provider within Mexico.  Metrics include       number of tests, download/upload speeds, latency and metrics by time of day and day of week.

2) Telecommunications Maps

In order to summarize complaint data collected on the MiCOFETEL website as well as broadband provider pricing, and broadband speeds, Computech developed a series of maps.  (http://micofetel.gob.mx/mapa_telecomunicaciones) Highlights include:

-  A map that visualizes the number of complaints (mobile phone, local/ long distance telephone, television, internet) by state

-  A map that disseminates information about average download, upload, latency for all providers by state

-  A map that highlights provider availability by state, as well as speed tiers and prices offered by those providers

The launch of the MiCOFETEL site promises to provide an opportunity to gather even more data from consumers in Mexico.  Computech is looking forward to working with COFETEL to include additional functionality and datasets into future releases of the MiCOFETEL website.

National Broadband Map Updated

Posted on: Monday, September 26th, 2011 by Darren Vandergriff

Last Wednesday, the NTIA and the FCC released the first major update to the National Broadband Map since its highly acclaimed debut in February. Computech has been a driving force on the project and has provided application development, GIS, operations research, information architecture, user experience, interaction design as well as expertise in design, front-end development and data analysis services in support of the launch and update. Along with updated data from a larger number of broadband providers, the map also provides additional features and functions.

Below is an explanation of the new National Broadband Map features:

• Data Refresh — We receive SBDD broadband data from all providers throughout the country every 6 months. The site is now updated with data from December 31, 2010 including Search, Analyze and Maps.

• There is a new page that summarizes broadband statistics for each provider in the US. The user can now select a specific geography then view a provider’s availability within that geography.

• We have introduced the sub data set that cannot be found anywhere else.
The user can also compare the selected provider with all the providers in this geography by population served, technologies served and most common download speed.

• There are new maps in the map gallery, including:
Community Anchor Institution Map — Allows a user to enter their address and view the closest 25 Community Anchor Institutions as well as information about broadband at those locations.

Feedback Map — The NBM collects crowd-sourced feedback about the accuracy of the information returned to the user in Search. A new map has been added that plots these feedback points by Provider confirmation and Speed confirmation.

• Several Summarize and Demographic APIs now return new information.
• This release included 10 more APIs. 8 APIs provide information about the providers.
• We have introduced the new API Developer pages which document the APIs more clearly
• We have also included a set of dictionary APIs to help the developers explore all the parameters in the API call and response.
• A brand new Social Layer was integrated which will enable closer Facebook, Google+, Linked in and Twitter Integration. Facebook integration now includes geospatial open graph tags. As a results of this integration, The National Broadband Map is already appearing in the Facebook Search results as a unique result. We have taken the opportunity to associate all pages of the site through National Broadband Map geographical keywords into the Facebook search.The number of modules that power the National Broadband Map has increased to 1050.

According the National Broadband Map blog, the Map is used by business owners, consumers, policy makers, research firms, academics and application developers, just to name a few. In its first seven months, the National Broadband Map has received millions of page views and countless amounts of praise.


« Previous Entries