EDCO App Design and Development

Introduction

Remember back in 2007 when Steve Jobs told us that iPhones didn’t need a bunch of apps?  No?  You’re forgiven if it’s been lost down the memory hole after the “there’s an app for that” campaign juggernaut that followed a few years later.  However, in the beginning Steve Jobs insisted:

You’ve got everything you need if you know how to write apps using the most modern web standards to write amazing apps for the iPhone.

Steve Jobs, Apple WWDC ’07

Considered generously, Jobs was trying to protect the performance and interface standards of Apple-produced apps (and viewed cynically, to maintain tight control of the market), but the point stood then as it does now: well-designed and well-built web apps can be as performant and pleasurable as native apps built in Swift and Java and Kotlin.  Indeed, market leaders like Slack and Figma are web apps at their core, surrounded with the trappings of application wrappers.

Why bring this up?  As an agency with 30 years of experience in web standards and a deep understanding of internet best practices, PINT believes the web platform to be the best foundation for third-party mobile development.  Networks are growing more performant, user experience design focus is becoming standard, and browser APIs are embracing native device capabilities.  This means you should be building web apps that can be distributed across all platforms, not just on iOS and Android.

Project Overview

This is the approach PINT took when asked to partner with EDCO Disposal on their recent app development project.  With a regional customer base of over half a million households, business, and other organizations, EDCO Disposal is a well-known waste management and recycling company with a long history of serving Southern California.

Over many years of partnership, PINT has helped EDCO build and maintain an informative, comprehensive website which provides resources, service schedules, and support communication outlets to its customers in the region.

However, since the majority of digital communication and web traffic occurs on mobile devices, EDCO requested a simplified mobile solution to direct customers to their most critical information.  While EDCO’s informative and content-rich website was designed to perform well on mobile device browsers, the sheer volume of content and the dynamic nature of the website’s rendering platform begged for a streamlined, intuitive mobile app companion.

As a proud partner in web and digital production, PINT was happy to answer EDCO’s need for a pleasant, effective mobile application that would connect hundreds of thousands of households to their critical waste management information.

Challenge

Everyone requires waste management services like those provided by EDCO: from commercial offices to multi-tenant residential condos.  The universal need for these services means EDCO’s team also boasts a broad and diverse customer base with which they need to communicate.  EDCO’s customers are busy parents hustling kids to school, facility management teams caring for production floors and high-rise towers, and municipal teams running schools, offices, and everything in between.

As a result, EDCO provides a wide variety of information to its customers about waste material disposal processes, support for equipment order requests, inquiries about service schedules, and many other topics.  This breadth of information is delivered through EDCO’s robust website with a complex content management system that segments specific information and content based on service regions.  Unique content is delivered based on location, with customers in different regions like Rancho Palos Verdes or Chula Vista receiving some content in common, in addition to regionally-specific content directed to their community.  The content-rendering platform of the website performs well on a powerful desktop or laptop, or on a newer smartphone on a fast network, but the older the phone or the spottier the connection, the less likely the customer is to have a pleasant experience.  Such are the limitations of older hardware and slower networks.

In producing an app, PINT was faced with the challenge of maintaining this segmented content without relying on EDCO’s dynamic, resource-intensive content publishing system, and without creating a duplicate set of content within an app which would require EDCO to update its content in two places.  Sounds like a puzzle, no?

Solution

Fortunately, PINT has experience with application architectures that address these issues. By establishing the following constraints and best practices, PINT was able to build a tight, useful app that affords customers easy access to the information they need at optimal speeds.

1. PINT designed a single app architecture distributed on both Apple/iOS and Android device platforms, avoiding the need for two different codebases.
2. PINT required EDCO’s existing website be used as the single source of content for the app.  No editing in two places, no additional work for EDCO marketing managers or support representatives.
3. PINT refined EDCO’s content to the most important information, delivered with speed that rivals the response time of a mobile game or app, meeting customers’ expectations of mobile app performance.
4. PINT connected EDCO with its customers via options for to push notifications for updates such as service schedule delays, seasonal updates, and new service offerings.

Single codebase architecture

Tackling the first requirement of maintaining a single codebase that distributes to both iOS and Android app architectures was a relatively simple solution.  PINT leveraged the Capacitor framework to distribute a progressive web app as a native app in each platform.  Capacitor enables the PINT team to build in web standard technologies like HTML, CSS, and JavaScript, without requiring both a Swift and a Java or Kotlin codebase.  Capacitor provides performant access to native device APIs and supports PINT’s vision for mobile computing: the freedom and extensibility of the web makes it the ideal mobile platform.

Additionally, while app stores provide a useful means of distribution and commerce they are by definition under the control of the companies that run them.  Building a web app wrapped by Capacitor allows the EDCO app to be distributed through the app stores, but it can also be downloaded as a binary (installable file) or served to a browser as a web app if the organization ever decides to go that route.  Everything is possible.

Sync app content with the website

But how to solve the second problem of getting EDCO’s content into the app?  EDCO has a website full of curated content with several interactive features.  Built on WordPress, the website takes time to dynamically render pages, which will not deliver a pleasant experience on an underpowered mobile device or slow network.  Further, EDCO shouldn’t have to update content on both the website, as well as on the app.

This requires a particularly clever solution and a favorite web delivery mechanism of PINT’s: static publishing.  While many websites (including EDCO’s) use a dynamic Content Management System (CMS) to store and deliver text, images, and video, these CMS systems require a lot of computing overhead and network bandwidth to do their work.  CMS are useful for editing and managing a website, but they aren’t the best at delivering content quickly.

Since a snappy user interface is expected in mobile apps, PINT leveraged WordPress’ content API to pull out and to store essential content in a JSON file structure at a cloud storage endpoint (AWS S3).  When a user downloads the app, the app pulls in the most recent static content file from AWS.  Periodically, this content is refreshed from WordPress to AWS, and the app checks on open to see if there is fresh content.  This all occurs in the background with a minuscule data transfer, and without troubling the app user.  The process does require an internet connection, but so would any other content update.

Streamline content

PINT’s third challenge was to constrain the app experience for EDCO’s customers to the most critical successful outcomes.  User experience is a complex and rigorous field of study, and this summary will barely scratch the surface. However, by focusing specifically on outcomes as defined by the reports of customers and EDCO’s customer support team, PINT identified a simplified workflow to achieve the outcomes desired most frequently by their customers: service schedule confirmation, bill payment, request fulfillment, and service commencement or termination.

The app interface was then built to guide users as quickly and effortlessly as possible to these 4 outcomes, eliminating unnecessary cognitive overhead.  Interestingly, an early suggestion by the PINT team to harness the mobile geolocation capabilities of the phone was eventually discouraged after research revealed that users often search for their information from outside their hyper-localized content area (their Zipcode is the localizing criterion).

Connect with customers

Finally, EDCO understood that a feature priority of the app would be notifications to customers of service changes and updates, particularly around holidays and other important dates.  Anyone who has put their waste barrels at the curb on Memorial Day only to find them full later that evening will sympathize.  Fortunately, opt-in, mobile push notifications are a great way to reach out to a large customer base and are integrated nicely into a web app like EDCO’s.

For push notifications, PINT looked to Google’s Firebase Cloud Messaging service (FCM), which packages nicely with EDCO’s Capacitor app.  Rich messages can be drafted and scheduled, and interactive response functionality can be implemented, as well.  Users opt-in to receive messaging so personal privacy is respected, and the feature can be removed at any time from their phones.  Message receipts are tracked anonymously to verify success and distribution scale, and advanced analytics are available to the degree EDCO wants to review them.  FCM is a great, lightweight solution for any web app seeking to reach both the iOS and Android markets.

Results

So there you have it!  A nice, compact web app built just for EDCO and distributed to Apple and Google stores without requiring their marketing team to provide any new content beyond what is already on their website.  Native app functionality, including push notifications and a brisk, usable visual interface!  All that, plus freedom from the constraints of the app stores while simultaneously taking advantage of publishing through them.  Who says you can’t have it all with the web platform?  Web apps: the mobile technology of the future! (since 2007)