leeking001

UX Internet Travel Other About me
leeking001
博客
微博
照片
电影
白社会
Facebook
Twitter
Linkedin
Google+

交互规范实例——白社会Dialog规范

2009-11-23 by leeking001 | 用户体验 | 评论(18)

交互规范是什么:在产品设计初期,在进行了部分功能的交互设计之后,将用户与界面之间的交互行为总结归纳出来,并加以延展,从而形成的设计规范。交互规范可以帮助我们统一现有的交互设计,并可以指导接下来的交互设计。

我们就拿 白社会 中的Dialog规范举个例子:

以上是目前网站比较常见的提示框,它最初是模拟windows提示框出现的,让用户在使用中更加容易接受。

首先,我们根据用途,将Dialog分为以下5类,并且尽量详细的定义Dialog的使用用途、交互规则、文字和按钮规则:

  1. 确认框: 常用于删除或批量操作,再次确认使用。交互规则:直接显示对话框,点击按钮后直接消失。
    标题:操作+目标,例如删除日志,删除照片专辑,解除好友关系……
    按钮:确定+取消
  2. 操作框: 常用于进一步操作,入口较小,但操作步骤较多时,比如加好友,设隐私等。交互规则:直接显示对话框,确认完毕后,变为通知框。
    标题:操作+目标,一般为入口的名字,例如新建照片专辑,修改真心话,添加选项……
    按钮:保存(行为)+取消,行为例如加为好友,添加,分享……
  3. 通知框: 常用于确认框和操作框的确认后,通知用户结果,一般只有一个按钮。交互规则:点击按钮立即消失,如果不点击按钮,1秒后渐隐消失。
    标题:沿用之前操作框的标题
    按钮:关闭
  4. 提示框: 常用于表单提交后的验证,通知用户哪些信息不完整或者操作步骤不对。多条信息提示使用1、2、3……的序号排列
    标题:提示
    按钮:确定
  5. 未保存提示框: 常用于表单未保存就跳转的提示,提示用户未保存信息是否需要保存。
    标题:未保存+目标,例如未保存日志,未保存个人档案,未保存隐私设置……
    按钮:保存+不保存+取消

由于是模拟windows控件出现,我们也不能忘了快捷键,以方便键盘流的使用~

快捷键: 支持键盘的enter操作框上的主操作,一般为”确定””保存”等,支持键盘的esc操作框上的取消/关闭操作,一般为”取消””关闭XX”等。

这样,一个关于Dialog的交互规范就定义完了。

18条评论

  1. 大脸
    2009-11-23 at 1:39 下午

    还不够全面,你所讨论的都是WEB界面内的对话框,也就是说在前端开发师的控制内的对话框.
    但实际上,web通常要考虑与浏览器对话框以及windows通用对话框的结合以及组合情况.
    简单而言,web界面内部的窗口因为缺乏像OS那样有统一管理的任务栏或者dock,无法对窗口进行重叠,所以其深度一般为1.
    但如果需要组合,那就是要考虑到与浏览器对话框与操作系统的对话框进行组合.
    同时也要考虑窗口的两种属性:无模式对话框,模式对话框.
    所以,在web界面上,对话框的设计规范不仅仅是上诉的几个情况,根据产品的复杂程度,同时在考虑一致性的情况下,在具体哪种对话框应该有所取舍.
    ————————-
    在前辈的博客上大放厥辞,还请前辈见谅.这只是晚辈的与此篇文章的共鸣之语.

  2. leeking001
    2009-11-23 at 9:58 下午

    高见,高见呐!我这里说的也是白社会这个产品的Dialog嘛,模态非模态这块确实给忽略了,哈哈,找个机会补上,多谢兄弟啦~
    ps:很喜欢你们的“优涩控”,很想知道你们都是哪的团体啊~

  3. yusen
    2009-11-23 at 12:20 上午

    如果把统一的“确定”换成主动作名”删除“”加好友“,这样应该可以减少一些用户的迷惑呢?

  4. wbuild
    2009-11-23 at 10:18 上午

    同意。

  5. louis vuitton handbags saks
    2009-11-23 at 1:39 上午

    Louis Vuitton button bags are changeable and hundreds of thousands. FILA and LANVIN are co-branded丨It is Japanese and American clothing, Louis Vuitton’s freshest Maralle handbags, Louis Vuitton has launched classic popular all-in-one bags, such as last year’s hot The three-in-one package Multi Pochette Accessoires and the recently introduced variant FLICIE STRAP GO and so on. The new Maralle under-the-leg handbag is more of a practical design for babies all-in-one. Friends who know Louis Vuitton may remember the Maralle handbags launched by LV a few years ago, but the Maralle 2.0 version launched has a popular new design. Although it is a bit less than the three-in-one, the bag belts that can be purchased also provide the players’ bags with fashion, cross-body, one-shoulder and other back style benefits. Of wild colors. The main bag of the fresh Marelle is taken from Epi grain leather. The plain leather is made of leather. The leather is also more wear-resistant. The Canvas bag material bag printed with the classic Monogram old flowers is fixed on the outer net with the mobile phone, and the contrasting and printed design bag adds a touch of fun to the plain main bag and has become a fashionable brand feature. The thick wall adds a sense of modernity and design to the handbag. Louis VuittonFILA×LANVIN launches joint shoes GARA

  6. louis vuitton for sale
    2009-11-23 at 7:09 下午

    And on Xiaohongshu, there are also user feedbacks that Neverfull handbags bought for thousands of dollars in 2016 have almost doubled now鈥斺€擫ouis Vuitton Outlet official website shows that the current official price of Neverfull medium-sized handbags is 14,400 yuan.

  7. cheap imitation louis vuitton bags wholesale
    2009-11-23 at 8:45 下午

    Louis Vuitton button bags are changeable and hundreds of thousands. FILA and LANVIN are co-branded丨It is Japanese and American clothing, Louis Vuitton’s freshest Maralle handbags, Louis Vuitton has launched classic popular all-in-one bags, such as last year’s hot The three-in-one package Multi Pochette Accessoires and the recently introduced variant FLICIE STRAP GO and so on. The new Maralle under-the-leg handbag is more of a practical design for babies all-in-one. Friends who know Louis Vuitton may remember the Maralle handbags launched by LV a few years ago, but the Maralle 2.0 version launched has a popular new design. Although it is a bit less than the three-in-one, the bag belts that can be purchased also provide the players’ bags with fashion, cross-body, one-shoulder and other back style benefits. Of wild colors. The main bag of the fresh Marelle is taken from Epi grain leather. The plain leather is made of leather. The leather is also more wear-resistant. The Canvas bag material bag printed with the classic Monogram old flowers is fixed on the outer net with the mobile phone, and the contrasting and printed design bag adds a touch of fun to the plain main bag and has become a fashionable brand feature. The thick wall adds a sense of modernity and design to the handbag. Louis VuittonFILA×LANVIN launches joint shoes GARA

  8. cheap louis vuitton shoes for men
    2009-11-23 at 7:28 下午

    Louis Vuitton button bags are changeable and hundreds of thousands. FILA and LANVIN are co-branded丨It is Japanese and American clothing, Louis Vuitton’s freshest Maralle handbags, Louis Vuitton has launched classic popular all-in-one bags, such as last year’s hot The three-in-one package Multi Pochette Accessoires and the recently introduced variant FLICIE STRAP GO and so on. The new Maralle under-the-leg handbag is more of a practical design for babies all-in-one. Friends who know Louis Vuitton may remember the Maralle handbags launched by LV a few years ago, but the Maralle 2.0 version launched has a popular new design. Although it is a bit less than the three-in-one, the bag belts that can be purchased also provide the players’ bags with fashion, cross-body, one-shoulder and other back style benefits. Of wild colors. The main bag of the fresh Marelle is taken from Epi grain leather. The plain leather is made of leather. The leather is also more wear-resistant. The Canvas bag material bag printed with the classic Monogram old flowers is fixed on the outer net with the mobile phone, and the contrasting and printed design bag adds a touch of fun to the plain main bag and has become a fashionable brand feature. The thick wall adds a sense of modernity and design to the handbag. Louis VuittonFILA×LANVIN launches joint shoes GARA

  9. louis vuitton 41526
    2009-11-23 at 11:24 上午

    According to City Express, a post-95 white-collar worker in Hangzhou said: “Last year I bought a fund, and now it has lost 20%; and an Louis Vuitton Outlet bag I bought in the same period has now risen by 20%. My little sisters laughed at me, What kind of fund to buy at a young age, listening to those financial experts talking nonsense every day, in the end you have to worry about losing money. Honestly buy a luxury bag, the price increases every year, if you don鈥檛 like it, take the bag and sell it in a second-hand store Earn some. It鈥檚 equivalent to carrying all the bags for nothing during this period of time, and then you can spend some money to buy a new bag. If you don鈥檛 like it, you can change it and have a new bag every year. This is the new way for young people to manage their money.鈥?

  10. FrancisJoymn
    2009-11-23 at 11:39 下午

    太達數位媒體

    https://deltaamarketing.com.tw/

  11. Matthewzot
    2009-11-23 at 5:34 下午

    只要您準備好 我們隨時可以成就您!WE NEED YOU – 9JGIRL

    https://9jgirl.live/

  12. Stevekic
    2009-11-23 at 1:42 上午

    冠天下

    https://xn--ghq10gmvi961at1bmail479e.com/

  13. Rodneyrag
    2009-11-23 at 3:08 下午

    冠天下娛樂城

    https://xn--ghq10gw1gvobv8a5z0d.com/

  14. Scottieedinc
    2009-11-23 at 3:00 上午

    娛樂城評價大公開

    https://casinoreview.com.tw

  15. DouglasLer
    2009-11-23 at 11:48 下午

    冠天下娛樂

    https://xn--ghq10gmvi.com/

  16. Hermanquies
    2009-11-23 at 6:14 上午

    滿天星娛樂城 STAR

    https://xn--uis74a0us56agwe20i.com/

  17. WilliamLerry
    2009-11-23 at 10:00 上午

    水微晶玻尿酸 – 八千代

    https://yachiyo.com.tw/hyadermissmile-injection/

  18. Davidzep
    2009-11-23 at 3:13 下午

    HOYA娛樂城

    https://xn--hoya-8h5gx1jhq2b.tw/

发表评论

最近评论

  • Ullrich Aluminium supply an array of Aluminium products for the building industry including cladding, decorative metal, gates and fencing. My webpage :: https://www.webwiki.nl/progorki.com/engineering-perspectives/stainless-hydrotherapy-innovation/ https://www.webwiki.nl/progorki.com/engineering-perspectives/stainless-hydrotherapy-innovation/
  • This text is priceless. Where can I find out more?
  • Excellent article. I'm facing some of these issues as well..
  • Постройте свой идеальный деревянный дом под ключдеревянные дома под ключдеревянный дом под ключ ценадеревянные дома под ключ ценыстроительство деревянных домов под ключпостроить деревянный дом под ключстроительство домов из дерева под ключдеревянный коттедж под ключстроительство деревянных домов под ключ проекты и ценыстроительство деревянных коттеджей под ключдом деревянный под ключзаказать деревянный домдеревянные дома под ключ проекты и ценыдома деревянные под ключстроительство деревянных домов москвадом деревянный под ключ ценадеревянный дом под ключ проекты и ценыстроительство деревянного дома под ключ ценастроительство деревянных домов под ключ москва и наслаждайтесь уютом и комфортом Начало строительства требует внимательного подхода к проектированию.
  • Ищете удобный и доступный способ насладиться вейпингом? Тогда одноразовые электронные сигареты – это то, что вам нужно! На рынке в последние годы наблюдается рост популярности одноразовых электронных сигарет. Одноразовые электронные сигареты привлекают внимание благодаря своей простоте и удобству в использовании. Многие люди выбирают их как альтернативу традиционным сигаретам. Одной из главных причин их популярности является разнообразие вкусов. Среди доступных вариантов — фруктовые, десертные и ментоловые вкусы, что нравится многим. Это делает возможность выбора вкусов практически безграничной для каждого пользователя. Также одноразовые электронные сигареты легко доступны на рынке. Их можно приобрести в магазинах, а также онлайн. Удобство в покупке делает одноразовые электронные сигареты идеальным вариантом для тех, кто не хочет заботиться о заправке и обслуживании. Тем не менее, несмотря на все преимущества, существуют и недостатки. Некоторые исследования показывают, что одноразовые электронные сигареты могут оказаться менее безопасными. Также их срок службы значительно короче по сравнению с многоразовыми устройствами.
  • Versatile pacing іn OMT's e-learning lеtѕ trainees appreciatе mathematics triumphes, developing deep love аnd inspiration for examination efficiency. Оpen your kid's ⅽomplete capacity іn mathematics with OMT Math Tuition'ѕ expert-led classes, customized tⲟ Singapore's MOE curiculum for primary school, secondary, аnd JC students. Tһe holistic Singapore Math technique, ԝhich develops multilayered analytical abilities, highlights ᴡhy math tuition is vital fⲟr mastering tһe curriculum аnd preparing for future professions. Math tuition іn primary school bridges gaps іn classroom knowing, ensuring students comprehend complicated topics ѕuch aѕ geometry and infοrmation analysis Ƅefore tһe PSLE. Personalized math tuition іn senior hіgh school addresses private finding ⲟut spaces іn topics likе calculus ɑnd data, preventing tһem from hindering О Level success. Junior college math tuition іs crucial fߋr Ꭺ Degrees as it deepens understanding of innovative calculus topics ⅼike azsimilation techniques аnd differential equations, whіch are central to the exam syllabus. Ꮤһat makeѕ OMT outstanding іs itѕ exclusive educational program tһat lines սp with MOE wһile presеnting aesthetic aids liқе bar modeling in cutting-edge ѡays for primary learners. OMT's online neighborhood providеs assistance leh, where you cɑn ask inquiries and enhance уour discovering fоr far bettеr grades. Βy incorporating modern technology, on tһe internet math tuition engages digital-native Singapore trainees fοr interactive examination modification. Feel free tߋ visit my homepage :: singapore math tuition
  • Психолог онлайн даст совет в сложный момент. Детский психолог онлайн разберется с детской тревогой. детский психолог онлайн чат
  • github.io unblocked Hey! This is kind of off topic but I need some advice from an established blog. Is it hard to set up your own blog? I'm not very techincal but I can figure things out pretty fast. I'm thinking about making my own but I'm not sure where to start. Do you have any ideas or suggestions? Cheers
  • kraken зеркало позволяет обойти возможные блокировки и получить доступ к маркетплейсу. кракен ссылка актуальная необходимо искать через проверенные источники чтобы избежать фишинговых сайтов. кракен даркнет должно обновляться регулярно для обеспечения непрерывного доступа.
  • porno izle,porno seyret,türk porno,ifşa porno,türk ünlü porno,sex izle,sikiş videoları,sikiş izle,seks izle,seks videoları,porno,Porno Film izle,Sex Seyret, Mobil Sikiş,Tecavüz Porno,Porn Filmleri,HD porno,sansürsüz porno,sansürzü porno izle,sarhoş pornosu,enses porno,ücretsiz porno,ücretsiz porno izle,porna izle,Porno Anne,Porno izlesene,Sikiş Video,HD Sex Porn,porn,bedava sex izle,anal porno,götten sikiş izle,abla porno,abi porno,akraba porno,ünlü türk porno,ifşa pornolar,sert sikiş,içine boşalma porno,porno porno,porn porn,milli porno porno izle,porno seyret,türk porno,ifşa porno,türk ünlü porno,sex izle, sikiş videoları,sikiş izle,seks izle,seks videoları,porno,Porno Film izle,Sex Seyret,Mobil Sikiş,Tecavüz Porno,Porn Filmleri,HD porno,sansürsüz porno,sansürzü porno izle, sarhoş pornosu,enses porno,ücretsiz porno,ücretsiz porno izle,porna izle,Porno Anne,Porno izlesene,Sikiş Video,HD Sex Porn,porn,bedava sex izle,anal porno,götten sikiş izle,abla porno,abi porno,akraba porno, ünlü türk porno,ifşa pornolar,sert sikiş,içine boşalma porno,porno porno, porn porn,milli porno porno izle,porno seyret,türk porno,ifşa porno,türk ünlü porno,sex izle,sikiş videoları,sikiş izle,seks izle, seks videoları,porno,Porno Film izle,Sex Seyret,Mobil Sikiş,Tecavüz Porno,Porn Filmleri, HD porno,sansürsüz porno,sansürzü porno izle,sarhoş pornosu,enses porno,ücretsiz porno,ücretsiz porno izle,porna izle,Porno Anne,Porno izlesene,Sikiş Video,HD Sex Porn,porn,bedava sex izle,anal porno,götten sikiş izle,abla porno,abi porno, akraba porno,ünlü türk porno,ifşa pornolar,sert sikiş,içine boşalma porno,porno porno,porn porn,milli porno porno izle,porno seyret,türk porno,ifşa porno,türk ünlü porno,sex izle,sikiş videoları,sikiş izle,seks izle,seks videoları,porno,Porno Film izle,Sex Seyret,Mobil Sikiş, Tecavüz Porno,Porn Filmleri,HD porno,sansürsüz porno, sansürzü porno izle,sarhoş pornosu,enses porno, ücretsiz porno,ücretsiz porno izle,porna izle,Porno Anne,Porno izlesene, Sikiş Video,HD Sex Porn,porn,bedava sex izle,anal porno,götten sikiş izle,abla porno,abi porno,akraba porno,ünlü türk porno,ifşa pornolar,sert sikiş,içine boşalma porno,porno porno,porn porn,milli porno

最近文章

  • Play Casino poker On line the real deal play grand fruits real money Money Greatest Casino poker Sites inside 2025
  • Gamble casino 7 sins Baccarat Online the real deal Money Greatest Baccarat Sites 2025
  • Dies beste World wide unique casino Schweiz Bewertung web-Kasino via herumtoben Vortragen
  • 888 gambling enterprise You: golden tiger casino no deposit code Finest Online casino to possess Games, Incentives and you may Real cash Victories
  • Greatest $step one minimum put casinos to best payout online casino real money have Usa players inside 2025
  • Best 6 Poker On the web for real gods of giza casino Currency Betting Web sites within the 2025
  • Mr Bet Erreichbar Kasino 2025 within Deutschland Unter allen umständen, Casino mobilautomaten Mobile geradlinig, amortisieren
  • How 150 chances dolphin treasure to Play Vintage Black-jack Inside 2025
  • Mr 10 pound free no deposit casinos Bet Casino Comment Around 1500 over four dumps
  • Baccarat Online: Baccarist Applications on syndicate casino is it legit the internet Enjoy
© 2025 Leeking001 . Ported to Wordpress . Designed by Leeking001 . Powered by SAE . 京ICP备18021289号