Pablo- Alejandro Quiñones User Experience Portfolio
About Me My name is Pablo I specialize in User Experience Research & User Interfaces I am passionate about User-Centered Design I believe research and design together lead to stronger products and services I studied Psychology (BS) and Information Science (PhD)
Process I believe in the power of research and design to positively impact technology and interfaces to empower their users. I am a researcher by training, but I have also worked in interface and interaction design. I believe in evidence-based design, by which I mean design based on a foundation of data quantitative and qualitative. The role of research is to guide design and to evaluate changes to ensure that the designs and features we create are both powerful and useful/usable. I understand how to collect data from stakeholders and users alike. I am comfortable using both qualitative and quantitative methods to understand what people need. As an advocate for the user, I can bring my experiences to stakeholders to balance the needs of both. I believe in spending time on formative research to understand user needs, while also ensuring quality through ongoing user testing. Discovery Requirements Gathering Marketing Research Competitor Analysis Heuristic Analysis User Research Needs Analysis Task Analysis Qualitative Research Quantitative Research User Experience Personas Scenarios User Journeys Storyboarding Usability Experiements A/B Testing (& Surveys) User Testing/Walkthroughs Follow-up User Logs Analysis Interviews Surveys Concept Requirements Gathering Strategy Information Architecture Content Strategy Interaction Design Conceptual Sketches Branding Prototyping Wireframes Mockups Hifi/Lofi Prototypes Finalization Visual Design Coding (HTML/CSS, etc.) Iteration Adaptation Reskinning Rebranding Collecting Feedback
Requirements Strategy Wireframes Process I like to keep my design process simple. + I gather requirements + I conceptualize whats the solution entails + I collaborate to establish a strategy for the project + I provide wireframes and prototypes + I advocate for what I think will enhance the user experience + I collect feedback before settling on a design + I provide design assets and style guides (if I am not coding) Prototypes Testing Iterate
UX Concepting
Communicating via Sketches For any project, I usually start with sketching. In addition to sketching for current projects, I also often provide sketches for new projects that are being pitched.
UX Web-based Design
Web-based Dashboard Dates: Jan-Feb 2017 In the discovery phase, I led a discovery workshop with the client and conducted interviews with potential users. As a follow-up to the discovery work, I created storyboards and diagrams to illustrate users problems and desired outcomes. Problem: Doctors and nurses often prescribe a medications not knowing for sure if a it is covered by a patient s insurance plan. Goal: To design a dashboard for users to search for a medication and see information about insurance coverage.
Web-based Dashboard The first step of designing the site was to establish the different screens that a user should see as well creating a flow for the functionality of the application. Left: Sitemap for Project Dash Right: User flow for Project Dash
Web-based Dashboard After discovery was completed, I created wireframes for how the web-based dashboard should be laid out. Annotated wireframes describe functionality to the development team. Left: Annotated wireframes Right: Sample of tablet wireframes
Redesigning a pharmaceutical Website Problem: Client s existing website had a number of usability issues that needed to be resolved Goal: To address usability issues in time for an upcoming product launch. After usability testing and competitive analysis, I helped establish the information architecture and then started designing. Top Left: User Persona Top Right: Competitive Audit Bottom: Site Map
Redesigning a pharmaceutical Website ISI Prescribing Info Medication Guide Lorem ipsum IFU Text Size Key HCP Site Login/ Register Important Safety Information Do not take BETASERON (interferon beta-1b) if you are allergic to interferon beta-1b, to another interferon beta, to human albumin, or mannitol. See additional Important Safety Information Below BETACONNECT BETAPLUS BETAPLUS Why Register for Why Taking Taking BETACONNECT Resources Resources BETAPLUS BETASERONBETASERON BETASERONBETASERON System AutoInjector Support Program BETASERON? AutoInjector Support Program ISI Prescribing Info Medication Guide Lorem ipsum IFU Text Size Key HCP Site Login/ Register Important Safety Information Do not take BETASERON (interferon beta-1b) if you are allergic to interferon beta-1b, to another interferon beta, to human albumin, or mannitol. See additional Important Safety Information Below Why BETACONNECT BETAPLUS BETAPLUS Register for Why Taking Taking BETACONNECT Resources Resources BETAPLUS BETASERONBETASERON BETASERONBETASERON System AutoInjector Support Program BETASERON? AutoInjector Support Program Choosing a Therapy is an Important Decision. Be informed. Videos and Resources Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque. Videos Videos and Resources Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque. Doctor Discussion Guide Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque. Now Playing: Look who s talking about RRMS BETAPLUS Patient Support Program Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. XXX-XXX-XXXX SIGN UP for BETAPLUS Glossary of Terms Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque. Injection Training Frequently Asked Questions Lorem ipsum dolor sit amet, consectetuer ` elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque. Start a Discussion Questions? Call 1-XXX-XXX-XXXX Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec id justo in tortor imperdiet aliquet. Sed nec mi nec lacus consequat. SIGN UP for BETAPLUS Indications Lorem ipsum dolor sit amet, consectetur adipiscing orem ipsum dolor sit amet, consectetur adipiscing. In quis vulputate tortor. Duis a vehicula nibh. Phasellus vestibulum, lectus quis congue fermentum, dui odio Lorem ipsum dolor sit amet, consectetur adipiscinglorem ipsum dolor sit amet, consectetur adipiscing elit. In quis vulputate tortor. Duis a vehicula nibh. Phasellus vestibulum, lectus quis congue fermentum, dui odio sodales. Documents Lorem ipsum dolor sit Lorem ipsum dolor sit amet, consectetur adipiscinglorem ipsum dolor sit amet. Important Safety Information Cconsectetur adipiscing elit. In quis vulputate tortor. Duis a vehicula nibh. Phasellus vestibulum, lectus quis congue fermentum, dui odio sodales. Lorem ipsum dolor sit amet, consectetur adipiscinglorem ipsum dolor sit amet, consectetur adipiscing elit. In quis vulputate tortor. Duis a vehicula nibh. Phasellus vestibulum, lectus quis congue fermentum, dui odio sodales. Lorem ipsum dolor sit amet, consectetur adipiscinglorem ipsum dolor sit amet, consectetur adipiscing elit. In quis vulputate tortor. Duis a vehicula nibh. Phasellus vestibulum, lectus quis congue fermentum, dui odio sodales. Lorem ipsum dolor sit amet, consectetur adipiscinglorem ipsum dolor sit amet, consectetur adipiscing elit. In quis vulputate tortor. Duis a vehicula nibh. Phasellus vestibulum, lectus quis congue fermentum, dui odio sodales. Porttitor arcu egestas malesuada Back to top Start a Discussion Questions? Call 1-XXX-XXX-XXXX Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec id justo in tortor imperdiet aliquet. Sed nec mi nec lacus consequat. Site Map References Terms of Use Privacy Policy Contact Us Important Safety Information Prescribing Info Medication Guide BETACONNECT Instructions for Use Dont have time to talk now? Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec id justo in tortor imperdiet aliquet. Sed nec mi nec lacus consequat. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem. Nulla consequat smassa quis enim. Donec pede justo, fringilla vel, aliquet nec, vulputate eget, arcu. Link > Link > In enim justo, rhoncus ut, imperdiet a, venenatis vitae, justo. Nullam dictum felis eu pede mollis pretium. Integer tincidunt. Cras dapibus. Vivamus elementum semper nisi. Aenean vulputate eleifend tellus. Aenean leo ligula, porttitor eu, consequat vitae, eleifend ac, enim. Aliquam lorem ante, dapibus in, viverra quis, feugiat a, tellus. Phasellus viverra nulla ut metus varius laoreet. Quisque rutrum. Aenean imperdiet. Etiam ultricies nisi vel augue. Curabitur ullamcorper ultricies nisi. Nam eget dui. Etiam rhoncus. Maecenas tempus, tellus eget condimentum rhoncus, sem quam semper libero, sit amet adipiscing sem neque sed ipsum. Nam quam nunc, blandit vel, luctus pulvinar, hendrerit id, lorem. Maecenas nec odio et antessstincidunt tempus. Donec vitae sapien ut libero venenatis faucibus. Nullam quis ante. Etiam sit amet orci eget eros faucibus tincidunt. In enim justo, rhoncus ut, imperdiet a, venenatis vitae, justo. Nullam dictum felis eu pede mollis pretium. Integer tincidunt. Cras dapibus. Vivamus elementum semper nisi. Aenean vulputate eleifend tellus. SIGN UP for BETAPLUS Indications Indications & Important Safety Information Lorem ipsum dolor sit amet, consectetur adipiscing orem ipsum dolor sit amet, consectetur adipiscing. In quis vulputate tortor. Duis a vehicula nibh. Phasellus vestibulum, lectus quis congue fermentum, dui odio Lorem ipsum dolor sit amet, consectetur adipiscinglorem ipsum dolor sit amet, consectetur adipiscing elit. In quis vulputate tortor. Duis a vehicula nibh. Phasellus vestibulum, lectus quis congue fermentum, dui odio sodales. Lorem ipsum dolor sit amet, consectetur adipiscinglorem ipsum dolor sit amet. Important Safety Information Cconsectetur adipiscing elit. In quis vulputate tortor. Duis a vehicula nibh. Phasellus vestibulum, lectus quis congue fermentum, dui odio sodales. Lorem ipsum dolor sit amet, consectetur adipiscinglorem ipsum dolor sit amet, consectetur adipiscing elit. In quis vulputate tortor. Duis a vehicula nibh. Phasellus vestibulum, lectus quis congue fermentum, dui odio sodales. Lorem ipsum dolor sit amet, consectetur adipiscinglorem ipsum dolor sit amet, consectetur adipiscing elit. In quis vulputate tortor. Duis a vehicula nibh. Phasellus vestibulum, lectus quis congue fermentum, dui odio sodales. Lorem ipsum dolor sit amet, consectetur adipiscinglorem ipsum dolor sit amet, consectetur adipiscing elit. In quis vulputate tortor. Duis a vehicula nibh. Phasellus vestibulum, lectus quis congue fermentum, dui odio sodales. Back to top Site Map References Terms of Use Privacy Policy Contact Us Important Safety Information Prescribing Info Medication Guide BETACONNECT Instructions for Use Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem. Nulla consequat smassa quis enim. Donec pede justo, fringilla vel, aliquet nec, vulputate eget, arcu. In enim justo, rhoncus ut, imperdiet a, venenatis vitae, justo. Nullam dictum felis eu pede mollis pretium. Integer tincidunt. Cras dapibus. Vivamus elementum semper nisi. Aenean vulputate eleifend tellus. Aenean leo ligula, porttitor eu, consequat vitae, eleifend ac, enim. Aliquam lorem ante, dapibus in, viverra quis, feugiat a, tellus. Phasellus viverra nulla ut metus varius laoreet. Quisque rutrum. Aenean imperdiet. Etiam ultricies nisi vel augue. Curabitur ullamcorper ultricies nisi. Nam eget dui. Etiam rhoncus. Maecenas tempus, tellus eget condimentum rhoncus, sem quam semper libero, sit amet adipiscing sem neque sed ipsum. Nam quam nunc, blandit vel, luctus pulvinar, hendrerit id, lorem. Maecenas nec odio et antessstincidunt tempus. Donec vitae sapien ut libero venenatis faucibus. Nullam quis ante. Etiam sit amet orci eget eros faucibus tincidunt. In enim justo, rhoncus ut, imperdiet a, venenatis vitae, justo. Nullam dictum felis eu pede mollis pretium. Integer tincidunt. Cras dapibus. Vivamus elementum semper nisi. Aenean vulputate eleifend tellus. Indications & Important Safety Information
ISI Prescribing Info Medication Guide Lorem ipsum IFU Text Size Key HCP Site Login/ Register Why WhyTaking Taking BETACONNECT LOREMIPSUM BETACONNECT BETAPLUS Patient BETAPLUS Resources BETASERON? LOREMIPSUM BETASERON LOREM BETASERON IPSUM BETASERON AutoInjector Device AutoInjector Support Program Support Program Customize your experience Important Safety Information Do not take BETASERON (interferon beta-1b) if you are allergic to interferon beta-1b, to another interferon beta, to human albumin, or mannitol. See additional Important Safety Information Below I am not on LOREMIPSUM Lorem ipsum dolor sit amet Lorem ipsum dolor sit amet, Lorem ipsum dolor sit amet, Lorem ipsum dolor sit amet, Selected Important Safety Information Link > Link > Link > Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Register for Resources Support BETAPLUS Program Indications Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec id justo in tortor imperdiet aliquet. Sed nec mi nec lacus consequat iaculis. Aliquam eget felis interdum, efficitur ipsum at, pretium erat. Nunc nec dictum odio. Pellentesque imperdiet dolor nulla, eget gravida neque faucibus luctus. Mauris ornare ante a metus rutrum pharetra. Vestibulum congue erat quis porttitor faucibus. Donec vulputate orci vel. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec id justo in tortor imperdiet aliquet. Sed nec mi nec lacus consequat iaculis. Aliquam eget felis interdum, efficitur ipsum at. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec id justo in tortor imperdiet aliquet. Sed nec mi nec lacus consequat iaculis. Aliquam eget felis interdum, efficitur ipsum at. BETAPLUS Patient Support Program Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. XXX-XXX-XXXX Watch video Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec id justo in tortor imperdiet aliquet. Sed nec mi nec lacus consequat iaculis. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec id justo in tortor imperdiet aliquet. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec id justo in tortor imperdiet aliquet. Lorem ipsum dolor sit amet, consectetur Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Footnote: Loren ipsum dolor sit amet, consectetur adipiscing elit. Donec id justo in tortor imperdiet aliquet. Sed nec mi nec lacus consequat iaculis. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Lorem ipsum dolor sit amet. Footnote: Loren ipsum dolor sit amet, consectetur adipiscing elit. Donec id justo in tortor imperdiet aliquet. Sed nec mi nec lacus consequat iaculis. Redesigning a pharmaceutical Website Lorem ipsum dolor sit amet consectetur I am taking LOREMIPSUM Caregiver Link > After hand-drawing wireframes, I created digitized ones in Sketch. I built a prototype in Invision. The wireframes were then used by visual designers. LOREMIPSUM and its heritage Effective Therapy. Proven Results Lorem ipsum dolor sit amet Understand Safety SIGN UP for BETAPLUS LOREMIPSUM new medical device Designed with you in mind Visual designers translated wireframes into visual design The first & only electronic autoinjector in RRMS offering: Here s what patients are saying about BETACONNECT % % % LOREM IPSUM s Patient Support Program Lorem ipsum. Dolor sit. Amet consectetur
UX Mobile App Design
Helping patients find generic drugs Mobile app After the discovery phase, I created site maps and user flows The client was an advertising agency that needed help designing an application for their client. Home Product Search GREENSTONE Mobile App (Site Map) Feedback The application needed to let a user search for a generic drug name and then find pharmacies close to them that are most likely to carry that generic. External Site Search Results Product Page PI Med guide Locate Pharmacy Save (Add to My Profile) Pharmacy Search Select Product View All Our Generics My Profile Why GREENSTONE? Feedback Terms & Privacy Select Pharmacy Pharmacy Results Log-in Register Call Pharmacy View Pharmacy Website Save (Add to My Profile) Navigation
Helping patients find generic drugs Mobile app Once the user flows were established, I created hand-drawn and digitized wireframes as a foundation for the agency s designers and developers to do their work. The client was an advertising agency that needed help designing an application for their client. A selection of annotated wireframes The application needed to let a user search for a generic drug name and then find pharmacies close to them that are most likely to carry that generic.
Target-practice Mobile app Below are some screens from the final design. The screens show views of what a user sees when they snap a picture of their target and then choose to share that photo to social media. Special considerations for design included visibility in low-light conditions as well as workflows that can take place in the short time a user has between rounds of target practice. Target Book is a marksmanship app that helps users organize and track the results of their target-shoo;ng sessions. My role was to work on the informa;on architecture and user experience, while also working on branding, designing some of the screens, and crea;ng icons. Ar;facts: Wireframes, mock-ups, prototypes, User flows
Summary
I am thorough without sacrificing speed and efficiency I work What I have to offer Projects I enjoy all opportunities to work with end users to improve their lives through technology. I tend to gravitate towards systems, interfaces, and apps that are geared towards education, health, and fitness. 13 years of experience in Human-Computer Interaction Passion for technology and users My thorough understanding of research practice: + Which questions to ask about users? + What methods will give us the right answer? + How do we present findings in convincing ways? + How do we turn research into design? + How do we take designs and evaluate them? Love of simple and beautiful design in service of the user Experience working with engineering, design, and Marketing/Sales teams I can work easily on web or mobile platforms
Contact Phone Email LinkedIn 734-277-6339 pablo.quinones@gmail.com linkedin.com/in/pabloquinones