请选择 进入手机版 | 继续访问电脑版

产品设计

    今日:39| 主题:19074
收藏本版 (1)
软件产品、PC、移动、网站、平台的开发、策划等内容。

[其他] Things you can learn from redesigns

[复制链接]
螢窗夜話 发表于 2016年10月1日 17:11
435 18

立即注册CoLaBug.com会员,免费获得投稿人的专业资料,享用更多功能,玩转个人品牌!

您需要 登录 才可以下载或查看,没有帐号?立即注册

x

Things you can learn from redesigns

Things you can learn from redesigns-1-产品设计-experience,possible,contacts,managing,entirely
          Image Credit       A good CRM should enhance the value of managing contacts, but our legacy CRM doesn’t provide any ability to filter or search contacts within the page. Some of you may say: If it’s that bad, why not just go ahead and redesign it? But hey, it’s not that simple. Here is why:
  Legacy design

  Our CRM has been live for over a year and users have been trained on this legacy system. It’s not easy to ask users to switch to a new system without strong, convincing data. From a designer’s point of view, we want to stand by the users and try what we can to improve the user experience in any possible way without asking users to adopt an entirely new system.
  Lack of Data

  The best way to propose redesign ideas is when you have convincing data in hand. I used to propose redesigns without data, all of which inevitably got rejected. Why? The usual feedback are:
  1) Our development team doesn’t have bandwidth for this redesign; they’re overloaded with building new features.
  2) Why do we need to redesign? I don’t see any problems here.
  3) Are you sure your redesign is better? Is it worth making the investment in time and effort?
  Lessons learned! I started to realize the importance of having compelling data to convince the naysayers. Believe me, it smoothed out my redesign journey all the way from the beginning until the end.
  Redesign Journey

  1. Research

  First, I learned to gather data. Users go to our online community to learn how to use our CRM and submit questions and suggestions for improvement. It was a treasure trove of data for my project. I categorized, filtered and sorted suggestions from users and attached a link for each post. I then sat down with product managers to go over the findings and my suggestions for a few redesign ideas.
  2. Why does it need redesign?

  Second, I learned to identify the problem. When users click on the Contacts tab, there was a fly out menu for different categories of contacts, such as Starred Contacts, Leads, and Prospects. But, users often are not sure about where a Contact might belong to, so they would default to All Contacts. Furthermore, users could not search within the list view and filter their contacts.
         

Things you can learn from redesigns

Things you can learn from redesigns-2-产品设计-experience,possible,contacts,managing,entirely
         Fly out menu when click on “Contacts”            

Things you can learn from redesigns

Things you can learn from redesigns-3-产品设计-experience,possible,contacts,managing,entirely
         Current Contacts list view design      3. Sketches

  Based on community suggestions, I started to sketch out ideas on paper (see below). I went through a few rounds of different ideas and decided that V4 was the best option for redesign round one. I removed the fly out menu and replaced it with page tabs to switch Contact types. I also put both filter and sort under the “All Filter” button, added in page search and added in a new Contact button.
         

Things you can learn from redesigns

Things you can learn from redesigns-4-产品设计-experience,possible,contacts,managing,entirely
         Round one-V1 sketches            

Things you can learn from redesigns

Things you can learn from redesigns-5-产品设计-experience,possible,contacts,managing,entirely
         Round one V2 sketches            

Things you can learn from redesigns

Things you can learn from redesigns-6-产品设计-experience,possible,contacts,managing,entirely
         Round one V3 sketches            

Things you can learn from redesigns

Things you can learn from redesigns-7-产品设计-experience,possible,contacts,managing,entirely
         Winner — Round one V4 sketch      4. User Testing — Round 1

  
       
  • Build a prototype. I created mockups based on the V4 sketch and put a prototype together based on Invision App .   
  • Create moderate guidelines. I listed out study goals and defined user testing questions.   
  • Recruit participants. I segmented a group of participants and invited them to join a filter/sort study based on. I used Intercom to track user activities.   
  • Prototype test. I conducted prototype tests with colleagues/friends first to make sure everything works as expected.   
  • Remote User testing: I talked to users to learn what works well and what needs improvement and used Validately to run user testing sessions.   
  • Analyze user testing data: I analyzed all findings with my teammates to highlight top issues and successes.  
         

Things you can learn from redesigns

Things you can learn from redesigns-8-产品设计-experience,possible,contacts,managing,entirely
         Analyze user feedback with teammates            

Things you can learn from redesigns

Things you can learn from redesigns-9-产品设计-experience,possible,contacts,managing,entirely
         User testing key findings      
       
  • User testing report: I documented all key findings, task success rate, and next steps. I use it to define redesign success and walk through everyone what we learned and achieved.  
  5. Iterate on Designs

  The next step is to apply what you learned from user testing and iterate the designs. We have validated some redesigns, and users gave great feedback on what we can do to make it even better.
  6. More Sketches

  Because there were more filters requests from both our users and management, I had to think about how to add in a bunch of new filters without complicating the user flow. I then undertook another round of sketches to see which offered the best design (see below).
         

Things you can learn from redesigns

Things you can learn from redesigns-10-产品设计-experience,possible,contacts,managing,entirely
         Round two V1 sketch            

Things you can learn from redesigns

Things you can learn from redesigns-11-产品设计-experience,possible,contacts,managing,entirely
         Round two V2 option A            

Things you can learn from redesigns

Things you can learn from redesigns-12-产品设计-experience,possible,contacts,managing,entirely
         Round two V2 option B      Soon I faced the struggle of prioritizing efficiency or clarity. I wanted to display the most popular filters upfront with radio buttons to reduce the number of task clicks required. But, I soon realized that my initial concept was not compatible with the massive amount of information required and that I could group such information better.
         

Things you can learn from redesigns

Things you can learn from redesigns-13-产品设计-experience,possible,contacts,managing,entirely
         Clarity or Efficiency?      This was a perfect opportunity to apply our newly defined “Design Principles” in practice: I decided to prioritize clarity over efficiency. It meant that I had to make sure users can easily scan and discover information first before ask them to do any tasks. Users won’t mind extra clicks as long as the system provides accurate feedback.
         

Things you can learn from redesigns

Things you can learn from redesigns-14-产品设计-experience,possible,contacts,managing,entirely
         Round two V3 sketch      I decided to make all filters drop-downs for the following reasons:
  1. Save vertical space, especially on tablets. The filters dropdown will expand and push down the Contacts list view.
  2. We don’t have data to decide which filter options we should display up front.
  3. This grouping made more sense and was easier to scan and discover.
  Additionally, I removed the contacts relationship tabs and grouped them under an optional “Relationship” dropdown.
         

Things you can learn from redesigns

Things you can learn from redesigns-15-产品设计-experience,possible,contacts,managing,entirely
         Round two V4 sketches            

Things you can learn from redesigns

Things you can learn from redesigns-16-产品设计-experience,possible,contacts,managing,entirely
         Click on “More Filters”      7. User Testing — Round 2

  
       
  • Build a prototype. I created new mockups based on V4 and built a new prototype.   
  • Repeat everything I did during round 1.  
         

Things you can learn from redesigns

Things you can learn from redesigns-17-产品设计-experience,possible,contacts,managing,entirely
         Contacts list view — sorted by ZapScore            

Things you can learn from redesigns

Things you can learn from redesigns-18-产品设计-experience,possible,contacts,managing,entirely
         Contacts list view — filters selected            

Things you can learn from redesigns

Things you can learn from redesigns-19-产品设计-experience,possible,contacts,managing,entirely
         Mockup — click on “More Filters”            

Things you can learn from redesigns

Things you can learn from redesigns-20-产品设计-experience,possible,contacts,managing,entirely
         Analyze user feedback — user testing round 2      8. Iterate on Designs, Again

  Better design doesn’t happen overnight. It goes through the cycle of user test, design, and iterate!
  9. Development

  At this stage, it’s up to your product team whether to do a third round of user test. We were confident with what we learned and needed to roll out these new features soon, so we just went straight to the last step.
  10. Last Step

  Finalize mockups! Work with the development team to figure out the best ways to implement these redesigns.
  Conclusion

  Lead this redesign project was a great opportunity for me. I learned a lot and want to share some highlights:
   ● Data is a designer’s best friend. Do some research homework before jump on any redesigns.
   ● User testing is the key. Moderated user test sessions can be draining. But, the feelings of accomplishment at the end is worth it.
   ● Document what you learned and achieved. Don’t just talk about what you can do, show what you’ve done!
   ● Be organized. Make sure you know where and how to find files to support your design thinking.
   ● Be grateful. If you think you can handle an entire redesign journey alone, you’re wrong. No one should or can neglect the importance of collaboration.
  The secret to leading a redesign project is to stay patient and plan out a redesign journey. Make it easy for everyone on the team to envision how redesigns are going to increase return on investment.
  Lastly, I would like to thank my team who gave me this opportunity. They were always there when I needed design feedback, prototype testing and a note taker. More importantly, thanks to the endless spiritual support. =)



上一篇:6 Interactive Tools for Marketers and Designers
下一篇:The Voting Process through a Behavioral Lens
Samuelcync 发表于 2016年10月2日 15:00
:lol 嗯嗯额
回复 支持 反对

使用道具 举报

邦邦 发表于 2016年10月2日 18:33
撸过...
回复 支持 反对

使用道具 举报

楚臻婷 发表于 2016年10月3日 13:19
远看是美景,近看想报警。
回复 支持 反对

使用道具 举报

梦琪 发表于 2016年10月4日 03:43
这么强,支持楼主,佩服
回复 支持 反对

使用道具 举报

冬萱 发表于 2016年10月4日 04:19
支持你哈............
回复 支持 反对

使用道具 举报

蒋远涛 发表于 2016年10月5日 01:58
楼主,我这人不太会说话,如果有什么冒犯的地方,也是为了顶你!
回复 支持 反对

使用道具 举报

取经途中遇唐僧 发表于 2016年10月5日 06:27
非常好,顶一下
回复 支持 反对

使用道具 举报

aa10790 发表于 2016年10月6日 09:54
佩服佩服!
回复 支持 反对

使用道具 举报

xueyufbi 发表于 2016年10月22日 09:24
按“开始键”再按两下“U”可以找出windows的隐藏游戏.
回复 支持 反对

使用道具 举报

*滑动验证:
您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

我要投稿

推荐阅读


回页顶回复上一篇下一篇回列表
手机版/CoLaBug.com ( 粤ICP备05003221号 | 文网文[2010]257号 )

© 2001-2017 Comsenz Inc. Design: Dean. DiscuzFans.

返回顶部 返回列表