- A+
æœ¬æ–‡æ¥æºï¼š Echo( 公众å·ï¼šEcho的设计笔记), å…± 1787 å—
很多读者很关心的一个问题,就是如何åšå‡ºä¼˜ç§€çš„甚至很惊艳的设计方案?
大家拿ç€äº§å“需求之åŽï¼Œå¾ˆå®¹æ˜“就没有头绪,ä¸çŸ¥é“如何下手,最多也就看看相关的竞å“,借鉴竞å“çš„æ€è·¯å’Œæ–¹æ¡ˆï¼Œç„¶åŽå°±å¼€å§‹åšè®¾è®¡ã€‚è¿™æ ·çš„è¯ï¼Œè®¾è®¡å¸ˆå°±ç¼ºä¹ç‹¬ç«‹æ€è€ƒèƒ½åŠ›ï¼Œç¼ºä¹è®¾è®¡æŽ¨å¯¼ã€‚有没有一些方法,让设计师åšå‡ºç¬¦åˆè‡ªå·±çš„设计方案呢?
这里我总结了5个方法,å¯ä»¥åŠ©åŠ›è®¾è®¡å¸ˆåšå‡ºä¼˜ç§€ç”šè‡³æƒŠè‰³çš„设计方案。以下是本文5个方法的大纲:
1ã€æ‹†è§£è®¾è®¡éœ€æ±‚
2ã€åˆ†æžçº¿ä¸Šæ•°æ®
3ã€ç©·ä¸¾è®¾è®¡æ–¹æ¡ˆ
4ã€åˆ‡æ¢ç”¨æˆ·è§†è§’
5ã€ç«žå“方案对比
1ã€æ‹†è§£è®¾è®¡éœ€æ±‚
设计师接到的设计需求,大部分情况下是通过产å“ç»ç†é‚£é‡ŒèŽ·å¾—çš„ã€‚è€Œäº§å“ç»ç†çš„åŽŸå§‹éœ€æ±‚æ¥æºäºŽï¼šä¸šåŠ¡æ–¹ã€ç”¨æˆ·å’Œè€æ¿ã€‚
产å“ç»ç†ä¼šå°†åŽŸå§‹éœ€æ±‚è¿›è¡Œæ•´ç†ï¼Œä»Žè€Œè½¬åŒ–æˆäº§å“需求,在这一过程ä¸äº§å“ç»ç†å¯èƒ½ä¼šå‡ºçŽ°å¯¹åŽŸå§‹éœ€æ±‚çš„ç†è§£å‡ºçްå差(范围扩大ã€èŒƒå›´ç¼©å°æˆ–者是方å‘错误)。
设计师如果直接拿ç€äº§å“需求就开始åšè®¾è®¡ï¼Œå¯èƒ½ä¼šå¯¼è‡´è®¾è®¡æ–¹æ¡ˆä¸ç¬¦åˆä¸šåŠ¡éœ€æ±‚ã€‚æ‰€ä»¥è®¾è®¡å¸ˆè¿›è¡Œè®¾è®¡å‰ï¼Œæœ€å¥½ä¹Ÿäº†è§£åŽŸå§‹éœ€æ±‚æ˜¯æ€Žä¹ˆæ ·äº§ç”Ÿçš„ï¼Œè¿™æ ·æ‰èƒ½åšåˆ°å¿ƒä¸æœ‰æ•°ã€‚
掌æ¡åŽŸå§‹éœ€æ±‚å’Œäº§å“需求åŽï¼ŒæŽ¥ä¸‹æ¥å°±è¦å¯¹éœ€æ±‚进行拆解。
举个å°ä¾‹å:设计这边接到了一个产å“需求,需求为:为é™ä½Žäº§å“å 用用户手机å˜å‚¨ç©ºé—´ã€‚优化线上清ç†ç¼“å˜åŠŸèƒ½ï¼Œæå‡ç”¨æˆ·å®Œæˆæ¸…ç†ç¼“å˜çš„æˆåŠŸçŽ‡ã€‚
通过这个产å“需求å¯ä»¥çœ‹å‡ºï¼Œè®¾è®¡å¸ˆè¦åšçš„就是æå‡æ¸…ç†ç¼“å˜æµç¨‹çš„æˆåŠŸçŽ‡ã€‚ä½†æ˜¯ä»ŽåŽŸå§‹éœ€æ±‚å¯ä»¥çœ‹å‡ºï¼ŒçœŸæ£æ ¸å¿ƒéœ€è¦è§£å†³çš„则是如何é™ä½Žäº§å“å 用用户手机å˜å‚¨ç©ºé—´ã€‚
所以设计师的方案å¯ä»¥ä»Ž4æ–¹é¢å…¥æ‰‹ï¼š
1ã€æå‡æ¸…ç†ç¼“å˜çš„æˆåŠŸçŽ‡ï¼›
2ã€å’Œå¼€å‘æ²Ÿé€šï¼Œæ˜¯å¦æœ‰æ›´å¥½çš„æ›´æ”¹ç¼“å˜æœºåˆ¶ï¼›
3ã€é€šè¿‡è®¾è®¡çš„æ‰‹æ®µå¼•导用户清ç†ç¼“å˜åžƒåœ¾ç‰ã€‚
4ã€æ˜¯å¦å¯ä»¥å¢žåŠ è‡ªåŠ¨æ¸…ç†åŠŸèƒ½ã€‚
è¿™æ ·çš„è¯ï¼Œè®¾è®¡æ–¹æ¡ˆæ‰èƒ½æ›´å¥½çš„æœåŠ¡äºŽäº§å“和用户。
2ã€åˆ†æžçº¿ä¸Šæ•°æ®
当我们拆解了设计需求åŽï¼ŒæŽ¥ä¸‹æ¥å°±éœ€è¦åˆ†æžçº¿ä¸Šæ•°æ®ï¼Œçœ‹è¿™ä¸ªä¸šåŠ¡ç›¸å…³çš„æ•°æ®æƒ…å†µæ€Žä¹ˆæ ·ï¼Ÿ
åˆ†æžæ•°æ®æƒ…å†µï¼Œç„¶åŽæ€è€ƒçº¿ä¸Šå¸ƒå±€çš„åˆç†æ€§ï¼Œç„¶åŽè¿›è¡Œå¸ƒå±€è®¾è®¡å’Œæµç¨‹è®¾è®¡ã€‚
举个例å,在æŸä¸ªæ“作æµç¨‹ä¸ï¼Œå‘现有一个æ¥éª¤ï¼Œç”¨æˆ·æ“作æµå¤±çŽ‡å¾ˆé«˜ï¼Œè¿™æ—¶å€™æˆ‘ä»¬å°±è¦åˆ†æžä¸ºä»€ä¹ˆè¿™ä¸€æ¥æ“作æµå¤±çŽ‡é«˜ã€‚
例如注册æµç¨‹/绑定银行å¡çš„过程ä¸ï¼Œæ€»çš„è½¬åŒ–çŽ‡åªæœ‰0.06%,用户完æˆçŽ‡è¿‡ä½Žï¼Œå¦‚æžœè¦ä¼˜åŒ–整个用户注册æ“作æµç¨‹ï¼Œé‚£ä¹ˆéœ€è¦æ‰¾å‡ºæµå¤±è¿‡å¤§çš„节点进行优化。
从数æ®å¯ä»¥çœ‹å‡ºæœ‰ä¸¤ä¸ªå¤±è´¥çŽ‡æœ€é«˜ï¼Œåˆ†åˆ«ä¸ºï¼šæ³¨å†Œæµç¨‹å’Œç»‘å®šé“¶è¡Œå¡æµç¨‹ã€‚
这时候设计师就è¦åˆ†æžæ•´ä¸ªæ³¨å†Œæµç¨‹å’Œç»‘å®šé“¶è¡Œå¡æµç¨‹ã€‚å“ªäº›è®¾è®¡å› ç´ å¯¼è‡´æˆåŠŸçŽ‡ä½Žã€‚å¹¶é’ˆå¯¹æˆåŠŸçŽ‡ä½Žè¿›è¡Œé’ˆå¯¹æ€§çš„å¸ƒå±€ä¼˜åŒ–å’Œæµç¨‹ä¼˜åŒ–。
3ã€ç©·ä¸¾æ–¹æ¡ˆæ–¹å¼
当设计出一个方案时,则需è¦å¯¹å®Œæˆçš„æ–¹æ¡ˆè¿›è¡Œç©·ä¸¾ï¼Œå‘散出更多的方案,最åŽä»Žä¼—å¤šæ–¹æ¡ˆä¸æ‰¾åˆ°ä¸€ä¸ªæ›´å®Œç¾Žçš„æ–¹æ¡ˆã€‚
以表å•设计为例。常è§çš„设计方案,是将所有的表å•内容按照分组的方å¼ï¼Œè¿›è¡ŒæŽ’列,如下图所示:
ä½†æ˜¯è¿™ç§æ–¹æ¡ˆå˜åœ¨ä¸€ä¸ªé—®é¢˜ï¼Œç”¨æˆ·è¿›æ¥ä¹‹åŽï¼Œå‘现有大é‡çš„ä¿¡æ¯éœ€è¦å¡«å†™ï¼Œå¡«å†™åŽ‹åŠ›å¤§ï¼Œå¯¼è‡´ç”¨æˆ·çš„å¡«å†™æ„æ„¿å˜å¼±ï¼Œå¯¼è‡´æäº¤æˆåŠŸçŽ‡é™ä½Žã€‚
接下æ¥å°±è¦å°è¯•å…¶ä»–æ–¹å‘的设计æ€è·¯ï¼Œé€šè¿‡ç©·ä¸¾æ³•å¯ä»¥æƒ³åˆ°çš„æœ‰åˆ†æ¥è®¾è®¡å’Œå°†è¡¨å•填写内容éšè—到下一级界é¢ï¼Œä»Žè€Œé™ä½Žç”¨æˆ·å¡«å†™åŽ‹åŠ›æå‡ç”¨æˆ·çš„æ“ä½œæˆåŠŸçŽ‡ã€‚
下图左边为分æ¥è®¾è®¡ï¼Œå³å›¾ä¸ºè¡¨å•ä¿¡æ¯éšè—到下一级页é¢ã€‚
4ã€åˆ‡æ¢ç”¨æˆ·è§†è§’
设计方案确认之åŽï¼Œè¿™æ—¶å€™æœ‰ä¸€æ¥å¾ˆå…³é”®ï¼Œå°±æ˜¯æˆ‘们è¦å°†è‡ªå·±æƒ³åƒæˆå°ç™½ç”¨æˆ·ã€‚
我们以å°ç™½ç”¨æˆ·çš„视角去审视方案。看看有没有ä¸ç†è§£çš„地方。
ä¸ºä»€ä¹ˆè¦æœ‰è¿™ä¸€æ¥å‘¢ï¼Ÿ
å› ä¸ºæˆ‘ä»¬è®¾è®¡å¸ˆåœ¨è®¾è®¡æ–¹æ¡ˆçš„è¿‡ç¨‹ä¸ï¼Œä¼šé»˜è®¤ä¸€äº›è®¾è®¡è§„则逻辑,而这些规则逻辑用户是ä¸çŸ¥é“的。
这就导致了我们设计师觉得这个方案å¯è¡Œã€‚但是普通用户å´ä¸çŸ¥é“è¿™ä¸ªè§„åˆ™é€»è¾‘ï¼Œå¯¼è‡´æˆ‘ä»¬çš„æ–¹æ¡ˆç”¨æˆ·çœ‹ä¸æ‡‚。
当我们切æ¢ç”¨æˆ·è§†è§’å‘现方案å˜åœ¨çš„问题åŽï¼Œå†å°è¯•如何让用户更好的ç†è§£çš„å‰æä¸‹åŽ»ä¼˜åŒ–æ–¹æ¡ˆã€‚
5ã€ç«žå“方案对比
ä¸ºä»€ä¹ˆæˆ‘å°†ç«žå“æ–¹æ¡ˆæ”¾åœ¨åŽé¢å‘¢ï¼Ÿ
如果åšè®¾è®¡ä¹‹å‰å°±å‚考竞å“,那么就容易默认为竞å“çš„æ–¹æ¡ˆæ˜¯æ ‡å‡†çš„ï¼Œæ˜¯ä¼˜ç§€çš„æ–¹æ¡ˆã€‚
会ä¸ç”±è‡ªä¸»çš„æŒ‰ç…§ç«žå“çš„æ€è·¯åŽ»åšè®¾è®¡ï¼Œæœ€ç»ˆå¯¼è‡´çš„åŽæžœå°±æ˜¯å’Œç«žå“方案相似。
由于我们和竞å“çš„äººç¾¤ï¼Œä¸šåŠ¡èƒŒæ™¯ç‰æ–¹é¢éƒ½ä¸ç›¸åŒã€‚
竞å“çš„è®¾è®¡æ–¹æ¡ˆåŸºäºŽå¼€å‘æˆ–è€…è€æ¿ç‰ä¸šåŠ¡èƒŒæ™¯ï¼Œæ‰ä¸å¾—已使用éžä¼˜ç§€çš„æ–¹æ¡ˆï¼Œæˆ‘们如果å‚考竞å“çš„è¯ï¼Œæœ€åŽçš„结果也å¯èƒ½éš¾ä»¥åšå‡ºä¼˜ç§€çš„æ–¹æ¡ˆã€‚
当我们的设计方案åšå¥½ä¹‹åŽï¼Œè¿™æ—¶å€™æˆ‘们就å¯ä»¥åˆ†æžæˆ‘们的设计和竞å“çš„åŒºåˆ«å’Œå·®å¼‚æ€§ï¼Œä»Žè€Œå¾—åˆ°çµæ„Ÿï¼Œ 优化出更好的设计。
总结
以上5个通用方法å¯é€‚用于ç»å¤§éƒ¨åˆ†è®¾è®¡éœ€æ±‚。如果在设计å‰åŽå¯ä»¥æ»¡è¶³ä»¥ä¸Š5个方法,那么设计出æ¥çš„æ–¹æ¡ˆè‚¯å®šä¸ä¼šå·®ã€‚