Image of Civen Opened on a Cell Phone

Civen

Civen is a mobile application created to assist emergency responders and civilians in a flood situation. Through the application civilians can quickly report non-emergency situations such as power outages, flooding, debris blocking a road, burst pipes and other incidents. When a civilian completes a new report it is sent to the proper authorities, reducing the number of non-emergency calls to 911.

Goal

Create a mobile application to mitigate flood situations

Role

User experience designer, user interface designer

Team

This was a class project

Goal

Create a mobile application to mitigate flood situations


Role

User experience designer, user interface designer


Team

This was a class project


Whiteboard Covered in Post-It Notes and Writing From a Brainstorm Session

Process

Intial Sketches and Notes for the Application

Research

I began my research for Civen online, reading different articles about flood situations. This information helped me understand how flood situations are mitigated and learn what information is essential to civilians and emergency responders when flooding is occurring. To learn more about how emergency responders mitigate flood situations, I conducted interviews with a police officer, EMT and a Wisconsin Emergency Management employee. These interviews helped me explore what type of application might assist emergency responders to mitigate a flood situation. Conducting research helped me formulate a concept for how the application should work.

Whiteboard Covered in Post-It Notes and Writing From a Brainstorm Session

Task Flows

After deciding on an idea for Civen, I began sketching task flows to explore ways different tasks might be completed within the application. I wanted to make sure creating a report was simple, knowing people might call 911 simply because it is easier. I also tried to add value for the people submitting reports, giving them a map view of incidents in their areas.

Sketched Task Flow

Sitemap

Creating a sitemap solidified my plan and allowed me view the structure of the application as a whole. This helped me to ensure nothing was left out of the application.

Sketched Sitemap

Sketches

With my task flows in mind I began sketching wireframes with pen and paper. Sketching allowed me to explore several concepts for the structure of the application’s pages. After creating several sketched wireframes, I reviewed them with my classmates. This helped me locate any issues in the functionality of the application and quickly formulate solutions.

Initial Sketches of the Application
Sketches of the Reporting Process

Wireframes

When my sketched wireframes were complete, I began to digitize them in Sketch. Taking more time to digitally create my wireframes allowed me to analyze them more thoroughly and improve upon the application’s functionality. With this process I was able to reduce the number of pages within Civen by simplifying the reporting function of the application.

Wireframe of the Create Account Page
Wireframe of Incident Map
Wireframe of the Application's Menu
Wireframe of the Notifications Page
Wireframe of the First Step in Creating a Report
Wireframe of the Second Step in Creating a Report

Design

I designed the application in Sketch, utilizing a style guide created by our Creative Director Kristian Rodriguez. The application’s logo and icons were created by our illustrator Pablo Obando.

Designed Login Page
Designed Create Account Page
Designed Incident Map
Call 911 Modal
Designed Notification Page
Designed Menu
Designed Create a Report Step One
Designed Create a Report Step Two
Designed Create a Report Step Three

Prototype

After designing the application I used InVision to create a prototype. Creating a prototype for Civen allowed me to see how the application would function. Utilizing the prototype I was able to receive feedback and make any necessary changes to the application.


View Additional Projects

Blueline Project Icon

View Project

Blueline transforms the standard public safety radio into a radio application for police supervisors.

Sunnyside Reporting Project icon

View Project

Sunnyside Reporting is an online dashboard and reporting tool for nursing home administrators.

Civen Project Icon

View Project

Civen assists emergency responders and civilians in flood situations.

Coral Restoration Project Icon

View Project

Learn about the impact of climate change on corals and coral restoration.

On A High Note Project Icon

View Project

On a High Note is an interactive experience merging music, neuroscience and technology.

Feed the Fish Game Icon

View Project

Feed the Fish is an online game created with JavaScript.

U Compute Project Icon

View Project

UCompute provides users with easily accessible tutorials and resources.

Park Pass Project Icon

View Project

Park Pass simplifies the process of purchasing tickets for amusement parks online.

Weather Forecast Project Icon

View Project

The Homework Forecast assists users deciding when they should complete their homework.

 

Blueline Project Icon

View Project

Blueline transforms the standard public safety radio into a radio application for police supervisors.

Sunnyside Reporting Project icon

View Project

Sunnyside Reporting is an online dashboard and reporting tool for nursing home administrators.

Civen Project Icon

View Project

Civen assists emergency responders and civilians in flood situations.

Coral Restoration Project Icon

View Project

Learn about the impact of climate change on corals and coral restoration.

On A High Note Project Icon

View Project

On a High Note is an interactive experience merging music, neuroscience and technology.

Feed the Fish Game Icon

View Project

Feed the Fish is an online game created with JavaScript.

U Compute Project Icon

View Project

UCompute provides users with easily accessible tutorials and resources related to coding, data and computer science.

Park Pass Project Icon

View Project

Park Pass simplifies the process of purchasing tickets for amusement parks online.

Weather Forecast Project Icon

View Project

The Homework Forecast assists users deciding when they should complete their homework.

 

Blueline

BlueLine transforms the standard public safety radio into a radio application for a touchscreen Android device. This application was created as a tool for police supervisors.

 

Sunnyside Reporting

Sunnyside Reporting is an online dashboard and reporting tool for nursing home administrators.

 

Civen

Civen is a mobile application created to assist emergency responders and civilians in a flood situation. hrough the application civilians can quickly report non-emergency situations

 

Coral Restoration

This is a project created for the University of Miami Rosenstiel School of Marine and Atmospheric Science. The purpose of this project was to create an interactive website sharing information about the impact of climate change on corals and coral restoration.

 

On a High Note

On a High Note is an interactive experience that would take place at the Frost Science Museum. Merging music, neuroscience and technology, the experience explains how the brain perceives music.

 

Feed The Fish

Feed the Fish is an online game created with JavaScript.

 

UCompute provides users with easily accessible tutorials and resources related to coding, data and computer science.

 

Park Pass is a mobile application created to simplify the process of purchasing tickets for amusement parks online.

 

Homework Forecast

The Homework Forecast assists users deciding when they should complete their homework.