Photofile

Moving the county court filing system to mobile:
Productive case management in the lawyer's pocket

SUMMARY

Up until 2016, the user experience related to filing court documents in Santa Clara County was the same as it had been for decades. The county set out to embrace new tools that could be integrated with an aging IT infrastructure. As a practicing lawyer, I designed Photofile - a first of its kind mobile application that provides faster, smarter ways for legal professionals to file, track, and manage case documents.

THE PROBLEM

In Santa Clara County, standard procedure for filing court documents has long required attorneys to deliver paper copies to courthouse clerks. All communications about filed documents occurred in person or over the phone, if you were patient enough to wait through lengthy holds.

In March 2016, the Superior Court announced new rules for an mandatory electronic filing system. Vendors sprang up around the county offering subscription websites for attorneys to file documents online. As my firm struggled to select a service, I took a deeper look into the challenges faced by my industry colleagues under the existing filing system. Despite the variety of available services, none of the sites could be properly used without access to a computer. Solo practitioners who spent the majority of their working hours in court or on the road still scrambled to meet filing deadlines.

THE SOLUTION

Photofile addresses attorneys’ struggles and complements the county’s shift towards a modern, technological filing system by opening the door to mobile productivity. With Photofile, legal professionals can seamlessly snap a photograph of their documents and upload multi-page PDF files for processing by the court. Submissions can be tracked in real time, and contacting the clerk is as simple as pressing a button. With Photofile, attorneys can have case dockets at their fingertips and manage caseloads wherever they are with ease and total peace of mind.

THE RESEARCH

User Interviews


I began by interviewing fellow attorneys and legal assistants as members of my target audience, focusing on:

  • How often they filed documents with the court and looked for case information online;
  • What they liked or disliked about the current filing system;
  • What services they used to file documents and what they liked or disliked about them; and
  • How they typically scheduled their work day to meet deadlines.

These conversations revealed common themes for user motivations, frustrations, and considerations, including:

  • All interviewees accessed case information from the court website every day. The vast majority relied on bookmarks or other shortcuts to get to the information and struggled to find the link from the home page;
  • They wanted more updates about submissions without having to chase it down on their own;
  • Most relied on process servers for routine submissions but handled critical filings on their own; and
  • Attorneys preferred to file signed orders immediately after hearings to give clients a greater sense of finality .

It was evident that legal professionals wanted a system that was more responsive to the information they needed and gave them greater control over when they could file documents wherever they were during the work day.

Personas


From my interviews, I identified two major user groups, which I developed into two personas.

Competitive Analysis


Given the concerns of our target users, I needed to take a closer look at eFiling vendors in the nascent market to understand where they were addressing legal professionals' problems and where they fell short. I completed a feature inventory of three direct competitors who provided eFiling services in the county. The vendors had similar features: basic log-ins, account set up, and case entry and review options, though GreenFiling’s single screen eFiling appeared to be a unique feature. Some chose to prioritize a monthly invoicing option as opposed to pay-by-credit card. Notably, none of the providers developed a mobile application to accompany their websites.

Storyboard & User Flows


I sketched out a short storyboard to help me ideate at a high level on how a user would interact with my product. I followed up with user flows to break down how our personas would travel the path from initial interaction to end goal. This took a few iterations as I experimented with how to guide users through a multi-step filing process that would be inuitive without excessive instruction, simple without being content-sparse.

Feature Prioritization


The tasks portrayed in my user flows pointed me towards the next step to address our personas' needs: prioritizing features. I compiled a dream list of features and then narrowed it down using a 2x2 matrix. This revealed six high-impact features necessary to fulfill users' needs and that users would expect to see in our product.

Sitemap


To generate ideas for organizing our content, I conducted an open card sorting exercise to see how participants mentally classified pre-labeled cards and what terms they used to name their categories. Using the results, I drew up a sitemap to solidify the app's navigation structure and content hierarchy, sketching out a few versions before settling on a structure that would act as a reference point as I began to design the actual product.

BRANDING

Having an identifiable logo that sets the right expectations is vital to attract consumers for whom time is always of the essence. The brand identities of existing competitors appeared to follow a set formula: a minimalist logotype paired with a simple icon. I set out to create a visual design system for our product that would reflect the same professionalism while packing more visual punch.

Typography


Lora is a serif typeface with moderate contrast and contemporary flair and is optimized for screens. Its large counters and predictable proportions allow for high readability. Roboto Slab mimics the Courier typeface used in legal documents but provides a more natural reading rhythm by allowing letters to follow their natural width. This combination applies a modern twist to an industry standard, giving users a sense of familiarity while optimizing readability for mobile productivity.

Brand Story & Logo


The product’s central premise was to allow users to take a photograph of a legal document, upload it to the court, and obtain a filed version (stamped and entered into the county database). I wanted our brand name to communicate these actions and evoke immediate familiarity within our target audience without sounding too trendy or mundane. I also needed to distinguish our product from other photo-conversion apps. User input prompted me to quickly discard "Snap2file" in favor of the more serious and straightfoward "Photo to File," which fared better during subsequent usability tests. As I sketched ideas for a proper logo, however, an accidental mispelling lead me to adopt "Photofile," a more concise brand name with potential to become a verb in itself.

Early logo concepts combined camera and file folder imagery to communicate the product’s function and key message. After further brainstorming and experimentation, the selected design consists of legal file folder subtly imitating a camera, paying homage to a commonplace item in law offices with just a hint of inventive humor.

Colors


Photofile also needed a color palette to elicit associations with authority and reliability while providing a sense of calm. I drew my inspiration from the color schemes of insurance companies and federal government websites.

EXECUTION

Photofile transformed from paper sketches into a clickable prototype through rounds of exploring visual design, conducting usability testing, and iterating on user feedback.

Paper Prototype


I started by sketching a rough screen flow to visualize the screens on which each step of the user flow might be completed. I then put pencil to paper to create rudimentary hand-drawn models of the interface to be able to iterate quickly and test early. User feedback helped prioritize key changes to taxonomies and global, local, and supplemental navigation, and I sketched out a second series of screens to incorporate the design recommendations before turning to Sketch to begin creating wireframes.

Low-Fidelity Wireframes


As I built my grayscale wireframes, I added annotations to imagine interactions between selected elements. I wanted to test which visual elements users would gravitate towards to understand which step they were accomplishing within a larger task. I also wanted to see if our category names and button labels corresponded to users' mental models. Using a screener, I recruited participants for in-person usability tests and guided them through interactive wireframes in InVision using a test script adapted from Steve Krug.

Testing revealed that users had no issues with submitting a document for eFiling when taking the task in order, but struggled when they were required to start in the middle of the task. This main user pain point informed my top action items to improve user experience:

  • Build breadcrumb and revise global navigation bar to better accomodate user flows;
  • Improve system feedback to provide textual or visual responses when users make selections (choose a filing fee) or do important actions (delete or submit documents); and
  • Consolidate screens or introduce modals to improve content organization and progressive disclosure.

High-Fidelity Prototype


Photofile came to life as I added color and iterated on my design to create a high fidelity, clickable prototype. I chose to apply a dark background to counteract the glare of harsh courtroom lights. Bright red was applied sparingly to point and condition users towards the location of primary actions.

KEY LEARNINGS

In creating this mobile application, I was challenged to design a technological experience for specialized users unaccustomed to technological assistance within their field. Instead of encouraging users to spend hours within the app, this platform required a structure that would get users in and out while still delivering an enjoyable experience so as to be trusted as a reliable tool in times of emergencies, and perhaps eventually, as part of lawyers' regular workflow.

Working on this project taught me the importance of designing for the user. While I drew upon my own expertise as an attorney for brainstorming or generating ideas, I learned that not making assumptions about my colleagues' preferences allowed a more efficient design process to reveal invaluable insights.

With more time, I would conduct a third round of usability tests on my high-fidelity prototype. I would also conduct additional research into how our platform might partner with an existing eFiling vendor to break into the market, as well as the potential exposure to liability lawsuits.

CODING

Coming soon!