The Company 

ACS Technologies is a church management and social engagement software company. ACST software is used by more than 50,000 churches and nonprofits around the world. ACST software enables organizations to manage finances, communication, events, and other areas.

The Product

thecitydesktop

The City is a social network app available on desktop, iOS, and Android. The City enables churches to create their own private network where people can communicate, collaborate, and grow their ministry. Approximately 537,000 people use The City across North America as of December 2014. You can see the desktop interface (with dummy content) below.

 

 

My Role

I worked at ACST from October 2013 to October 2015 as a UX / UI Designer. For this project, I owned the design for Group Search across iOS and Android, from ideation to sketches, wireframes, testing, and implementation. I later helped translate my designs for Group Search in desktop web app. 

The Goal

Design a robust search tool for our iOS, Android, and web apps. The tool would need filters, map and list views. Small group communication is critical to The City, so we the search functionality would have to be solid.

The Constraint

Some churches had hundreds of groups, which made it difficult to surface accurate search results, especially in a mobile app.

The Design Process

The PO, developers, UX Lead and I kicked off the project with a discussion of the requirements, constraints, and project timeline. 

I typed up a list of requirements, use cases, and initial interactions to design in Evernote. I then set to sketching a basic task flow on paper. I showed it to my PO, got feedback, and sketched a few UI concepts on paper, and got a reality check from my iOS developer. I iterated several times while balancing my design work on other projects.

Image: Here is one of my sketches illustrating the a task flow for search queries. 

 

 

I then jumped into the Sketch App. I cranked out a dozen medium fidelity wireframes for the must-have features, including search results and filter screens. I researched best practices on topics such as location permission prompts.

 

groupsearchmap

I presented my wireframes to my iOS developer. We disagreed over small parts of the flow, but he generally accepted my vision. I shared my wireframes with my PO and UX Lead via Invision, got additional feedback, then set to finalizing my design with higher fidelity comps. My team tries to be ‘mobile first’, so my designs were later adopted by my UX lead for Group Search on the web.

I polished the designs in Sketch and annotated the core functionality to leave less room for interpretation. I got approval from my team and the devs set to developing the designs. I worked with our QA tester closely in the following weeks, finding bugs and pinpointing areas for improvement. 


Measuring Success

The new Group Search received highly favorable reviews. We did not have a dedicated UX researcher for this project, but we had a customer implementation team that monitored users' reactions to new features. Verbal feedback from users was overwhelmingly positive. The number of iOS installs increased by 30,000 over a three month period, and the success of Group Search was likely a factor.

Lessons Learned

  • iOS boilerplate UI, conventions, and best practices
  • Application of 'mobile first' approach
  • Expect difficulties adapting new functionality to legacy features and information architecture
  • Annotate all wireframes with descriptions of functionality, interaction, states, etc. Documentation trumps conversation