https://vinayperi-designs.com/contact-me daily 0.75 2021-06-07 https://vinayperi-designs.com/my-story daily 0.75 2021-03-14 https://images.squarespace-cdn.com/content/v1/5f7e23546f66d963fc2f145f/1614146079880-9MAGMVYQ70BA1YDI7ZFJ/About%252Bme.jpg My Story - I am a product designer with a background in Cyber Security, who loves tackling complex design problems and make them “just work”. I believe that an interaction between a user and an interface should be seamless and instinctive. I was born and raised in India, and later moved to Virginia to get my Master’s degree. I am very passionate about understanding and solving people’s problems, especially when it comes to technology involving design and interfaces. Since I come from a highly technical field, I have had the privilege of using well-designed products and the misfortune of using badly designed products. I have always felt the urge to change the design of the products I didn’t like for the better. I feel that great user experience can change the life of the user. A poor design is like sound in movies or salt in food - you won’t appreciate it when it is done well but as soon as there is a bad sound or a lack of salt, you know it. In my free time I sketch, paint, and tell stories through pictures & movies. Scroll down to know more about me… https://images.squarespace-cdn.com/content/v1/5f7e23546f66d963fc2f145f/3863d812-93f0-491d-82eb-ab5a103dc577/My_Story_-_1+2.png My Story https://images.squarespace-cdn.com/content/v1/5f7e23546f66d963fc2f145f/14dedf52-cde8-4664-9411-a9c0d87ea495/My_Story_-_2+2.png My Story https://images.squarespace-cdn.com/content/v1/5f7e23546f66d963fc2f145f/cfae18dc-c367-43a7-8aba-94964179e147/My_Story_-_3+2.png My Story https://images.squarespace-cdn.com/content/v1/5f7e23546f66d963fc2f145f/581089c4-be67-4bee-9605-12da1aa23343/My_Story_-_4+2.png My Story https://images.squarespace-cdn.com/content/v1/5f7e23546f66d963fc2f145f/6c90abcf-33b8-4ced-93d6-15343b5bc813/My_Story_-_5+2.png My Story https://vinayperi-designs.com/resume daily 0.75 2023-01-06 https://images.squarespace-cdn.com/content/v1/5f7e23546f66d963fc2f145f/aa01d8f6-09c7-41af-a7bb-831729819344/Vinay+Peri+-+Resume.png Resume https://vinayperi-designs.com/home-3 daily 0.75 2022-05-25 https://vinayperi-designs.com/home daily 1.0 2022-06-06 https://images.squarespace-cdn.com/content/v1/5f7e23546f66d963fc2f145f/85ce8c34-3c8a-40b8-8f0d-26c7a77231be/Personal+Projeccts+2.png Home https://images.squarespace-cdn.com/content/v1/5f7e23546f66d963fc2f145f/556f78cc-9af5-4116-ba08-d19b230f446d/Professional_Work_+copy+2.png Home https://vinayperi-designs.com/home-2 daily 0.75 2022-06-05 https://vinayperi-designs.com/portfolio daily 0.75 2022-05-30 https://vinayperi-designs.com/portfolio/goodreads monthly 0.5 2021-02-13 https://images.squarespace-cdn.com/content/v1/5f7e23546f66d963fc2f145f/1610830519732-15BQFFWF6UVM1X74FEZ8/The%2Bproblem.jpg Portfolio - GoodReads - The Problem Goodreads, the largest online community for readers and the biggest such place for them to gather and discuss books seems to have stagnated when it comes to innovation. Upon discussing with many users and also reading the reviews of the app on the App Store and Play store, it is quite evident that a majority of the users are unhappy with what the app is offering. Users think that the app has not risen above the basic list making capabilities it offers and is not even good at that. The uninspiring and rather dull user interface of the app fails to attract new users or entice existing users to keep using the app. https://images.squarespace-cdn.com/content/v1/5f7e23546f66d963fc2f145f/1610832448891-Y0TEYVV43EUXLQRCZ2DF/The+Proposal.png Portfolio - GoodReads - The Proposal The aim is to build a clean and visually enticing app to try and overcome the existing problems faced by the user. The end goal is to get more users to use the app, retain existing users, and to fix the system which has a great potential for stakeholders like readers, authors, publication houses and book clubs to interact in way to make reading more fun. https://images.squarespace-cdn.com/content/v1/5f7e23546f66d963fc2f145f/1610832882326-0O7TJ2FK3N7JNWXZ4OW5/Design_process.png Portfolio - GoodReads - Design Process The process usually varies from project to project based on the needs, goals, complexity and time. For this project, I started with identifying the opportunity through research & analysis followed by concept sketching, prototyping, evaluation, iterating and finally with reviewing the impact. The design process is straightforward, intended to be simple and effective. https://images.squarespace-cdn.com/content/v1/5f7e23546f66d963fc2f145f/1622229061979-TQ2A49FSUTBRZEYVD3SH/Research+Notes+-+Miro+-+T.png Portfolio - GoodReads - Make it stand out Whatever it is, the way you tell your story online can make all the difference. https://images.squarespace-cdn.com/content/v1/5f7e23546f66d963fc2f145f/1622229324948-EH64DCHLYT7P6WXGIL08/Pie+Chart-Bigger.png Portfolio - GoodReads - Make it stand out Whatever it is, the way you tell your story online can make all the difference. https://images.squarespace-cdn.com/content/v1/5f7e23546f66d963fc2f145f/1610936245418-ZDREHDK0SR2C0ZAYKX3T/User+quotes.png Portfolio - GoodReads - Key findings One of the key complaints of the users of the app is that it needs a visual overhaul, as the dull beige colors are not very enticing. Another key finding is that the app needs to be more than just a list making place of users. https://images.squarespace-cdn.com/content/v1/5f7e23546f66d963fc2f145f/1622214533890-PTB3IGW9X4VUY2ZQUQZP/Screen%2BShot%2B2021-01-07%2Bat%2B5.21.35%2BPM.jpg Portfolio - GoodReads - Make it stand out Whatever it is, the way you tell your story online can make all the difference. https://images.squarespace-cdn.com/content/v1/5f7e23546f66d963fc2f145f/1622389565997-BVLBPUX4AUT5UELVV14L/Sketching+the+Concepts.png Portfolio - GoodReads https://images.squarespace-cdn.com/content/v1/5f7e23546f66d963fc2f145f/1622389468745-GIXR26837ENYX0G1LCVN/Wireframes.png Portfolio - GoodReads https://images.squarespace-cdn.com/content/v1/5f7e23546f66d963fc2f145f/1610899467801-HAKMR1VHCKL92QXAJABF/Design+Critic.png Portfolio - GoodReads - Design Feedback Getting an honest review is truly a blessing, as it gives us a chance to go back and make improvements to the app which in turn helps the users at large. After creating the lo-fi prototype I took my designs for a critique session with the people I have surveyed and interviewed, and their constructive criticism helped me in the later stages of the redesign. Many users pointed out how cluttered some of the buttons were and some of the users requested for a better way to view the private reviews as they said It was not very efficient to search for every book separately and look for private notes on each book. https://images.squarespace-cdn.com/content/v1/5f7e23546f66d963fc2f145f/1610908259979-XKCZUTIJ6VZP16EBWIOA/Accessibility+.jpg Portfolio - GoodReads - Accessibility Improvements To increase the accessibility features of this app I had to look closely for any design choices I have made that would put people with special needs at a disadvantage. One such design choice I came across is the bundling together of the thumbs up/down buttons and the share button. Looking at it, I noticed that all three buttons are very small and quite close to each other making it difficult for people to see and tap them, sometimes even leaving to mis-taps. Therefore I moved the Share button to the top of the screen making it a counterpart to the Back button and then increased the space and the size of the Like/Dislike buttons. https://images.squarespace-cdn.com/content/v1/5f7e23546f66d963fc2f145f/1622231738199-6L909F6F6FM2ZQ3CX361/HIFI+Prototypes.png Portfolio - GoodReads - High-Fi Prototypes An easy way for me and the people who are giving me feedback to visualize the end product is to create High-Fi prototypes. Colors, textures and font go a long way in communicating the designer’s intentions to the stakeholders. I included the private reviews under “My Library” section in the tabbed view, which I split into “My Bookshelves” and “My Reviews” using a segmented view. When users go to the “My Reviews” section they are shown all the reviews they have ever written, which are categorized as public or private. Here the user can always turn a private review into a public one and vice versa. https://images.squarespace-cdn.com/content/v1/5f7e23546f66d963fc2f145f/1610914832754-34WA8J4JQO74F4OTEJWG/2nd+critic.png Portfolio - GoodReads - Second round of feedback Having a prototype which is a bit closer to the end product helped the users to give me more constructive feedback and criticism, which helped me go back to the drawing board again to make the required changes. Many were not happy with the minimalistic usage of colors and the light background, there was a demand for departure from colors which already existed in the app currently in use. Also some of the users asked for an option to write either public or private reviews. https://images.squarespace-cdn.com/content/v1/5f7e23546f66d963fc2f145f/1622243384295-77J7JAWXB8TPN7NXENJY/M+Screen.png Portfolio - GoodReads - Make it stand out Whatever it is, the way you tell your story online can make all the difference. https://images.squarespace-cdn.com/content/v1/5f7e23546f66d963fc2f145f/1622243256509-4VFE4I2RTTJ2NG9IDBRG/H+Screen.png Portfolio - GoodReads - Make it stand out Whatever it is, the way you tell your story online can make all the difference. https://images.squarespace-cdn.com/content/v1/5f7e23546f66d963fc2f145f/1622243466043-CZLG37WEYZ47QKPQ58P1/SB+Screen.png Portfolio - GoodReads - Make it stand out Whatever it is, the way you tell your story online can make all the difference. https://images.squarespace-cdn.com/content/v1/5f7e23546f66d963fc2f145f/1622243157347-KOEBF629DTVPU4YEEJH6/PF+Screen-1.png Portfolio - GoodReads - Make it stand out Whatever it is, the way you tell your story online can make all the difference. https://images.squarespace-cdn.com/content/v1/5f7e23546f66d963fc2f145f/1622243785249-N7H1RZEBXTZVZS9WYGQM/Impact.png Portfolio - GoodReads - Make it stand out Whatever it is, the way you tell your story online can make all the difference. https://images.squarespace-cdn.com/content/v1/5f7e23546f66d963fc2f145f/1622244882006-K5EL4YV3172DHDLZRJFC/Bad+UX%3AUI.png Portfolio - GoodReads https://images.squarespace-cdn.com/content/v1/5f7e23546f66d963fc2f145f/1621435981794-C0U9DKBQLUTI75YJTHBW/Hero%252BShot%2525402x.jpg Portfolio - GoodReads https://images.squarespace-cdn.com/content/v1/5f7e23546f66d963fc2f145f/c6261500-46c7-4cd3-b68c-ac39982a611b/FI+Images.png Portfolio - GoodReads https://vinayperi-designs.com/portfolio/surprise-me monthly 0.5 2022-05-25 https://images.squarespace-cdn.com/content/v1/5f7e23546f66d963fc2f145f/1605527119186-CA7GABWASYOP2108GB77/Untitled_Artwork+%2858%29.png Portfolio - Surprise Me - The Proposal … The goal here is to build a simple, intuitive, and functional feature called “Surprise Me” which selects destinations for indecisive travelers after a quick walkthrough of their preferences, including distance from home, budget, and dates. https://images.squarespace-cdn.com/content/v1/5f7e23546f66d963fc2f145f/1605527330616-7BX4SX4JHPDK1IUBN37R/Untitled_Artwork+%2859%29.png Portfolio - Surprise Me - Design Process Starting from identifying the opportunity through concept sketching, prototyping, evaluation, and iterating, the design process is quite straightforward, intended to be simple and effective. The only step where I faced a hurdle was in determining its impact on a large user base. https://images.squarespace-cdn.com/content/v1/5f7e23546f66d963fc2f145f/1606417087963-HT4VAIYBIGI43AS1BLGX/Untitled_Artwork+%281%29.png Portfolio - Surprise Me - The Interviews… After selecting the right people through the survey and screening questions, I interviewed many travelers to determine how exactly they make a decision to travel or not and if they do, what the foremost things they consider are before making that decision. https://images.squarespace-cdn.com/content/v1/5f7e23546f66d963fc2f145f/1606417063861-X7XEA9QQPEI2SJC6LZZS/Untitled_Artwork.png Portfolio - Surprise Me - The Survey… I started by making a list of survey questions to determine the right user to interview. The users who I could see this feature being most helpful to are those who either used to travel a lot or love to travel in general but are unable to make that decision now in an everchanging travel world. The keyword is indecision. How many people always know where they want to go and how many spend a lot of time just trying to decide where to go because of either too many or too few options? https://images.squarespace-cdn.com/content/v1/5f7e23546f66d963fc2f145f/1605528142406-IR44UKEF1CS41QQCT1CU/Quotes.jpg Portfolio - Surprise Me - Key findings… Most people in the interviews said that they do want to travel more but end up overthinking and going nowhere due to the inability to decide on many factors, such as distance from home or zeroing in on a budget or just when to travel. The goal now would be to design a simple and intuitive functionality which is clutter free and selects the destination for the user by presenting 3 simple and easy to select options: Distance in radius. Budget range. Date ranges or an option to select things like “this weekend”, “next weekend”, “in next 2 weeks” etc. https://images.squarespace-cdn.com/content/v1/5f7e23546f66d963fc2f145f/1605529684077-B1R65MF1PPNAYZNOKQXZ/Untitled_Artwork+%2865%29.png Portfolio - Surprise Me - Design Critic … After creating the lo-fi prototypes, I hopped on a video call with the same people I conducted the interviews with and asked them for their opinions. While there were many positive feedbacks, I also got quite a few constructive criticism thereby helping me improve the prototypes. https://images.squarespace-cdn.com/content/v1/5f7e23546f66d963fc2f145f/1605529780349-U05FHKE93Z5T0F8C0N92/Untitled_Artwork_2.png Portfolio - Surprise Me - Accessibility Improvements After talking to a few people and then running tools like contrast checker, I have noticed that I could improve the accessibility features of this app. For example increasing the weight of the text where and when possible and changing the colors of the button to make them look more prominent and easy to the eye. https://images.squarespace-cdn.com/content/v1/5f7e23546f66d963fc2f145f/1605530168882-DNGW5TVMD0ZWK81VBVFC/image-asset.png Portfolio - Surprise Me - Second Round of feedback Having a prototype which is closer to the end product helped the users to give me more constructive feedback and criticism, which helped me go back to the drawing board again to make the required changes. https://images.squarespace-cdn.com/content/v1/5f7e23546f66d963fc2f145f/1605530061601-0AY5RYM4E174CFN75XIH/Untitled_Artwork+%2867%29.png Portfolio - Surprise Me - High-Fi Prototypes After the initial round of feedback from the users, I sat down to create a set of Hi-Fi prototypes which gave me and the people who were giving me feedback and easy way to visualize how the end product would look like. https://images.squarespace-cdn.com/content/v1/5f7e23546f66d963fc2f145f/1623456926321-PJ1WIYJO0U6BLYN8NRZ3/Frame%252B2.jpg Portfolio - Surprise Me https://images.squarespace-cdn.com/content/v1/5f7e23546f66d963fc2f145f/1608759769843-FBTR9N7AW2ZAUWXL70GZ/01+-+Home+page+-+Mockup.png Portfolio - Surprise Me https://images.squarespace-cdn.com/content/v1/5f7e23546f66d963fc2f145f/1614613485308-2CRTAGHTKCBEGM7LPZYV/Final%2BIterations%2B1.jpg Portfolio - Surprise Me https://images.squarespace-cdn.com/content/v1/5f7e23546f66d963fc2f145f/1605528213526-0CPDZ1II3DC72NIPVOE0/Interview+Notes.PNG Portfolio - Surprise Me https://images.squarespace-cdn.com/content/v1/5f7e23546f66d963fc2f145f/1605528978248-V2XC9TKJSPBRSWC6UPI9/Frame+2.png Portfolio - Surprise Me https://images.squarespace-cdn.com/content/v1/5f7e23546f66d963fc2f145f/1605529179679-KKV2TBCSHDIS45D0ZK2J/Untitled_Artwork+%2862%29.png Portfolio - Surprise Me https://images.squarespace-cdn.com/content/v1/5f7e23546f66d963fc2f145f/1605529445183-24NYH0ROQMGRRVSK8DFG/Untitled_Artwork%252B%25252864%252529.jpg Portfolio - Surprise Me https://images.squarespace-cdn.com/content/v1/5f7e23546f66d963fc2f145f/1608759769560-9LHN1LOHBBJG1FCY9G0N/02+-+Distance+-+1+-+Mockup.png Portfolio - Surprise Me https://images.squarespace-cdn.com/content/v1/5f7e23546f66d963fc2f145f/1605528305021-IWGWRRJ53XKDN5X5OFUS/INN1.PNG Portfolio - Surprise Me https://images.squarespace-cdn.com/content/v1/5f7e23546f66d963fc2f145f/1605528310339-YUD1EJ3EI7QTAUHJGTL3/INN2.PNG Portfolio - Surprise Me https://images.squarespace-cdn.com/content/v1/5f7e23546f66d963fc2f145f/1605529185520-WFY1TX88MIH8ZYFHHKG4/Untitled_Artwork+%2863%29.png Portfolio - Surprise Me https://images.squarespace-cdn.com/content/v1/5f7e23546f66d963fc2f145f/1608759769882-GAGE9UJ8P4JSO7YV24RU/03+-+Distance+-+2+-+Mockup.png Portfolio - Surprise Me https://images.squarespace-cdn.com/content/v1/5f7e23546f66d963fc2f145f/e4018dac-085d-4cea-aef2-f19a11e9fda2/Untitled_Artwork%25252B%2525252864%25252529.jpg Portfolio - Surprise Me https://images.squarespace-cdn.com/content/v1/5f7e23546f66d963fc2f145f/1605528317760-4Z9NQQ1DLVWY1MKQA6QA/INN3.PNG Portfolio - Surprise Me https://images.squarespace-cdn.com/content/v1/5f7e23546f66d963fc2f145f/1608759769605-3R1090MHYNOFRNO8BRBI/04+-+Distance+-+3+-+Mockup.png Portfolio - Surprise Me https://images.squarespace-cdn.com/content/v1/5f7e23546f66d963fc2f145f/1605528323272-9XRHC5KEBIXLKY0ZT6TN/INN4.PNG Portfolio - Surprise Me https://images.squarespace-cdn.com/content/v1/5f7e23546f66d963fc2f145f/1608759769600-ZKPN0JR4G1B2IAHVYLC8/05+-+Distance+-+4+-+Mockup.png Portfolio - Surprise Me https://images.squarespace-cdn.com/content/v1/5f7e23546f66d963fc2f145f/1605528330254-JTBDS4B3ZNXZC49KVEIZ/Graph.PNG Portfolio - Surprise Me https://images.squarespace-cdn.com/content/v1/5f7e23546f66d963fc2f145f/1608759769605-I3N4580UXVXSHSZR2DMP/06+-+Distance+-+5+-+Mockup.png Portfolio - Surprise Me https://images.squarespace-cdn.com/content/v1/5f7e23546f66d963fc2f145f/1608759770271-LNOAZ7Z6J0X1IK0LH7AP/07+-+Budget+-+1+-+Mockup.png Portfolio - Surprise Me https://images.squarespace-cdn.com/content/v1/5f7e23546f66d963fc2f145f/1608759770340-JCKB31BVGBLACTSF3DSC/08+-+Budget+-+2+-+Mockup.png Portfolio - Surprise Me https://images.squarespace-cdn.com/content/v1/5f7e23546f66d963fc2f145f/1608759771141-3HDRN7NZ32ED7TAGMVUL/09+-+Budget+-+3+-+Mockup.png Portfolio - Surprise Me https://images.squarespace-cdn.com/content/v1/5f7e23546f66d963fc2f145f/1608759770478-D2VJ6G6PPC9XGX9FIIEB/10+-+Budget+-+4+-+Mockup.png Portfolio - Surprise Me https://images.squarespace-cdn.com/content/v1/5f7e23546f66d963fc2f145f/1608759770622-TEOVB1I6O78M8FNUXV3G/11+-+Budget+-+5+-+Mockup.png Portfolio - Surprise Me https://images.squarespace-cdn.com/content/v1/5f7e23546f66d963fc2f145f/1608759770629-6ES1N3M1C45PFMAWXEGS/12+-+Budget+-+6+-+Mockup.png Portfolio - Surprise Me https://images.squarespace-cdn.com/content/v1/5f7e23546f66d963fc2f145f/1608759770796-PSOXIJUO2T57145TTDLS/13+-+Dates+-+1+-+Mockup.png Portfolio - Surprise Me https://images.squarespace-cdn.com/content/v1/5f7e23546f66d963fc2f145f/1608759770935-23MEAO0PUQ0W1KYI38DG/14+-+Dates+-+2+-+Mockup.png Portfolio - Surprise Me https://images.squarespace-cdn.com/content/v1/5f7e23546f66d963fc2f145f/1608759771204-XVYASEDROX8FW71QWQQT/15+-+Dates+-+3+-+Mockup.png Portfolio - Surprise Me https://images.squarespace-cdn.com/content/v1/5f7e23546f66d963fc2f145f/1608759771357-W7NTDA44IQ3G5ADL6T22/16+-+Dates+-+4+-+Mockup.png Portfolio - Surprise Me https://images.squarespace-cdn.com/content/v1/5f7e23546f66d963fc2f145f/1608759772096-ABYXWQGBUGEDK6ZYVZGH/17+-+Dates+-+5+-+Mockup.png Portfolio - Surprise Me https://images.squarespace-cdn.com/content/v1/5f7e23546f66d963fc2f145f/1608759771495-49SWM4Y0PJF5PWUV89IP/18+-+Dates+-+6+-+Mockup.png Portfolio - Surprise Me https://images.squarespace-cdn.com/content/v1/5f7e23546f66d963fc2f145f/1608759772503-Q6R9ZPLKK3JKDKKBFKUW/19+-+Dates+-+7+-+Mockup.png Portfolio - Surprise Me https://images.squarespace-cdn.com/content/v1/5f7e23546f66d963fc2f145f/1608759776385-E0MHGZP9GH1G9SDYXTGE/20+-+Surprise+Me+-+1+-+Mockup.png Portfolio - Surprise Me https://images.squarespace-cdn.com/content/v1/5f7e23546f66d963fc2f145f/1608759772737-KCR3LNGSYADPS5XZBE29/21+-+Surprise+Me+-+D1+-+Mockup.png Portfolio - Surprise Me https://images.squarespace-cdn.com/content/v1/5f7e23546f66d963fc2f145f/1608759777126-VC20ODWY06633TJ979VE/22+-+Surprise+Me+-+2+-+Mockup.png Portfolio - Surprise Me https://images.squarespace-cdn.com/content/v1/5f7e23546f66d963fc2f145f/1608759776593-47XV4Y97QN13GGXMC6D7/23+-+Surprise+Me+-+D2+-+Mockup.png Portfolio - Surprise Me https://images.squarespace-cdn.com/content/v1/5f7e23546f66d963fc2f145f/1608759777535-92GU3DT3VKY9MDYGQQ13/24+-+Surprise+Me+-+3+-+Mockup.png Portfolio - Surprise Me https://images.squarespace-cdn.com/content/v1/5f7e23546f66d963fc2f145f/1608759776996-L66116GPDBN3KKJY1VA2/25+-+Surprise+Me+-+D3+-+Mockup.png Portfolio - Surprise Me https://images.squarespace-cdn.com/content/v1/5f7e23546f66d963fc2f145f/1608759777142-ZPTA21SU6R2EH0E7C4QI/26+-+Surprise+Me+-+List+-+Mockup.png Portfolio - Surprise Me https://vinayperi-designs.com/portfolio/u-shift monthly 0.5 2021-02-13 https://images.squarespace-cdn.com/content/v1/5f7e23546f66d963fc2f145f/1608566938760-W05I026ZCCMLFXDM3TM0/Capture+-+Shits.PNG Portfolio - U-Shift - The Problem Working in a very fast and evolving field, we often had to be very flexible in our work availability times and work in shifts to cater to the demands of our clients. The everchanging work shifts due to an individual's absence or assignment to a different project often caused a lot of shift mismanagement in our team, leading to a lot of confusion and often inefficient productivity. The lack of a centralized place to view and/or request for PTO, weekend shifts and holiday shifts. The usage of local copies which an individual would often fail to update during the ever changing work shifts has lead to a lot of confusion. The inability to update the individual local copies of weekend shifts which would often change either due to swapping among the analysts or due to someone's day off. The inability of the team lead to keep track of multiple PTO requests, especially during holidays. https://images.squarespace-cdn.com/content/v1/5f7e23546f66d963fc2f145f/1605547718755-T3O78XAK8YUERJY7JMCU/Untitled_Artwork%2B%25286%2529.jpg Portfolio - U-Shift - User Feedback - The Visual Though the wireframes received mostly positive feedback with many feature requests, not everyone was happy with how the mock-ups turned out. The users were of the feeling that even though this is not a customer/client facing app and is for internal consumption only, the app’s design is very basic and is not exciting. https://images.squarespace-cdn.com/content/v1/5f7e23546f66d963fc2f145f/1605547633407-0LXNWSFGLFBKY7H2OIPR/Untitled_Artwork%2B%25285%2529.jpg Portfolio - U-Shift - User Feedback - Features Since this is a reimagination of the original web-app, I took feedback from many users. The submitted wireframes and mockup received a lot of feedback along with appreciation. For example: I designed the landing page such that the analyst could see the shifts just for the current day but my teammates wanted an option where they can select and view the shifts for different dates. In the View PTO page, my original design was that an analyst could view only their own PTO. However, my teammates wanted an option to view everyone else’s PTO and also see if their PTO conflicts with anyone else’s. https://images.squarespace-cdn.com/content/v1/5f7e23546f66d963fc2f145f/1605547791935-SXECM5L34AL4WSNK6QED/Untitled_Artwork%2B%25287%2529.jpg Portfolio - U-Shift - Back to the Drawing Board… Since almost everyone suggested a visual overhaul, I went back to the drawing board to redesign the app, right from the wireframes. When I asked the users what exactly didn’t they like about the app, they could not pinpoint an exact reason, but I thought I understood what the problem might be. I had designed the app in a way that it looks very boxy and heavy. So I went about removing the huge boxes, and information banners, making use of the negative space to highlight what is important. After more feedback, I moved the circular notification button at the top to the Tap Bar and increased the size of the segmented control in order for the users to be able to tap on them easily. https://images.squarespace-cdn.com/content/v1/5f7e23546f66d963fc2f145f/1605546912030-EQPYWPJ9MYFG2HXBBKIP/Untitled_Artwork%2B5.jpg Portfolio - U-Shift - The Struggle … After seeing the struggle for a couple of years I took it upon myself to build a tool which would automate most of the scheduling. I knew how to build a tool and which programming language to use but I did not know where to start with the design. There were many apps and the learning curve was a bit steep. https://images.squarespace-cdn.com/content/v1/5f7e23546f66d963fc2f145f/1605547194030-OTNF1G4USDAD9NI5EB77/Untitled_Artwork+7.png Portfolio - U-Shift - User Research & Flow Charts I started by making a list of what I thought the user requirements would be for this scheduler app. I came up with around 5 requirements and felt that for this web app to be very robust I needed input from my teammates, who after all, would also be the end users. After discussing a few times with everyone, we came up with a list of about 10 basic requirements for the application. Finally I created a flow chart to understand how I can address the problems and where each section would go. https://images.squarespace-cdn.com/content/v1/5f7e23546f66d963fc2f145f/1605547478030-KPMZU920CM5YH0PC5USW/Untitled_Artwork%2B%25284%2529.jpg Portfolio - U-Shift - The first Mock-ups Once I had all the wireframes ready, I also wanted to create a couple of quick mock-ups to show it to the users. I used Procreate again to give some colors to my wireframes. https://images.squarespace-cdn.com/content/v1/5f7e23546f66d963fc2f145f/1605547122080-GY75GQGXSKKWPGZ1HOBH/Untitled_Artwork%2B6.jpg Portfolio - U-Shift - When the designer is also a user…I know .. I know.. its not right, but hear me out. Even though it is not right as designers to assume that our users are similar to us or that they share our beliefs and will behave similarly in a given context. The key word here is “assumption”, I am not assuming anything. It so happened that I was a user who took it upon myself to design an app for the problem we as a team have been facing for many years. It helped a lot that I knew exactly what the issues were and what me as an individual and others as part of the team were going through. https://images.squarespace-cdn.com/content/v1/5f7e23546f66d963fc2f145f/1605547317464-V308FXI55N7LA7UB0SEA/Untitled_Artwork%2B%25283%2529.jpg Portfolio - U-Shift - Wireframes My next step was to create wireframes by drawing the basic skeletons using the Procreate drawing app. I started with the sign in page and mapped out each page, deciding which information would work best where and where I could place the interactive elements so that they would be as efficient and clean as possible. The flowchart helped a lot in drawing up the wireframes. https://images.squarespace-cdn.com/content/v1/5f7e23546f66d963fc2f145f/1608569061034-W8KO4Y4FAE4V8YKAIYDS/Frame+2+%285%29.png Portfolio - U-Shift - A Few No’s When it came to navigating through the pages of the app, I actively avoided using nested pages and instead opted for a combination of Tab Bar and Segmented Controls to display different views. When I no longer could effectively use them without crowding the screen, I used something similar to a popup page which could be dismissed by a flick down if no changes are made or tap on done if any data has been changed. It was also tempting to place shadows on all blocks of information on a page, but I intentionally didn’t do this in order to avoid placing everything at the top of the visual hierarchy. I wanted to emphasize the buttons and segmented controls, so they are the only elements which have shadows. https://images.squarespace-cdn.com/content/v1/5f7e23546f66d963fc2f145f/1605548241368-948H0XAUNP5APJNSCN2P/Untitled_Artwork+%2811%29.png Portfolio - U-Shift - Typography… Since I had to work on a Windows machine, I chose to use the font Segoe UI and then later chose Lato. Although it is different from my favorites like Helvetica or SF Pro, it was still very light and elegant, something I was looking for. Due to the relatively limited screen size of a phone, I ended up having widows in the text. Because decreasing the font size beyond a point made the text unreadable, I employed kerning or tracking to remove the widows. https://images.squarespace-cdn.com/content/v1/5f7e23546f66d963fc2f145f/1605548197570-AO2LAC8ZC2YP35KBJABM/Capture+-+Colorhunt.PNG Portfolio - U-Shift - The Colors When it came to the color scheme, I wanted to select colors which were simple and not over the top, preferably something from the same color family and are subtle and unobtrusive. I mostly stayed within the blue family and used the color white as much as possible to make the app feel light and airy. I used brighter colors to highlight the users or anything that needs to stand out. https://images.squarespace-cdn.com/content/v1/5f7e23546f66d963fc2f145f/1605546612175-36GCY91EJHKRCTDZANFL/Screenshot+2020-11-16+at+12.08.41+PM.png Portfolio - U-Shift A script used to calculate the weekend shift. https://images.squarespace-cdn.com/content/v1/5f7e23546f66d963fc2f145f/1608567038623-KNLKL9QW14575O2BSPO0/Frame%2B1%2B%25281%2529.jpg Portfolio - U-Shift https://images.squarespace-cdn.com/content/v1/5f7e23546f66d963fc2f145f/1608569315616-26SB3QS8TXCVAHNLQJX9/01+-+Launch+Screen+-+Mockup.png Portfolio - U-Shift https://images.squarespace-cdn.com/content/v1/5f7e23546f66d963fc2f145f/1605546714375-U2UITMZ28W84LQX223F0/IMG_0248.jpg Portfolio - U-Shift Weekend shifts on a text file. https://images.squarespace-cdn.com/content/v1/5f7e23546f66d963fc2f145f/1608569315568-ZIRW72VZKGBB63KP3XVP/02+-+Sign+In+Page+-+Mockup.png Portfolio - U-Shift https://images.squarespace-cdn.com/content/v1/5f7e23546f66d963fc2f145f/1608569314832-MML72M7LG81FSL06PZGM/03+-+Shifts+-+Today+-+Mockup.png Portfolio - U-Shift https://images.squarespace-cdn.com/content/v1/5f7e23546f66d963fc2f145f/1608569314978-3UUZSK32L51IHIYQ6TQW/04+-+Shifts+-+Today+-+1+-+Mockup.png Portfolio - U-Shift https://images.squarespace-cdn.com/content/v1/5f7e23546f66d963fc2f145f/1608569314862-LKZZDKOVEF07JZISB3FF/05+-+Shifts+-+Today+-+2+-+Mockup.png Portfolio - U-Shift https://images.squarespace-cdn.com/content/v1/5f7e23546f66d963fc2f145f/1608569315565-ST04FTAE63YSRMRCPYIY/06+-+Shifts+-+Weekend+-+Mockup.png Portfolio - U-Shift https://images.squarespace-cdn.com/content/v1/5f7e23546f66d963fc2f145f/1608569316354-C1WN4CY1AV5CUJ5MWT8J/07+-+Shifts+-+Holiday+-+Mockup.png Portfolio - U-Shift https://images.squarespace-cdn.com/content/v1/5f7e23546f66d963fc2f145f/1608569316905-CXQHXUY3TQKUVWN1FL48/08+-+Shifts+-+Holiday+-+1+-+Mockup.png Portfolio - U-Shift https://images.squarespace-cdn.com/content/v1/5f7e23546f66d963fc2f145f/1608569316716-T1E8657I494J26U16K0X/09+-+PTO+-+View+-+Mockup.png Portfolio - U-Shift https://images.squarespace-cdn.com/content/v1/5f7e23546f66d963fc2f145f/1608569318115-0CVAX9JF67QLSUUTSC5N/10+-+PTO+-+View+-+1+-+Mockup.png Portfolio - U-Shift https://images.squarespace-cdn.com/content/v1/5f7e23546f66d963fc2f145f/1608569317389-D86XWACDYQP06HNL2UIM/11+-+PTO+-+View+-+2+-+Mockup.png Portfolio - U-Shift https://images.squarespace-cdn.com/content/v1/5f7e23546f66d963fc2f145f/1608569317402-67G3NJEOWSTXEVRL4EHS/12+-+PTO+-+Request+-+Mockup.png Portfolio - U-Shift https://images.squarespace-cdn.com/content/v1/5f7e23546f66d963fc2f145f/1608569317668-UYILQNHCSXHPFIXWD9JL/13+-+PTO+-+Request+-+1+-+Mockup.png Portfolio - U-Shift https://images.squarespace-cdn.com/content/v1/5f7e23546f66d963fc2f145f/1608569317874-Q0O1KVVGXEF2HSXP7BLT/14+-+Search+-+Mockup.png Portfolio - U-Shift https://images.squarespace-cdn.com/content/v1/5f7e23546f66d963fc2f145f/1608569318232-2AQUGBD8MQHNH2LJDSUC/15+-+Search+-+1+-+Mockup.png Portfolio - U-Shift https://images.squarespace-cdn.com/content/v1/5f7e23546f66d963fc2f145f/1608569319401-RXCO828T8CMQOJS10HKT/16+-+Requests+-+Outgoing+-+Mockup.png Portfolio - U-Shift https://images.squarespace-cdn.com/content/v1/5f7e23546f66d963fc2f145f/1608569320162-BZQZ8WNC8NVFWJEGCP9V/17+-+Requests+-+Incoming+-+Mockup.png Portfolio - U-Shift https://images.squarespace-cdn.com/content/v1/5f7e23546f66d963fc2f145f/1608569319989-597GU2BS27YQG1MTDFWV/18+-+Requests+-+Incoming+--+2+-+Mockup.png Portfolio - U-Shift https://images.squarespace-cdn.com/content/v1/5f7e23546f66d963fc2f145f/1608569319851-4TSEFU5JNB1O8AU557DD/19+-+Admin+-+Edit+User+-+Mockup.png Portfolio - U-Shift https://images.squarespace-cdn.com/content/v1/5f7e23546f66d963fc2f145f/1608569319921-2FRTYCM833Q1OKVB6AIA/20+-+Admin+-+Edit+User+-+Delete+-+Mockup.png Portfolio - U-Shift https://images.squarespace-cdn.com/content/v1/5f7e23546f66d963fc2f145f/1608569320403-UT17C2K7ANPO5UT1JTQD/21+-+Admin+-+Edit+User+-+Add+-+Mockup.png Portfolio - U-Shift https://images.squarespace-cdn.com/content/v1/5f7e23546f66d963fc2f145f/1608569320591-97VDUD8UF3FX43FUEOVG/22+-+Admin+-+Edit+Shifts+-+Mockup.png Portfolio - U-Shift https://images.squarespace-cdn.com/content/v1/5f7e23546f66d963fc2f145f/1608569321129-UNWIFLKL081KCKVTLIVI/23+-+Admin+-+Edit+Shifts+-+Mockup.png Portfolio - U-Shift https://images.squarespace-cdn.com/content/v1/5f7e23546f66d963fc2f145f/1608569321041-X6MDHETNDE2XGR4X6T0J/24+-+Admin+-+Review+PTO+-+Mockup.png Portfolio - U-Shift https://images.squarespace-cdn.com/content/v1/5f7e23546f66d963fc2f145f/1608569321536-X4HGH94AUFS2ACJJZKWB/25+-+Admin+-+Review+PTO+-+1+-+Mockup.png Portfolio - U-Shift