进阶篇32. 设计系统应用实例(4)——总结

龳2.29-2.32龡龝龛2018龓龒Nashvill龃龀齼Drupalcon齪齩齥龒Drupal齡齝齪齜齛齗齕齒齐齼Session齼齆齅齁鼾鼽鼺鼸鼷鼵鼴鼲龒 youtube 鼨鼥鼣鼢鼠鼜鼛齼鼘鼗鼷鼓鼴鼲龒鼢鼐鼺鼌龡鼉鼅鼁

黾黺黸齼黶黳龝黰黯黫黩黦黤黣齼黠點黝黙Northwell Health鼷黓黳龝Drupal黏黌鼐黉黉黣黆齼Phase2鼁Northwell Health黁黀23麼黠點鼷550麷鼠麳麱麮齁66000麷黆麪麩, 麦麣15000麷黆麢麡麟3900黆黠麜鼷麘龓麗麔麒200麎麌麈麆黠麅麁麀鹼鹸鼁

鼲鹷鹵鹲鹰NW鹫麗Northwell Health齼鹩鹧鼷P2鹫麗Phase2齼鹩鹧鼷鹤黆鹣鹢鹡齼黆鹠鼺鹝龝Joey鼷Karly鼷Peter鼁鹖鹕鹵龒鹣鹢齪鹑鹎鹌鹊鹆鹅鼁


design system in Drupal

Karley:

design.northwell.io龝鹊鹕鸽鸼鸹鸵麆鸱鸮鸭鸩齼鸦鸢鸞鸝麟鸜鸙鸗鼷鸔鼲鸐鸍黣麼鸉鸇鸃齼鷿鼷鼴鼲鷽鼅鼅鼁鹊鹕鷹麒鼢鼠鷶鷲麟鹊鹕齼鸔黀齗齕黙鷰鼲齁鷭麦鷫鷨鷧鹊鹕齼齗齕鷦鷣鼁鷢齼鹫鹰鷞龝麗鸔黀麌麈麆鷚鼠鷙鷚齼鷦鷣鼷鷗鸔黀麌鷔鹲鹰鷐鷌齼齗齕鷉鷇鼁鷢鹲鷃鸔黀齼鷂鹰麟鶾鶽齼齗齕麟鶻鶷鶶鼣鷐鶳鶲麗鶯鼴鶬鼁鶪鹊鹕鶨鼢鼠鸜鸙鸗鶦鶢鹊鹕齼鶠鹖鶟鹫鶝鶚齼鶘鶖鼷鹊鹕鶒鶐鹖鹕鶏鹲鹰鹊鹕鶌鶋鶊齼鶻鶷鼷鼢鷌鷞鶆鶅鶯鹊鹕齼齗齕鶁鶟鷦鷣鼷鷐鶘鶆鵿鶯鶾鶽齼鵾鹰鵻麟鵺鵿鵹鼴鸭鸩鵻鼁

so design.northwell.io is our publicly accessible style guide and pattern library, so feel free to visit it and take a look. this is what we share across all of our different design teams or vendors and agencies that work on all different northwell digital properties. this site acts as our single source of truth for north Wells digital design, and it really helps us to make sure that everything stays in sync across the multiple properties, when we give the store design partners, we know that they're using the code that we've built, so we can guarantee it meets our standards for usability and accessibility.鵪

design system in Drupal

鶌鶋鷚鵧齗齕齒齐齼鵤鷚鼠鶊鵡龝鼷鼢鷌鼴鼲鹲鷃齗齕齒齐鶲麗鷚鼠鼴鼲鵠鵟齼鵛鵙鼁鼵鵖鵒鵑鶏鹝麌鷽鵠鷚鼠鷚鵍鷔龒鵌鵊齼鵛鵙鼷鸔鼲鼷鶪鹊鹕齼齗齕齒齐鼨鵉鵇鵅鼷鹊鹕鷞麗鵄鵃麮麳鸽齗鶯鷚齒鴿齼鵑鵠鴼鴺鼷鹊鹕鵑鹖鹕鼢鴷鸜鸙麗鴴鴲鶏鴯齗齕鶲鹖鹕齛龒鼢鼠鷌黌鴫鴪鷌鹲鹰鼢鴷鸜鸙鷽鴧鴦鷚鼠鷶鷲鼁鹊鹕鴣鴟黣麼鼷鼴鼲鶨鼢鼠齒齐鴞鶲鷚龛鴜鴛鴙鴕鼷齜鴔鼨鼷鹊鹕鶨鸔黀齼鸜鸙鷔鴐鴏鶯鸹鸵鼷鴌鴈麒鴇鼁鼢鷌鹖鹕鷞鼴鼲鶨鼢鴷鸜鸙鴃龒鳿鼨鼷鴌鴈鳻鳷鷽鳴鳱麟鴧鳰鹖鹕鼷鳭鳬鳨鶲鷚鼠鷶鷲鼁鼢鼠麒鴺鷞麟鹖鹕龒鵅鳤鳡鳟鷶鷲鷽鳝鳛鳚鸜鶟鳚鳴鳱Paragraph鳙鳕鸔鳔鶲齼鳒鳑龝鳐鳌鳊鳇齼鼁

and one of the greatest benefits to having a design system in place, is its ability to be teachable. it's really hard to teach something that's ever-changing, so once we had our library of reusable components, we held classes throughout the marketing department to teach people why they are designed the way they are. and how they can be used to assemble pages. we explained to everyone as a Lego Lake design system, where we printed and actually laminated each component. so that they could touch and feel them and move them around to create pages, similar like you'd be able to do in the back end of the site, the site builders with the different paragraphs, they could move them around.

鶪黣麼鶬鳁鲿鲽麟鸉鲹鼣鼢鴷鳙鳕齼鶘鶖鼷龛齥鹖鹕鸵鲸鷞鳐鳌鲴齜鳬鴈鳐鳌鲱鵾鳟鲮鶯鼁鹊鹕鳭鷚鼠鲬黀3黆齗齕麜齼鷰鲪鷚鹷黌鷞鲨黣鼣鶯50鼠麌齼黙鷰鼷鹖鹕麘鷚鼠麌鷔鲹鷃鹌鲧鼴鼲鲦鲤鼢鼠鲠鲞鲚鷐齼鲘鲗鷽鴧鴦鷶鷲齼麩鹫鼷鳭鳬鲔鲒鹊鹕齼鲑鲐鼷鼓鷞龝鹊鹕齒齐鼐齼黠鳔麟黠麜鹕齼鲘鲗鼁

so once people were able to actually touch and feel it, it became very real to them and much more understandable. we went from having only three digital designers to a team of more than 50 people, who felt empowered to work with the clients:our doctors, our physicians,to pull together different web experiences.鵪

鷹麒鼢鼠鵠鵟麒鴺鼷麘鼠麌鷔鵌鷃鳐鳌鹌鲌鼷鲠鲞齗齕鷦鷣鼷鹖鹕鶒鶐鹌鲧鼴鼲鵖鶊齼鲊鶲齗齕鲤鹸鼁

with these trainings everyone felt very confident, that they could articulate the design decisions that went into creating the design standards.

design system in Drupal

黀鲉鼢鷌鷚鼠鲈鲆齼齗齕齒齐鼷龝齼鹊鹕齼鶾鶽鲅鲃麟鶾鶽鶋齗鹡鼴鼲鵖鱿齼鶋鱼鶊鹖鹕鲘鼾齼鶾鷶鼷鳬鱹鱹鲬鲘鼾鵖鱶齼齗齕黳鷲齼鱴鱲麩鹫鼁鹊鹕齼齗齕麮麳鲬黀3鼠麌鼷鳬鹊鹕鱯鼠黝黙鱫鳐鳌齼黣鼁鸐鸍麘鼠麮麳麘鷚鱧鶋鱼鷚鼠鱣鶾鷶鷔鲘鼾鹊鹕齼鹆鱟鼷鳭鶘鱜鼨鸵鲸鼷鼢鱘鱖龝鲚鼴鶬齼鼁鳬齛龒鼷鱕鱔黀鵖麷麌鲹鷃鹖鹕鼴鼲鱑鱼鲊鶲鼢鱏麩鹫鼷鳬鲚鲘鼾鹊鹕齼鱌鱉鼁

so having such a flexible design system coupled with the way it was built in Drupal8, lets our site builders stand up websites very quickly with minimal design oversight. having a team of three people and a very large organization made it very difficult time wise to actually do other work, when we needed to be involved every single time a page needed to be stood up. so now we have a lot of people who feel very confident doing it.鵪

鼢鼐鼷鼵鼴鼲鼅鼣鷚鴷NW齼鶾鶽齼黸黌鼷鹖鹕龝龒鼢鵧齗齕齒齐鼨鵉鵇鵅鱂齼鼁鰿鰽齼鷶鷲龝northwell.edu齼齡鷶齼鷌黌鼷鷚鰼鹊鹕鲊鶲鶯鰺鲞齼鰷鳴鼷鷞鶏鼨鵉鼁鵤鷭齼鰴鼠鱕鱔鼨鵉鶯鼷鷚鼠龝鰲鰰黠點鷚鼠龝鰬鰩鵠點鼁鷹麒鼢鱘鼠黸黌鼷麟鼢鼠鹣鹢鸽鰥鶘鹊鶢鸹齼鷶鷲鱂鷚鼠鰤鰠鼷鼵鷞鶏鰜齛鼷齛龒齼鼢鱘鼠鷶鷲鷞鵖鶊齼鰙鶶鶯鹊鹕齼鰕鰔鼜鲹鳨鰓鼷鴌鴈鷔鹲鹰鶯鷚鵍齼齗齕鷉鷇鼁

here's a few examples of northwell websites that have been created since we set up the design standards. the one to the left is what northwell.edu is going to be as soon as we migrate that page over. the other two are already live, there's the Cohen Children's Hospital website and our orthopaedic Institute. and you can see these compared to the earlier slide, these definitely now truly represent of our brand and they're all speaking from the same language.

ok鼷鼢鷞龝鰉鰇齼鸔黀鰃鲱鼁鹊鹕鵖鴛鸇鰀鯿黣麼齼鲤鯻鸩齝鼷鯸鹡鯷鷚鴷黣麼鸉鸇鸃齼鷿齝鼷鲤鯻麌鴞鰜鷇鯵鯳鼣鯱鯮鸦鼢鼐鸵鼁

and that's it, so we're happy to answer any questions or have any conversations if anybody please come to the mic if you guys have questions thank you.

鯭鯫鯧鯥

鱯鼠鹣鹢齼鯢鼽龝鯞鯝鸮鹕鹆鹅齗齕齒齐龒黣鯜鯙鯘齪齼鷂鹰鼷鯕鯓鸵鲸龒鼢鷌齼鯙鯘齪鼷鲘鼾麷鼠鶾鶽鳚鴌鴈鯐鼠麮麳鯏鶏鶘鲚鶘鲘鼾鶋鱼鱣齼鷶鷲鼲鯍鯉鯐鯅鲆鳱鼷鴌鴈鼢鴷鶾鶽麟鷶鷲鵇鱜鲘鼾鶆鯉鼜鲹鳨鰓齼鯄鯂鯁鳚鶆鯉齗齕鷉鷇齼鷚鯀鵻鼷鮽鮺鸔鮸齁鼣齼齗齕麩鹫鮵鰤鰠黣鼷鳬齗齕齒齐鮳鵖鶊齼鲮鮲鶯鼢鼠鸩齝鼁

鮱鳬鼷鼢鯅黣鯜鯙鯘齼鱏鮮鴌鲚鳌鮬鼷鸐鸍鱹鱹龝鷚鼠鱑鱼齼鶾鶽鼷鳬鴈鼨鵉鵇鵅鮪黾鲚鶏鮦鱣齼鷿鼷鮥鴲鶋鱼齗齕齒齐鷞黀鷚鼽鮡黣鮠鴐鮝黌鼁鮜龝鼷鯵鯐鮘鲚鼾鮖鮓鶯鼷鸐鸍鹊鹕鮒鸽齗齕齒齐鲚鮐鼷鱹鱹鲬鼅鸜鸙鵊齡齝鸽鰜鮌鴺鼷鷢龛鹊鹕鱯鼠Drupal齡齝鳔鮊黏齼鮉鮅鼓龝鮂齩鯢鼾齼鼁鳬鼢鷚鼽鼷Peter龒鹣鹢齪鼓麈麒鼷鮥鷞龝鼴鼲鷗魾魽鸽鰜鹡鷽魺魶鱂鹖鹕魲魮齼鵛鵙鼷鳬鲚鹰鵠鵟魬麷Drupal齼鶒鯂鼁齩齥鼢鼠黳鷲鼷鹊龒龳魨魦齼龳23龡齪鹢鷃鮦魢魡鷚鴷鼷鯐鮘鼴鼲鱌魟鼁

齩齥黾鱧鹣鹢齼魞魜鼾鼽鼷鹊鹕龒魾鷲齼魚龡齪鮪黾鼨鷔鹢鼣鶯鴫魖黀鯕鯓鹢鼣齼鵛鵙鼷鰤鸐Pharagraph鳙鳕齼鹲鹰鼷龒龳魨魚龳31龡齪黣鯀齼麈鶯鷚鹷鴫鶾鶽齼鵾鹰鵻麟鵺鵿鵹鸭鸩鵻鹵龒鵇鵅齼鰃鲱齪鹢魒鼷鮽麗鹖鹕鴌鲚魑齥鸜鸙鵊齡齝鸽鰜齼鰃鲱鼷鮜鱫龝鲤鯻鶾鶽麟APP龒齗齕麟魾魽魍龡齪鲚鶬魉鼜齼鸩齝鼁

鳭龳魨魦龳15龡鸽鰥鼷鷚鵍鼣鼢鼐鼷鷞龝鱯鼠鸜鸙鵊齡齝鸽鰜齼魆麮鰃鲱鼷魅鹡魂鬿鹕鸐鸍龛鼢鷚麮鼺鰃鲱鯏黀鴴鴲鬻鸩鼷鯵鬷鹌鲧鳱鳿鱂鷚鹷鼁

鼢鼐鬳鹷鷚鼠鴼鵅鬯鵟鬫鬩鮱鹊鹕鴌鲚鬦龝龒鼨鴼鬥鼷鹊鹕龒鹢鲮鳙鼗鬡鬟齼鶘鶖鴌魖黀鬛鬚Northwell齼黳黺鮥鷌鬗鹰Pharagragh鳙鳕鷽鲮鬓鰃鲱鳊鯜麟鹠鳒鼷鯵魅鹡魂鬿鹕鹌鹎鳻鳷鼢鼠黳黺鼷鴌齜齛龳鷚魦齼鬒鬐鬌鳝鬈views齼鬅鬃鬀齪齼鶾鸢髼髻鴿髹鼁

鵤鷭鼷髸齥鼠麌髵髱麟鶬髱鷔黀鬃鼷鼲鮂齥鼢鱘龡齼齆齅鲚鼴髭髪齼鶏龒鼠鹝齼鯕鯓魡龡鼨鱉鹣鹢鹡齼黾髧黀鸔髣髡鼷髠髜魅鹡魂鬿鹕鬳鷇髚高齁鸞髖鼷鲚鲦鸉髕鼁鶪鮱鼷鼢鼐鼓體髑髐鷚鱧髍髌鼷鯭鯫鹧齼鸔黀鵛鵙鷔龝鮪齥鹌鲧齼鱔髊麟鯓鶏齼鼷髆鲔鶯鼠麌髣鮬鼷鶠齪鼓鲚髂鯐鯅骾鲸骽鶐鳚鶐鯝骹鲸鳚鲸鶯鼓骵鲸齼鵛鵙鼷鯐鮘鼅骲鼅鲉骱髠鷞麷鼅鼅鼷鲚骱髠鷞鱶鼅鱘骮鼁 ^_^ 骫骫骨骨

本书共76小节:

评论 (写第一个评论)