Groove is a Music Playback app with streaming services. You can discover new music , add music, and create playlists that suit your mood. It is available in PC, iOS, Android, Windows Phone, and Xbox One. I love music in all its forms and have a deep conviction that with Groove, music can and will impact our customer’s lives unlike any other content.
I am responsible for helping articulate and deliver new delightful visual experiences across multiple form factors and communicate my ideas using a wide variety of methods-from sketches to prototype pieces. I ideate through sketches and whiteboard my ideas. From leadership feedback and usability studies, I revise the flows. Afterwards, I either do the visual design or work with a visual designer in order to create the right feel of the feature following the design guidelines.
Features I have been involved in : OOBE UX, Taste Profile UX, Easy Playlist Creation UX and Visuals, and more to come.
I usually deliver high level wireframes of the flows of the feature. I create a powerpoint with the flows which I give to the PM and back end developers. Once the visual design is approved. Then, I create the redlines, which depict pixel by pixel the visual design. I give the pngs to the front end developers and work in an agile format.
I worked as a Lead UX Designer for a pharmaceutical company in México. The concept was to allow a user to order and get home delivery of their prescription drugs online. It got some complexity by thinking who can be allowed to get the drugs and the user needed to turn in the prescription. Also, considering that in México, most people use SMS and whatsapp for contacting customer service, how to incorporate that into the app.
I collaborated with my client frequently to know the technical considerations. I started by creating a flow map of the application. Afterwards, I created the IA and nailing down the content. After being aligned with my client, I started to do wireframes for mobile. Then desktop, once the flow was approved. I created my wireframes in Sketch.
I created an indesign deck explaining my strategy and the IA map flow. I later exported my wireframes into a prototype using InVision , both desktop and mobile. I was able to show the prototype to my client, and the client to present to the prototype to the branding agency.
Mexican Invoicing web page and branding responsive web page to physical stands.
I created the logo going through multiple iterations with the President of the company. I wireframed the content that was necessary for the web page. After knowing the architecture and the pages, I started the visual design. I hired vendors to create the front end, which I communicated often in order to revise everything.
I delivered the front end to our back end developer, who was able to make it live. I turned in the logo pngs, and created the stands which I delivered in an ai file.
Hipos.com is an online financial supermarket in MexicoThe purpose of this site is to help users understand what is necessary to get a mortgage, credit, and insurance. I was in charge of creating a complex online tool for users to compare and apply to products they offer setting up a login account.
Hipos.com was a very complex project because there is no financial or online culture in México. It is the first online supermarket financial store in México; therefore I had to make the words and design extra user friendly since the users understand nothing about finances.
I started out by focusing on their biggest product, mortgages. I gathered competitive analysis. I analyzed and negotiated with the client on all the requirements that are needed in order to apply online. There are too many fields that are required. We wanted to give the least amount of forms, so the user wouldn’t get annoyed or confused. I created 4 different flows and collaborated weekly with the client to ensure we were going on the right path.
I delivered 4 different flows with their respected wireframes, as well recreated their Public Home page and their blog. I was involved in the graphic design process and html to ensure the content was correct.
I worked in a complex native and responsive application for one of the largest healthcare insurance companies. We were around 12 team members including LXAs, and project managers. I was the main UX designer for the native app which influenced the content in the responsive side. The application included from looking at doctors in your coverage based on symptoms, and specialities to looking at the coverage, bills, and prescriptions. It was in an agile process which made it easier to design something feasible.
I collaborated with the LAX to analyze the content, build the AI map, and create the user flows. From collaborating with the client to make sure the content was not missing anything, we started to create the wireframes. We would have meeting with the stakeholders and developers in order to have validation on the wireframe and move to the next sprint. Having daily standups, the developers were advised when they were getting designs. It was a fast moving project. A lot of transparency and collaboration was needed to make it successful in this agile project.
We created omnigraffle annotated wireframes highlighting the differences in android and iOS. Delivered them to the client and the developers. Also, I would deliver them to my internal team, the visual designer and the other ux designers in charge of the responsive website.
Participated in a Retirement Readiness Tool for a large retirement company. I participated in the project by being the main ux designer designing wireframes for the managers side of the tool, which let the managers know how their participants where doing based on data visualizations. I collaborated with the business stakeholders and the client’s visual design team.
Created IA map for the retirement tool and started wireframing. I had to study their Design guidelines since the designs need to be made around those restrictions. I had to research a lot of data visualization in order to create the right graph for the right content.
I presented the annotated wireframes to the business stakeholder until validate and delivered them to their visual designer once they were validated.
Designed the mobile web experience for the ecommerce Cabelas.com by participating in an agile process delivering wireframes and visual design.
We were able to to move in quick sprints since the stakeholders had already prepared a document with the business requirements. We (my coworker and I) created a site map, user flows, and user interviews to make sure we were getting the content the user needs.
We would have daily stand-ups with the developers and QAs. We worked in sprints creating wireframes, getting validation, creating the visual design and delivering it to the business stakeholders and devs.
The McGraw-Hill majors biology group was looking to better define the nodes concept of learning, which is a non-linear pattern digital experience. We explored how students could interact with a digital evolution of the traditional textbook. Under specific study was whether the “nodes” concept, proposed by McGraw Hill, was an effective and natural manner for studying biology in the context of higher education classes, and how the “nodes” model might be visualized in practice to provide the most value to students and teachers.
We, my 2 coworkers and I, created customer insight, concept and interaction design, and visual design. The insight phase of the project entailed several in-context interviews with students, professors, and a classroom observation session. The purpose of this phase was to gain an understanding of how students learn with their book, how the “nodes” concept would fit into current education practices, where it would be disruptive, and understand how it would work in practice. The insights helped understand and lead to a concepting and interaction design phase.This phase was to explore different ways of making the concept real. Concepting and interaction design was done through collaborative brainstorming among the team and with McGraw Hill. We produce design artifacts such as interface sketches and wireframes for use in concept validation research and internal socialization of the “nodes” concept.
We delivered a document with all of the analysis and synthesis of findings from interviews and interaction design concepts. We presented the findings and concepts with to the client.
Health Insurance Card Maker
In a period of two months, I was part of a team that engaged with a company that makes plastic cards. The client wanted to focus on a new product to create faster and efficient healthcare cards. I engaged in a 2-day workshop with the client to ensure that the entire stakeholders were aligned on the goals, objectives, and target users of the card design project. The overall goals were to create a generic healthcare card design application that is easily configurable/customizable for multiple card design processes. Optimized for iPads, tablets. and desktops that reduce internal process inefficiencies (redundant data, multiple users, time/steps to get to production) and ultimately the head count.
To begin, we broke down a sample Cigna insurance card into its component data elements. We then created categories that covered most types of information and organize them as a group to arrive at a common understanding of the types of data we’d be working with. After sorting the data elements into their respective categories, we visualized how they were defined, and whether they were applicable to all health plans, or only specific types. While this is almost certainly an incomplete list, it helps us understand the types of data we need to ask users to enter directly, and what we can expect the application to pre-populate.
PROCESS AND DELIVERY
Once we had a general understanding of the data elements included on an insurance card, we re-constructed a loose layout to give ourselves a starting point for how the live preview would look in the Card Design Prototype. Workshop participants came together to craft a high-level scenario that exemplified the “happy path” that a salesperson might take when designing a card for a major customer. After gathering the “happy path” , I began to create digital wireframes on illustrator. We would have revisions with the client once a week in order to create the best interactions with the right content. Out final deliverable was an experience framework in a pdf with annotations.