The complete redesign of the Town of Ellington App, a companion for the website.

1. Redesigning the
Town of Ellington
App
The process of redesigning the town of
Ellington’s companion app through user
testing.

2. Current Town
of Ellington
Information
Architecture

3. Town of Ellington - Website
Government
Home
Contact Us
Site Map
Accessibility
Copyright Notices
Government Website
by CivicPlus
Contact Us
Employee
Directory
Request a Permit
or Document
Employment
Opportunities
FAQs
Apply For...
Disposal of
Various Items
Find
Fingerprint
Services
Fire Safety
Inspection
Outside Public
Assembly
Function
Pay
Report
Vote
Request
View
Recycle
Business
Notary Public
Services
Request for
Proposal
Shop Ellington
Trade Names
Community
News & Events
Applications Town
Property Use &
Special Events
Directions &
Maps
Emergency &
Community Alerts
Ellington History
Veterans
Visiting Nurse &
Health Services
Crumbling
Foundations
Health Info &
Links
Town Owned
Land
Get Involved
Senior Center
Parks & Facilities
Library
Transportation
Organizations
Community
Resources
Departments
&Services
Administration &
First Selectman’s
Office
Animal Control
Assessor’s
Office
Building
Department
Education
Emergency
Management
Emergency
Services
Finance
Department
Fire Marshal
Housing Services
Human
Resources
Human
Services
Hall Memorial
Library
North Central
District Health
Department
Parks &
Recreation
Planning
Department
Police
Public Safety &
Judicial Services
Public Works
Town Clerk’s
Office
Youth Services
Registrar of
Voters
Senior Center Tax & Revenue
Collector’s Office
Footer
Agendas &
Minutes
Board of
Selectman
Boards &
Commissions
Town Meeting
Elected Officials
Legal Notices
Town Charter
(pdf)
Town Code
Town
Profile
Town Reports
KEY
= related content,
multiple pages un-
der this nav option
= links to outside
page (also made by
the town)
If there is no key on the
navigation option, then it
leads to a single page.

4. Proposed Town
of Ellington
Information
Architecture

5. Town of Ellington - Website
Government
Home Contact Us Employment Opportunities News & Events Request a Document
Contact Us
Employee
Directory
Request a Permit
or Document
Employment
Opportunities
Community
Businesses
Calendar
Emergency &
Community Alerts
Ellington
History
Health
Information
Library
News & Events
Organizations
Parks & Facilities
Senior Center
Transportation
Veterans
Services
Education
Emergency
Services
Housing
Services
Human
Resources
Parks &
Recreation
Public
Safety
Public Works
Youth Services
Town Clerk’s
Office
FAQs
Footer
Agendas &
Minutes
Board of
Selectman
Boards &
Commissions
Departments
Registrar of
Voters
Assessor’s
Office
Elected
Officials
Town
Documents
Town
Meetings
KEY
= ability to search
= related content,
multiple pages un-
der this nav option
= links to outside
page (also made by
the town)
If there is no key on the
navigation option, then it
leads to a single page.

6. Town of Ellington - App
About Services
Education
Emergency
Services
Housing
Services
Parks &
Recreation
Public
Safety
Youth Services
Community
BusinessesCalendar
Library
News & Events
Organizations
Parks & Facilities
Senior Center
Transportation
Veterans
Contact Us
Employee
Directory
Request a Permit
or Document
Employment
Opportunities
Library Emergency
Services
Senior
Center
Parks & Rec
Apply for Per-
mit/Request
Document.
Board of
Selectman
Boards &
Commissions
Departments
Town
Documents
Town
Meetings
Login
Business Owner
Resident
Town Employee/
Elected Official
Access to
Town Documents
Upcoming Meetings
Registrar of Voters
Resources
Public Works
Quick Links on Home Page
Main Navigation

7. PURPOSE
The purpose of this app is to
provide an easy-to-use app where
residents can learn about the
services that impact them and the
events going on around town. It
provides important information
about government and easily
allows residents to join
committees or organizations in
town.
MAIN FUNCTIONS
1. View upcoming events
2. Provide information about ways
residents can get involved
3. Share with residents the services
that they can take advantage of
4. Alert residents when there is a
change in schedule for events,
school, etc.
5. Provide easy access to important
government documents and
application processes
2
About the App

8. Target Audience
Since Ellington is such a small town,
the target audience for this app is
residents as well as business owners
in Ellington. The median resident age
is 40.9 years, and Ellington has a lot of
families as well as seniors. Therefore
the main audience would be adults
40+ with a focus on moms and senior
citizens. However, Ellington wants to
get its younger population more
involved and wants to make sure this
app caters to them as well.
3

9. Audience Needs
1. Residents are easily able to discover
events happening in town
2. Residents are easily able to research
and use the services available to them
3. Residents are easily able to become
more engaged in the town by learning
about committees
4. Residents are easily able to stay up-to-
date with government, schools, and
services
4

10. User 1: Cindy
As a mom of three
kids, I want to stay
up-to-date on events
and activities that we
can be a part of as a
family.
5
User Stories
User 2: Bethany
As a recent grad, I
want to get involved
with the town
government and
actively participate.
User 3: Barbara
As an elderly citizen, I
want to be aware of
the services available
to me and easily find
information on
transportation and
the Senior Center.
User 4: Dan
As someone who just
opened a business, I
want to learn about
events to connect
with potential
customers and make
a strong connection
with the town.

11. User 1: Cindy
Cindy has 3 kids that are in the Ellington school systems as well as involved in local
communities. She needs to always be up-to-date on what’s happening in town. She wants to
be able to easily see what family events are happening around town and sync the events to her
phone calendar, because she needs a way to keep track of their busy schedules. While she
wants to be able to keep tabs on her children’s education and learn about committees that she
can join, her primary focus is finding events and scheduling their busy lives.
6
User Scenarios
User 2: Bethany
Bethany is a recent grad who has relocated back to town. After getting a degree she wants to be more
involved with government, but isn’t sure how. Bethany needs to be able to research the town as
much as possible to catch up on what she missed. She needs easy access to town meetings, agendas,
and minutes, but most of all she needs to know what town committees she can join and easily apply
to them.

12. User 3: Barbara
Barbara is in her late 70s and lives with her husband. Her kids have moved away, and she
wants to exercise as much independence as possible. She enjoys going to the Senior Center
with her friends and needs to be able to access the schedule for events with a detailed
description of each event, to ensure she actually wants to attend. While she can drive, she
doesn’t like to and prefers to take town transportation, so needs to be able to have current
information about how she can use the town transportation.
7
User Scenarios
User 4: Dan
Dan just opened a pet store in town and wants to make a connection with the town and the residents.
He wants to use the app to branch out and meet other people in town. While he needs to use the app
to stay aware of local laws that affect him as well as upcoming events, he mainly wants to use the
app to join a community organization to meet other people in town. He needs to be able to decide
which organization to join as well as use the app to stay connected to other organization members
and upcoming meetings.

13. User 1: Cindy
8
Flow Chart

14. User 2: Bethany
9
Flow Chart

15. User 3: Barbara
10
Flow Chart

16. User 4: Dan
11
Flow Chart

17. Paper
Prototypes

18. Paper Prototypes
I created a model of a phone
made out of cardstock and
created screens that fit in the
prototype. This allowed me to
create prototypes that were the
correct size. This also allowed
me to test out how easily
different buttons can be touched
based on my hand position.
These prototypes are for a
mobile device.
2
Method

19. Menu
3
Home Screen
Quick
Links
Menu appears
on most pages
when you tap
screen
“E” takes
you home

20. Menu
4
Main Menu
When you click the 3
lines on any screen.

21. Menu pointing
to left takes you
to last page.
The circles are
small, basic
graphics.
5
Submenu - About
When you click the
“About” on the main
menu.

22. Arrows
allow you to
click to
previous
and next
month.
6
Calendar
When you
click on a day,
it takes you to
a single event.
Adds to your
calendar.

23. You can add
an alert on
your phone
to remind
you of the
event.
7
My Events - Alerts
The alert that
shows up on
your phone.

24. User can
click for
directions.
8
My Events - Alert
Find updated
info about
event.
Users find this page when they
have clicked on an alert.

25. Menu
9
Senior Center
When you click on the Senior
Center quick link or in the menu.
Takes you to
transportation
page
Fillable
form

26. 10
Transportation
Lists scheduled transportation and
pending requests.
Check status of
requests
Transportation
user has signed
up for.

27. 11
Submenu - Community
Submenu from main menu.
Circles are small
graphics.

28. 12
Organizations
Lists scheduled transportation and
pending requests.
Clickable tiles of
most popular
categories
A-Z listing of all
organizations

29. Clickable
options
13
Youth Organizations
When you click on the Senior
Center quick link or in the menu.
Clicking on
“Rise Above”
Able to email
leaders of
organizations

30. 14
Submenu - Departments
Lists
departments
A-Z

31. 15
Submenu - Departments
Info about person who
runs department.
When you click on the
Administration option on
department submenu.
Info and option to email
staff.
Click to apply for an
opening.

32. 16
Submenu - Departments
Applying for a position in a
department.
Description of position
Button to upload resume
and cover letter

33. 17
When you click on the library click
link or in the menu.
Takes you to a calendar
page for library
Apply for a library card
Library
Able to search for library
content

34. User Testing

35. Methodology
Using paper prototypes that were already created (a few were
updated and a few were added to enhance testing), ran 4 people
through user testing using the POP app. Audio was recorded.
Testing took about 20 minutes per person, and users were given
specific tasks that were based off on user stories previously created.
Users were read a script, and were also asked open-ended questions
at certain points in the process, such as “What would you expect
pressing this button to do?”
Testing was completed to better understand how potential users
would interact with the paper prototypes before designing on a
computer would being.
Prototype located at https://marvelapp.com//55a52h0

36. Script
Hello, ______. My name is Emily, and I want to thank you for helping us to improve our companion app for the Town of Ellington.
I will be guiding you through this session, and before we start, I want to tell you how this process works and why we’re doing it.
We’ve asked you to come in today to test out a website we are currently designing to make sure that it functions correctly. This
will take about 45 minutes, but if you need a break at any time, please let me know.
Please be aware that we are testing the site, not you, and that there are no wrong answers. Try to be as natural and honest as
possible and act like you would a normal website. After this session, I have some snacks for you if you want them as a thank
you.
We’re going to go through this website together. I’m going to ask you to complete a specific task and observe how you would
expect to complete the task. As much as possible, please say your thought process out loud, so that we can understand it better.
I’m also going to ask you questions such as, “What would you expect pressing this button to do?”
I won’t guide you through the site, so that I can understand how you would naturally navigate it. If you ever feel confused or are
not sure what to do next, please let us know. Again, we are testing the website and not you. If you have any questions at any
point please let me know, and I will try to answer them.
With your permission, I would like to record our conversation on a microphone, so that I can listen to the tape later and use the
information to improve the site. I have someone involved with the project to take notes for me.
If you need to take a break, please let me know. Before we start, will you please sign this permission form saying that I can audio
record you completing this session. On this form, it states that this recording will only be available to me.
I’m going to ask you a few questions about yourself before we begin. Do you have any questions or concerns before we start?

37. Questions
1. What’s your name?
2. What town do you live in?
3. Are you involved with the town, ie do you go to events, use any
services, attended, school etc,.
4. What phone do you have?
5. How often do you use it and where do you most frequently use it?
6. What other apps do you use?
7. Do you tend to use apps or websites more?
8. What’s the number one thing you would a town app for?

38. Demographics
In an attempt to capture various users who might interact with the
website, I sought out individuals of different backgrounds and in
different stages of life. I tested on a 60-year old woman with two
kids, a 32 year-old male who works in town, a 25 year-old female
who is considering moving to town, and a 29 year-old male resident
who is expecting his first child.

39. Task Scenarios
1. As a parent living in Ellington, find an appropriate town event
and add it to your calendar.
2. As a senior citizen, request transportation to the local grocery
store for December 14th at 2 pm.
3. As a resident who would like to become more involved, find a
youth organization that interests you and send the leader an e-
mail.
4. As a young adult, apply for a job in the administration
department.

40. Task 1 User Flow
As a parent living in Ellington, find an appropriate town event and
add it to your calendar. (There are two ways to do this)
= where to click

41. Task 1 User Flow
As a parent living in Ellington, find an appropriate town event and
add it to your calendar. (There are two ways to do this)
= where to click

42. Task 1 User Flow
The second method is to click on the calendar icon on the constant
menu at the bottom.
= where to click

43. Task 2 User Flow
As a senior citizen, request transportation to the local grocery store
for December 14th at 2 pm.
= where to click

44. Task 2 User Flow
As a senior citizen, request transportation to the local grocery store
for December 14th at 2 pm.
= where to click

45. Task 3 User Flow
As a resident who would like to become more involved, find a youth
organization that interests you and send the leader an e-mail.
= where to click

46. Task 3 User Flow
As a resident who would like to become more involved, find a youth
organization that interests you and send the leader an e-mail.
= where to click

47. Task 4 User Flow
As a young adult, apply for a job in the administration department.
= where to click

48. Task 4 User Flow
As a young adult, apply for a job in the administration department.
= where to click

49. Findings
The single most important thing that this testing uncovered is that
the app should allow people to create user profiles, so that they can
log in and only see information that is pertinent to them (and still be
able to find other information of course). This manifested differently
in each person/scenario, but all 4 participants expressed that there
was too much information on the app that they were not interested
in. All four users at one point had trouble finding which menu option
something was under, and creating user profiles would help to
alleviate that confusion.

50. Findings
¾ of the users found the difference between “Services” and “Community”
to be confusing in the main menu. They thought transportation would be
under “Services”.
¾ of the users used the calendar icon to locate events, and 2 of those
immediately located the icon and clicked it.
All 4 users found the admin assistant application, but visibly expressed
frustration and took more time on the first step.
All users did not realize that “Add to Your Calendar” did not mean add to
your PHONE calendar and were not aware there was an extra step to add
it to your phone calendar. This was confusing for all 4 and would need to
be fixed.
All users were able to answer “What do you think this button would do
correctly” for buttons like the three lines to open menu, and the < to close
the menu/return to the last page.

51. High Fidelity
Program
Options

52. Programs
High-fidelity programs allow you to create and test detailed
“sketches” that are much closer to being finished than paper
sketches. There are many options for programs to use
Invision – An app that allows you to create a product design
workflow and test sketches.
Sketch – A digital design app from Mac that allows you to create
images, icons, UIs and more.
Adobe XD– An Adobe app that allows you to create wireframes and
turn them into interactive prototypes. (I would have gone with this
one, but had to update my Mac software to download the app.)
Marvel – An online app that allows you to create prototypes and
wireframes. It is very user friendly.

53. Programs
Axure – An app that allows you to create prototypes and wireframes,
keep track of projects, and document progress/notes on projects.
Balsamiq – A rapid prototyping tool that mimics the effect of writing
on a whiteboard.
What I chose: Invision
I chose Invision, because I enjoy creating designs in InDesign and
Photoshop, so I was able to easily upload my images and create
links. It was a very intuitive and free app to use.

54. High Fidelity Screens

55. High Fidelity Screens

56. High Fidelity Screens

57. High Fidelity Screens

58. High Fidelity Screens

59. High Fidelity Screens

60. High Fidelity Screens

61. High Fidelity Screens

62. What Changed
After Using Testing
After user testing was completed, I made a few changes to the app
design. The biggest one was creating a login page, so that users
could create customizable profiles that only showed them what they
found most relevant.
I also added the pop-up pages that appeared when you added
something to your calendar, requested transportation, applied for a
job, etc. When testing, users were confused and wanted to know if
they had achieved what I asked of them. I created those pages to
solve this problem.

63. What I Learned
Before this project, I had never done user testing before. Throughout
this project, I learned how important it is to have others test out your
designs and how important it is to do paper prototypes and use an app
like POP to allow users to test the designs as if they were real.
You can gain beneficial feedback when you ask users to complete a task
and observe their processes. It allows you to really step into the users’
minds. While the overall process is beneficial for creating apps or
websites, the objectives and methods can be used in any design
project. For example, I create a lot of flyers at work, so I’ve learned that
it’s beneficial for me to have someone who is not involved with the
project look at the flyer and tell me what they see first and what
questions they immediately have.
Besides the processes, I also new programs, such as POP and Invision,
and improved my sketching capabilities