Page 1

Faheem Quadir

User Experience Design Portfolio


Contents 1. Desk Lamp

A lighting project I worked on few years ago where I designed and built a functioning prototype of a lamp.

2. Smart City App

My first venture into creating an app prototype, based on improving the experience of cyclists in the city.

3. Plant Propagator

An A-level assignment in which I produced a prototype which enabled young professionals to grow their own herbs for use in cooking.

4. Adrena - Allergy Prevention Kit

A second-year coursework assignment in which both low and high-fidelity prototypes were created of a food testing kit and app.


“DESIGN IS INTELLIGENCE MADE VISIBLE.”

-ALINA WHEELER, AUTHOR


About me Profile

Hi there, I’m Faheem Quadir. I’m a student at Loughborough University studying BSc User Centred Design, currently on placement at Ticketmaster as a UX & UI Designer. Design is incredibly important to me, as I see it to be the finest way in which people can be helped. A product can only be as good as the research that precedes it, which is why I take extra care in the initial design stages. Once I have collected insights on these findings, I begin generating ideas and iterating them based on user feedback. Further testing with low fidelity prototypes allows me to refine the concept and finish with high fidelity prototypes. I am eager to enhance my skills and apply them in a professional situation. As my academic career comes to a close, I wish to test myself in the real world. I want to push myself to become a better designer and add value to any scenario that I am placed in. Working at your firm would be instrumental in achieving this. Thank you for your consideration.

Contact me 07521289280 fquadir2@gmail.com


1. Desk Lamp ‘Lighting for futuristic city-dwellers’ Brief: produce a working prototype of a lamp, taking inspiration from city living and architecture


Bringing Meaning Back Human beings can become bored of repeating the same interactions day in, day out. Switching on a lamp has become meaningless, with modern lamps not being versatile enough to reflect the moods of their users. There is a need for a product which reintroduces a connection between human and machine.


Ideation To generate ideas for the form, I began by vaguely expressing forms seen in modern architecture and developed these iteratively to come up a final shape. From architecture, I found a lot of cube-like forms which had sharp edges and angles faces. In some cases, I wanted the light to emanate from within so there would be a glow as it may be blinding to the user if the light is too sharp or striking. People living in cities often have tough, stressful jobs and must maintain their versatility in and out of work. The desk lamp must reflect this in its form and capability.


Product Renders

Using SolidWorks, I have created what I envision the final retail version of the product to look like. With an aluminium frame, the light will be robust, lightweight, and of premium quality. The colour changing LEDs will be within the frosted glass panels on the inside of the aluminium.


Final Prototype

The final prototype has been manufactured from Plywood, foil-coated Polypropylene, and Frosted Acrylic. All the pieces were cut on a laser cutter and joined with Cyanoacrylate or Dichloromethane. With a soldering iron, internal LED lights were connected to external ones through 4 magnetic connectors. It was a challenge to make, however I learnt a lot about technical manufacturing methods and how ideas develop and adapt with iteration.


2. Smart City App Brief: Design a smartphone app that enhances the experience of Smart City living Hunt Statement: ‘I want to understand the issues for city dwellers surrounding bicycle route options, with the aim to enhance the experience of planning a journey by bike through a smart city app’


Persona Situation

24 year old Michael Wood is a freelance filmmaker who’s just moved to London after studying at Coventry University. He lives with three friends, who all work in the city. In his free time, he enjoys cycling and tries to take part every weekend. Michael’s job takes him to many cities across the country and does not always get to cycle at leisure. He loves his job as it allows him to meet new people, enhance his skills, and explore new places.

Social Networking

Michael is an avid Instagram user and enjoys sharing his travels with friends. He is part of a close community of cyclists, who all follow each other’s journeys online. Having a presence on Instagram also allows Michael to advertise his work and find new clients.

Experience Goals

Michael wants to use an app that will help him explore the cities he visits and share his journeys with his friends. The app should have an easy interface and intuitive display, which gives him engaging cycle routes to use.

Life Goals

Michael wants to start training properly and compete in cycling races in the future. He knows that in order to do this, he must manage his time better and maintain his training even when he’s travelling. He also wants to explore the cities he travels to in a different way.

Task Goals -

Find new routes to cycle through See cities from a new angle Share his travels with friends and family Have a profile which can show him his progress

Pain Points -

Getting lost Cycling time management Disorganised interfaces Difficulty sharing experiences

“I love having the freedom to be my own boss, but when work doesn’t let me maintain my cycling I feel frustrated”


Wire-frames 1 – This screen is the loading page while the user waits for the app to load.

2 – The user will input their name and information in this part and then select ’begin’

5 – A page previewing the route and temperature will be displayed. Location of the user will be shown at the top and an icon giving the type of weather will be shown next to the temp.

6 – In this part of the user journey, the user is changing their location by simply clicking on the heading which will convert to a drop down menu which shows them the saved locations.

3 – Screen 3 is the home page and has three options on it; my profile, new journey, and settings.

7 – This page is now showing the correct location and the user can proceed to the main map view.

4 - The slider page allows the user to determine how long and how far they would like to cycle.

8 – The last page shows the full route and is the main page where the user will view the map as they are on their journey.

9 – As the user finishes their journey, a modal appears allowing them to see how far they’ve cycled and for how long.


User Testing

For user testing, I used someone who is an avid cyclist and would be part of the target consumers for my app. By roleplaying the scenario of setting on a bike journey, I asked him to perform certain tasks without giving him too many hints or too much help. I used the smartphone app Marvel to quickly mock up an interactive version of the wireframes. This method answered some of my questions and allowed me to understand how a user will respond to the layout of the app.


Final Screens

I designed the app to be used in conjunction with iOS, where the user can navigate through with gestures and a return button. Using the industry standard software Axure RP 8, I was able to create the aesthetics and interactions that I had envisioned through the wire-framing process. You can visit the app yourself through https://mjasni.axshare.com

When developing the final prototype, I created several screens that would show a meaningful user journey. The user would set parameters for their route, change the location they were in, and then proceed with the journey.


3. Plant Propagator Brief: Develop a working prototype of a product which solves an issue pertaining to a specific group of users Chosen group: Young professionals, living in small apartments, who want to grow their own herbs to use in cooking


Ideation and Development


Scenario of Use

1 – The domes are first removed so the plants can be accessed for fertilising or clipping

3 – The domes are placed back, and the user can put the propagator in a windowsill where they will wait for the plants to grow

2 – Water can be poured into the middle which will flow into the soil base and slowly be absorbed


Final Prototype The final prototype was manufactured from acrylic, where clear pieces were used for the domes, and solid white for the base. The clear polygons were all connected using dichloromethane and Tensol was used for the base. All pieces were cut out using a laser cutter. The body of the product was formed in layers of sheet acrylic. This allowed for the green stripe to be consistent throughout. The domes were based on an existing geometric shape and then adapted to have a flat bottom. Every side of every polygon was sanded at an angle so it would connect with either a pentagon or a hexagon, and then stuck together.


4. Adrena

Allergy Prevention Kit - Physical and Software Prototypes Brief: Identify an opportunity for an IoT product for which the industrial design and software interface are dedicated to a clearly defined context.


Finding a Focus Knowing that I wanted to focus on healthcare, I looked at the kinds of issues people with health issues face relating to their medication. Amongst them I found; complacency, lack of instruction, and difficulty keeping things discreet. I decided to focus on developing a product which aids allergy sufferers in staying safe and curing a possible reaction. As a nut allergy sufferer myself, I know how difficult it is to be sure if a food product is safe. By creating food testing capsules alongside an auto-injector, I hope to solve this problem.


Wire-frame User Testing

To truly be an IoT product, the testing kit will connect to the user’s smartphone and increase its functionality. The display for the food testing procedure will be shown here, as well as instructions for the auto-injector. An ambulance can also be called through the app in the event of an allergic reaction. Here, I am taking users through the process of the app using low fidelity wire-frames. Useful insights are gained from this such as improvements to button layout and user journey structure.


High Fidelity Prototyping

Once user testing with low fidelity wire-frames was complete, it was time to begin protoyping these changes in high fidelity software. I used Sketch in conjunction with Invision to create both the interactions and screens. Above you can see a sitemap illustrating what the screens look like where the blue arrows are the different interactions between them. As this is the first high-fidelity prototype it will need to be tested by users and then iterated with the results of the tests.


Final App Prototype The high-fidelity prototype was completed over 2 weeks and is available at: https://tinyurl.com/y5xpdyts


Form Development

For the physical product, sketches were used to explore form and to settle on a few ideas. Foam models were then created to understad the ideas’ physicality more. This process allowed me to realise that some models would be too bulky and needed to be reconsidered. Another round of foam modelling refined the original idea into a form that could be taken forward to user testing


Product Manufacture

The final model was made from a mixture of 3D printed ABS and Prolab. After filling the gaps and indents with filler, I carefully sanded down the surfaces until they were ready to prime. Inserting magnets into the circular slots allowed the pieces to stick together and work as if they were a working prototype.


Final Product Prototype


User Testing Now the prototype was completed, I performed some high-fidelity user testing with a number of people. By asking them to complete a set of tasks where they would use the equipment to mimic how they would test food or use the auto injector, I was able to assess how well my app was suited to these tasks. I was also able to determine if the sizing of the physical product was adequate and whether the users could easily understand the app. The results where positive and showed the users could easily navigate the app and use the equipment.


CAD

Featured is a selection of some of the CAD work I have produced. In my free time, I experiment with SolidWorks to make aesthetic images of products which are mostly my own designs. This is a hobby but also allows me to improve my CAD skills.

Profile for Faheem Quadir

Faheem Quadir - Portfolio 2019, Loughborough Design School  

Hi there! I am a second year User Centred Design student at Loughborough University and this is my design portfolio. Please take a look thro...

Faheem Quadir - Portfolio 2019, Loughborough Design School  

Hi there! I am a second year User Centred Design student at Loughborough University and this is my design portfolio. Please take a look thro...