Course Objectives: After completing this course, learners will be able to...

• Understand the importance of responsiveness.
• Have a greater appreciation for what responsiveness means in terms of application design and development.
• Understand FedEx's standards for responsiveness.
• See how Bootstrap works in action.
• Identify best practices for creating responsive pages.
• Create responsive applications that work for anyone.

Course Objectives: After completing this course, learners will be able to...

• Identify and compare the different methods used for gauging and measuring personality.
• Understand FedEx's PSP personality classification system and framework.
• Identify their own PSP personality profile and compare with their team members.
• Translate PSP behavioral styles into persona motivations and needs.
• Identify interview questions based on personality traits.

Course Objectives: After completing this course, learners will be able to...

• Understand and identify the role and purpose of ethnographic research in UX design.
• Identify and compare the different methods used to conduct user research, including when to use a specific technique.
• Identify the process of outlining all project stakeholders via a stakeholder map.
• Diagram the overall experience and end-to-end user journey for a task, process or scenario.
• Synthesize the results of their user research into a user summary document.

Process: My children have physical disabilities and receive regular physical therapy through the school district. In March they switched to virtual sessions via Google Hangout. I conducted multiple observations of the therapist’s sessions with each of my children and also an informal interview to discuss their care. I also conducted a series of co-design workshops with my children to explore a therapy kit using various objects and an exercise regimen using a set of hand-made exercise cards.

Design Solution: Created new service called PTKids Teletherapy, aimed at providing pediatric physical therapists and parents with the resources they need to ensure that children with physical disabilities get the care they need in a virtual environment. The service revolves around three basic components: a specialized physical therapy kit, secure remote sessions via a website/mobile app, and parent/child exercises via exercise cards or Alexa.

Process: Conducted a variety of user research—interviews, contextual inquiries, and facility walkthroughs—with both business and field personnel to better understand the process and their needs. This research was summarized in a user research summary. Engaged in a series of co-design workshops to map out the current system, and then reimagined it to make it more efficient. Designs were shown periodically to field personnel for feedback, as well as usability tested to work out any kinks.

Design Solution: Created a new P&D Portal that allows users to see all pickup and delivery activity and issues in one place. Issues can be accessed and resolved in the issue queue. Users can filter issues or search for a specific issue. Issues are mapped based on type so they go to where they need to go. If an issue is not resolved within 36 hours, it is automatically escalated. Users can also view and edit a driver’s pickup and delivery details, as well as add notes, send messages to contracted service providers, and view and generate reports.

Process: Conducted a variety of user research—interviews, contextual inquiries, and facility walkthroughs—with both business and field personnel to better understand their needs. Compared processes with how application owners expected engineers to work, and then mapped out process flows and journey maps for specific tasks. Worked with the business to create low- and high-fidelity prototypes of the ideal experience, which were reviewed and usability tested by engineers and station staff.

Design Solution: Created a new Dock Maintenance application that allows engineers to plan multiple docks, which can be changed easily by station staff during sort. Draft docks function like an engineer’s sandbox, where they can plan out a facility’s future needs. Docks are reviewed and approved, ready for implementation by station staff. Engineers can view assignments inside the application and make and apply changes easily. Future enhancements include automating processes currently handled by spreadsheets and creating an online messaging system to eliminate email.

Problem: How do we communicate and package FedEx’s design standards in a way that will be used by dozens of IT teams and business units, to help standardize our internal web presence throughout the company?

Design Solution: Worked with UX designers to evaluate, create and document design patterns and rules, such as colors, typography, iconography, forms, error messages, tables, cards, and so on. These elements were then packaged into a comprehensive style guide in Sketch, complete with examples of their use. From there, worked with the Mobile Core Team to analyze and translate those design patterns into the technical space, either by incorporating existing libraries like Material, or by creating custom Angular components and SASS libraries for cards, responsive tables, navigation, and forms. All components are responsive to accommodate all devices and comply with accessibility guidelines. Developers can access information via a corporate portal, or contact the Design/Core Team for personal assistance. Also created educational materials, including a corporate-wide Tech Talk, to help educate developers on proper coding standards.

Project Background: With its robust, experienced network of advisors, Stifel is one of the top full-service investment firms in the country. But in a world where consumers are proliferated with a variety of options for investment services and where technology is king, Stifel has come to a crossroads. Stifel’s current demographic consists mainly of older men who have accumulated some sort of wealth that necessitates the use of an advisor. On the other hand, younger consumers often judge a company by its technology and prefer a do-it-yourself approach.

Problem: How can we use technology to bridge the gap between young investors and advisors?

Process: Interviewed subject matter expects to better understand Stifel’s investment programs. Created personas for prospective clients. Conducted an assessment of Stifel’s technology and social media processes. Outlined vision for enhanced technological features and social media strategy in creative brief. Created wireframes and static prototypes detailing design and functionality.

Design Solution: Built out features for new mobile prospecting app called Wealth Tracker. There prospective clients can track their investments, assets and liabilities to calculate their net worth, as well as create their own risk profile. Users are prompted throughout to connect with a financial advisor, and matching is done manually based on a user’s needs. The next iteration is to further automate the advisor connection process, as well as enhance Stifel’s social media strategy, to get younger investors in the door.

Project Background: The Santa Fe Plaza is in itself, a historical artifact. Yet, all its history seems to get overshadowed by tourism and shopping. After becoming interested in its history, I ended up taking a Walking History Tour, which turned out to be an eye-opening experience. It immediately became evident that its history has been overshadowed by tourism and shopping. Current maps are focused on shopping and restaurants, and historical landmarks are hard to see and find. Even more, I found it extremely difficult to reconcile what I discovered during the tour with tourism sites and historical records.

Problem: How can we better highlight Santa Fe's unique history?

Process: Conducted contextual inquiry to better understand how people view and use the Santa Fe Plaza, including taking a Walking History Tour. Conducted secondary research online, in books and via maps. Created journey maps to compare the current experience with the proposed experience.

Design Solution: The goal is to create a Self-Guided Walking History Tour that highlights all the historical landmarks in a way so the average person can find them and better understand and appreciate Santa Fe’s diverse and distinct history. The service revolves around a mobile application that utilizes Google Maps and GPS to guide tourists to key historical landmarks and a system of sidewalk pavers to draw extra attention.

Problem: How can we use design to aid in the transition and attachment of adopted children into their new families?

Process: Conducted focus group and survey of families who have adopted children from Bulgaria, as well as a detailed literature review of the current situation of waiting children in Bulgaria. Researched theoretical frameworks surrounding attachment, and analyzed the systemic processes governing international adoption.

Design Solution: The Bulgarian Love Patch is a third-party effort geared toward facilitating the sending of care packages from adoptive parents to their children. Parents can choose and purchase items via The Bulgarian Love Patch website. Care packages are fulfilled by local vendors in country, and delivered via charitable organizations to the child.

A care package is typically the first opportunity adoptive parents have to connect with their children. The goal is to provide items that can function as comfort objects to aid with parental attachment and child transition. All items are locally made in an effort to develop relationships with local vendors, and ultimately, are geared toward providing the children with a keepsake that they can take with them to their new life.

Process: Interviewed subject matter experts for the various incentive products. Created personas for all user types. Inventoried features and components, including breakdowns by product, user type and client. Conducted card sorts to ensure navigation is intuitive regardless of product and user type. Researched content management systems to ensure page/content types and functionality will work across all pages. Created wireframes, with breakdowns by persona, to ensure they work for all products and user types. Created both static prototypes (Sketch/Invision), with breakouts detailing branding/color customization, and HTML prototypes to detail interactivity and responsiveness for mobile devices.

Design Solution: Working with product management, designed a client portal for the MTZ Incentive Program. Creating a multi-lens product that is also customizable requires a different design approach. Flexible navigation, reusable design components, consistent UX patterns, and page templates enable the site and pages to easily adjust based on product and user, while content management and administrative capabilities allow the site to conform to a client’s brand and colors. Pages are also accessible on mobile devices.

Problem: How do we enhance our behavioral health member site so it can provide a more seamless experience between our customers and their members?

Solution: Redesigned Magellan’s member website to a simpler look-and-feel and more universal, generic layout. All customers get the same layout and color allocation, but using a CSS-based customization engine, they can change the color palette, banner, and menu format to more closely mimic their look-and-feel. Colors and images are specified via an internal application. Customers can bypass the login via a custom link on their intranet or health plan site, or they can create their own entrance pages using Magellan’s Modular Content System. This allows them to choose from a series of pre-defined templates and page components, specify their colors and banner, and add content and imagery using a content editor.

Problem:How can we use component-based design to develop our sites in a more efficient way?

Design Solution: Drove the vision and product management of a design system of visual style, UI components, UX patterns and other design concerns for the MTZ Incentive Program. Working with web developers, created a reusable grid and framework of UI components. These requirements were outlined in a UI kit and translated into SCSS and Polymer for developer use. On the design side, these requirements were translated into a robust Sketch symbol library. Symbol names and design patterns directly correlated to CSS class names and HTML components to ensure easy cross-team communication and transfer of projects between design and development.

Problem: How can we redesign the member website so members can understand and utilize their program effectively?

Process: Conducted interviews/focus groups with the business and subject matter experts to better understand the issues they face in getting members care. The results of this research--as well as surveys, analytics and call center statistics--were compiled into a problem highlights document, which outlined the various problems members and the care team face throughout the process and how the member website might be used to resolve some of those issues. This information was then used to create Agile epics/user stories, a new information architecture, wireframes, and a low-fidelity prototype.

Design Solution: Due to the nature of this audience, it was determined that the majority get care via a caregiver or the state. As a result, designs were geared toward both the member and a third party, such as a caregiver or MCC staff. Initial views were designed around new or inexperienced members, with a focus on understanding and effectively using the services that are available. More experienced members can sign in to view their care plan and medical history and stay in touch with their care team.

Project Background: Magellan handles behavioral health services for a variety of Medicaid accounts. In an effort to bring up websites quickly and efficiently, the websites for these accounts were packaged as one template, with differences for colors, imagery, and menu. However, since Medicaid contracts vary widely from state to state, this system proved to be inadequate, either requiring new development or jerry rigging. This, in turn, resulted in a less than optimal user experience.

Problem: How can we redesign our Medicaid sites so they can be developed quickly, yet are flexible enough to cater to each contact’s specific needs?

Process: Analyzed the current sites to determine usage patterns. Interviewed the business to determine issues and inadequacies. Cataloged all the content on all the sites to determine items that were universal, as well as one-offs. Created a sample information architecture, site maps, wireframes and storyboards showing layouts and flows of the new site. Created prototypes illustrating how the new design would work for different accounts, and worked with the business to make sure that the design and structure accommodated their specific needs.

Design Solution: Architected and designed a new Umbraco-based modular content system for Medicaid accounts. They all share a basic, flexible template, with customizable components. Home pages can work for simple, marketing-style layouts, or for more complex, portal-type layouts. Additional components can be added as needed, and the system can accommodate both basic behavioral health and health plan configurations. Websites can be brought up with minimal IT involvement, follow the brand, and are 508 compliant and mobile ready.

Design Solution: Redesigned the provider search application so it’s more streamlined and user-friendly. Members can view additional information on provider specialties, demographics, licenses, and publications; research providers’ clinical scores, which are based on a provider’s retention rate, availability, and overall member satisfaction; review provider profiles, which include a picture, small description and personal attributes (similar to LinkedIn); and add and research reviews by other members. If a member chooses a provider, they can immediately begin a referral to see that provider. They can also download their results into a printable PDF.

Proposed Design Solution: Created a new brand, print materials and Web site, all geared around the idea of resolving the school’s communication problems. All print materials are designed to drive traffic to the Web site, which is the centerpiece of the school's communication strategy. There parents can view latest announcements, access a social media channel and weekly calendar—with the ability to save the events to Google or Outlook—and sign in to access their child’s academic records. School staff can also push events via email or text.

Problem: How can we improve post-treatment communication and care for families after their child leaves the hospital?

Process: Conducted informal interviews with families of children who have undergone procedures in the hospital and created parent persona. Conducted secondary research of hospital programs both before and after a child is released from the hospital and created process flows and journey maps detailing parent/child experiences for both after hours emergency and non-emergency situations.

Proposed Design Solution: Created new service called LifeLink, a program that provides families with post-treatment care after their child leaves the hospital. Each family is assigned a LifeLink coach, who is their link to the hospital, and stays with them throughout the post-treatment process. Coaches meet personally with family before discharge and follow up within 24 hours. Parents receive information and resources via the LifeLink guide or mobile application. Family members can message their coach 24/7, which will then triage those message to the appropriate medical personnel. They can also search for specific resources for meals, transportation, medical assistance, financial assistance, educational services, child care, therapy services, support groups, charity groups, and other services.

Project Background: Infertility affects approximately 11 percent of women and 9 percent of men of reproductive age. The quest to get (and stay) pregnant can be long and painful, impacting one's mental health--especially if that quest resulted in pregnancy loss or was ultimately unsuccessful. Unfortunately, fertility clinics seem to focus only on one thing (getting patients pregnant) and are typically poorly equipped to address the psychological impact of treatment, failed attempts, and loss.

Problem: How can we provide better support to couples going through fertility treatment?

Process: Pairing with another researcher, conducted informal interviews both with women and partners who have been treated for infertility. Created before and after system diagrams showing how each party views the infertility process and their respective social networks, as well as journey maps walking through this process.

Proposed Design Solution: Rather than suggesting simple design solutions, this project proposed shifting the paradigm of the infertility system by equally integrating the mental and physical health concerns of the patients and their partners who embark on this difficult journey. This means including psychologists on fertility clinic staff, including behavioral interviews as part of onboarding, and prescribing mental health treatments as necessary.

Design Solution: Designed a web-based toolkit for medical providers. Providers can access condition-specific materials and a training library on a variety of subjects, such as best practices, depression, ADHD, anxiety, domestic violence, grief and loss, suicide prevention, and teenagers and substance abuse. They can also make referrals to a behavioral health provider, contact a special liaison with questions or schedule a consultation with a Magellan specialist.

Design Solution: Creating a new portal for all providers. All providers will go to a single entrance point. Content, menu and functionality will vary based on provider permissions. This will allow a behavioral health provider to continue to have the same access to what they have today, while a primary care physician will be able to prescribe radiology tests and specialty medication via the same portal. All members will have a central record, which will allow providers to complete multiple tasks for a member (view benefits, get an authorization, and view claims) easily. All content will be relayed just in time. For example, if a provider is getting an authorization for a heart CT scan for a member who lives in California, he will have ready access to those specific clinical guidelines and other needed information. In addition, in an effort to spur expanded usage of provider search by members, providers would be issued a scorecard and encouraged to complete their profiles online.

Problem: How can we create an online grocery shopping experience that uses the senses to hook people in and get them to explore, similar to what they would experience in a physical store?

Process: A competitor analysis showed that the majority of competitors treat buying groceries online the same as any other product. However, a trip to a local Dierbergs store showed that buying groceries isn't so simple. As a result, I created an interview guide to help evaluate shoppers’ behavior in store and find ways to emulate that behavior online. Proposed research consisted of a short interview and a contextual assignment based on a series of tasks.

Design Solution: Created wireframes and storyboards showing how the online shopping experience might work. People can bgdse by item or by dish. Bgding by item, such as spaghetti, displays not only actual food items, but also recipes. Bgdsing by dish presents visitors with a recipe, similar to what you would find on a recipe site, complete with a list of ingredients and side dishes they can choose from and add to their cart. People can also create their own shopping list--either through the website or a corresponding mobile app--and also do quick reordering from their shopping history. The goal would be to create a smart app that serves up choices based on a person's tastes and style.