Laserfiche Mobile App

Laserfiche Mobile app allows LF users to access their stored documents in the LF repository, upload or capture new documents, and interact with LF Forms. It can also search the repository, run business processes, apply document templates, edit and add document metadata, add geotags to uploading documents, share documents, and more. Currently the app is available on AndroidiOS, and Windows store.

I joined the team in early 2014 and ensured consistency with interactions and visuals throughout the app across all operating systems. I worked closely with the UX designer in brainstorming and prototyping new features and the QA Engineer to ensure quality of the feature implementations. 

Role: UI designer

Methods + Skills: SVG icon design, interaction design, creating visual guidelines for Android, iOS, Windows 10 platforms, UI review


UI Design

The main challenge of this project was having to design for three different operating systems (iOS, Android, Windows 10) across various device sizes, while maintaining the same look and feel. I had to adjust the interactions of each app to work with its respective OS. I worked with three app developers who each focused on building an OS. 

For the login screen, I designed it so the login experience feels sleeker by including animation so the user can visualize the loading process as each element comes together. I also kept the color of the elements aligned with the branding so the user has a sense of familiarity with the product. 

 

Prototype to Hi-Fidelity Comps

To help demonstrate the interaction of a feature to the developer, I like to build a quick rough interaction prototype in POP, a tool that let's me build interactions into my sketches. This way the developer can start building the framework while I work on the comps. 

 

For iOS

These are the main screens of our iOS app. 

Entry Browser

Entry Browser

Document Viewer

Document Viewer

Laserfiche Forms

Laserfiche Forms

Main Left Navigation

Main Left Navigation

 

For Android

Here is an example of the app in a larger device size. The layout switches to a two pane view since there is more screen real estate. 

 

For Windows 10

Here is an example of a comp for geolocation for Windows 10. I helped design the flow and produced the UI while keeping in mind the interactions specific to Windows OS. The geolocation feature allows you to search for scanned or captured documents through its location coordinates. When you run a search, the document will sort by city and drill down further as you tap into a selection. You can toggle between the 'map view' or 'list view' depending on the user's preference.