The Personnel Availability page is a tool to help Marines visualize which individuals are available, scheduled for an event, or on leave on a given day. The Personnel Availability feature helps Marines digitize their hard copy personnel resource logbooks.
My colleague and I conducted contextual inquiries with 6 marines who deal with managing personnel resources from varying units. We found that our users often rely on either a shared Excel doc, Outlook, and a OneDrive calendar to check Marines’ availability. Some participants also voiced the need to view the availability of Marines outside their unit if there will be joint exercises to schedule in the future. In addition, all units have a deadline for Marines to submit their availability change, but this deadline varies between units.
Since the Personnel Availability feature lives in the homepage, there was no need for a UI Flow Model to document how users will navigate through the UI. My colleague and I jumped straight into wireframes since the task of scheduling is already well established in many major applications such as Google Calendar, Outlook, and Humanity.
The wireframes are heavily focused on how to view personnel outside of the user’s unit, creating appointments for individuals in the unit, and creating the cutoff period for submitting schedule changes. After six iterations and discussions with the Solution Architect, Lead Developer, Product Owners, and Business Analysts, we decided on a version with a simplified interaction to search individuals outside of the unit, restrict the cutoff period, and create appointments by syllabi.
Below are images of the prototype created using the FullCalendar control, HTML/CSS, and jQuery
After many discussions with the customer, we compromised on a final solution. The final product has the enhanced search and a way for users to navigate a day forward or backward. Since we included the functionality to navigate a day forward or backward, we omitted the date picker and included today’s date in the header.