Пайдаланушы интерфейсін жобалауға арналған соңғы нұсқаулық

Автор: Louise Ward
Жасалған Күн: 7 Ақпан 2021
Жаңарту Күні: 18 Мамыр 2024
Anonim
Кез келген адам бар иесі бола алады. 🍺🍻🍷🍳🍰  - TAVERN MASTER GamePlay 🎮📱 🇰🇿
Вызшақ: Кез келген адам бар иесі бола алады. 🍺🍻🍷🍳🍰 - TAVERN MASTER GamePlay 🎮📱 🇰🇿

Мазмұны

Пайдаланушы интерфейсінің дизайны дегеніміз не? Жақсырақ сұрақ болар еді, қолданушы интерфейсінің дизайнына не кіреді? Эстетика? Қолданушылық? Қол жетімділік? Олардың барлығы? Осы факторлардың барлығы пайдаланушының оңтайлы тәжірибесін қамтамасыз ету үшін қалай біріктіріледі және қайсысы бірінші орында тұруы керек?

Қол жетімділік әрдайым бірінші орында тұруы керек, оңтайлы ыңғайлылықтың негізін қалайды (веб-сайт құрастырушысын пайдалану мұнда көмектеседі). Сонымен, интерфейс қол жетімді және қолдануға жарамды болған кезде, ол эстетика тұрғысынан өте жақсы көрінуі керек (интерфейсті жобалау құралдары осы жерде көмектеседі). Сіздің дизайныңыздың барлық деңгейлерде жұмыс істейтіндігіне көз жеткізу үшін оны мұқият тексеріп алуыңыз керек, мұны сіз қолданушылардың ең жақсы тестілеу құралдарын таңдай аласыз. Көптеген дизайндардың негізгі элементтерін және көрнекі дәйектілікті қамтамасыз ету үшін не істеуге болатындығын егжей-тегжейлі қарастырайық.

01. Типографияны таңдаңыз


Тамаша типография (дизайнның көптеген аспектілері сияқты) қол жетімділікке дейін қайнайды. Визуалды дизайн қолданушының жалпы тәжірибесін толықтырады, бірақ күннің соңында пайдаланушылар интерфейспен байланыс жасайды, оны өнер деп санамайды. Түсінікті әріптер айқындылыққа әкеледі және оқылатын сөздер пайдаланушыларға мазмұнды тиімді сіңіруге көмектеседі. Екеуі де кез-келген визуалды эстетикадан гөрі маңызды.

Дегенмен, жақсы жасалған типография эстетикалық жағынан қанағаттанарлық бола алады. Ақ-қара Helvetica (немесе ұқсас шрифт) бірнеше қарапайым типографиялық жақсартулардан кейін сұлулық бола алады. Жақсартулар деп біз қаріптің өлшемін, жолдың биіктігін, әріптер аралығын және басқаларын өзгертуді түсінеміз - бұл қаріп немесе мәтіннің түсі емес.

'Әдемі' типография оқылмай жатқанда шынымен ұсқынсыз, өйткені көңілсіздік әрқашан эстетикаға әсер етеді. Керемет дизайн үйлесімді және үйлесімді.

Интерфейсті жобалаудың көптеген аспектілері сияқты, қол жетімділік пен эстетиканы теңестіру үшін көрнекіліктерді дәл реттеу қиын емес. Қиындық - бүкіл дизайн бойында бірізділікті сақтау. Жүйелілік әр түрлі маңызды элементтер арасындағы айқын иерархияны орнатады, бұл өз кезегінде пайдаланушыларға интерфейсті тез түсінуге және тіпті мазмұнды тиімдірек қорытуға көмектеседі.


WCAG 2.0 веб-мазмұнына қол жетімділік жөніндегі нұсқаулықта анықталған минималды қаріптің өлшемі оқылымдылығы мен оқылымдылығы туралы болса, 18 бас (немесе 14 бас қаріп). Қаріптің ең жақсы өлшемі көбіне қаріптің өзіне байланысты, бірақ визуалды иерархияға назар аударған жөн және оның негізгі өлшемі конспектілер мен тақырыптардан қалай ерекшеленеді (яғни h1>, h2>, h3>).

Интерфейсті жобалау құралымен (біз InVision Studio қолданамыз), мәтіндік қабаттар қатарын жасаңыз (Т), содан кейін барлық өлшемдерді келесі шаблонмен сәйкестендіру үшін реттеңіз:

  • h1>: 44px
  • h2>: 33px
  • h3>: 22px
  • p>: 18px

InVision Studio (және барлық басқа интерфейсті жобалау құралдары) көмегімен бұл стильдерді оң жақтағы Инспектор тақтасының көмегімен реттеу арқылы жасалады.

Әрі қарай өз қаріпіңізді таңдаңыз, бірақ сақ болыңыз, өйткені кейбір қаріптермен 18px байқаған боларсыз p> және 22px h3> бәрі бірдей ерекшеленбейді. Бізде екі таңдау бар: қаріп өлшемдерін өзгерту немесе тақырыптар үшін басқа қаріпті қарастыру. Егер сіздің дизайныңыздың мәтіні ауыр болады деп ойласаңыз, соңғысымен жүріңіз.


Есіңізде болсын:

  • Интерфейстің визуалды дизайны көбінесе ішекті сезіну тәсілі болып табылады
  • Ештеңе шешілмейді; бәрі өзгеруі мүмкін

Сызық биіктігі

Жолдың оңтайлы биіктігі мәтіннің жолдарының оқудың лайықты деңгейіне жету үшін олардың арасында жеткілікті аралық болуын қамтамасыз етеді. Бұл барған сайын «стандарт» ретінде таныла бастайды; Google-дің Lighthouse Audit құралы оны қолмен тексеруді ұсынады (немесе егер мәтін оңтайлы емес биіктік нәтижесінде бір-біріне тым жақын сілтемелер болса, жалауша).

WCAG қайтадан бізге бұл жолда көмектеседі, жолдың биіктігі қаріптің өлшемі 1,5 есе болуы керек деп мәлімдейді. Сонымен, «Сызық» астындағы интерфейсті жобалау құралында қаріптің өлшемін - кем дегенде 1,5-ке көбейтіңіз. Мысал ретінде, егер негізгі мәтін 18px болса, онда жолдың биіктігі 27px-ге тең болады (18 * 1,5 - сіз сонымен қатар математикамен тікелей инспекторда жұмыс жасай аласыз). Тағы да, назар аударыңыз - егер 1,6 есе жақсы көрінсе, 1,6 есе пайдаланыңыз. Әр түрлі қаріптер әртүрлі нәтижелер беретінін ұмытпаңыз.

Біздің дизайнымызда нақты деректерді пайдалану туралы ойлануға әлі ерте, бірақ, ең болмағанда, біз әлі де нақты деректерді (тіпті lorem ipsum) пайдалануымыз керек. InVision Studio-да біздің типографиямыздың шынымен қалай көрінетінін білуге ​​көмектесетін жергілікті деректер қосымшасы бар.

Абзацтар аралығы

Параграф аралығы - бұл біз InVision Studio's Inspector көмегімен жариялай алатын стиль емес. Керісінше, бізге Smart Guides (⌥) көмегімен қабаттарды туралау керек. Сызық биіктігіне ұқсас, сиқырлы көбейткіш 2х құрайды (қаріптің екі еселенген мөлшері). Мысал ретінде, егер қаріп өлшемі 18px болса, келесі мәтіндік блокқа кірер алдында кем дегенде 36px бос орын қалуы керек. Хат аралығы 0,12 кем болмауы керек.

Дегенмен, біз компоненттер жасай бастағанға дейін бұл туралы алаңдаудың қажеті жоқ.

Ортақ стильдер

Егер сіздің интерфейсті жобалау құралыңыз оны қолдаса (InVision Studio әзірге жоқ), көрнекі дәйектілікті қамтамасыз ете отырып, тез қайта қолдануға болатын етіп, осы типографиялық стильдерді 'Ортақ стильдерге' айналдырыңыз. Бұл әдетте инспектор арқылы жүзеге асырылады.

02. Оң жақ бояғышты таңдаңыз

Сіздің дизайныңыз үшін керемет түстерді таңдау эстетикадан да асып түседі: бұл сіздің сайтыңыздың барлық иерархиясын ақпараттандыруы мүмкін.

Интерфейс дизайны туралы айтатын болсақ, түс бізді ұнататын алғашқы нәрселердің бірі болып табылады, бірақ бізге визуалды дизайнға сүңгу жаман нәрсе деп үйретеді. Бұл, әрине, дұрыс, бірақ көрнекі консистенция туралы сөз болғанда, түс басқа проблемаларды ойнауы керек, өйткені ол басқа рөлдерді ойнайды.

Интерфейс дизайнындағы түс өте тиімді болуы мүмкін, бірақ кейбір қолданушылар (көпшілігі, шынымен де) көру қабілетінің әртүрлі түрлерінен зардап шегеді, сондықтан әрдайым сенімді бола бермейді. Айтуынша, бұл қолданылатын нақты түс туралы емес, түстің түрі туралы болуы керек. Брендингке қатысты болуы мүмкін, бұл түстер эмоционалды әсер ету үшін қолданылады, өйткені интерфейс дизайнында түс сонымен бірге ниет, мағынаны және, әрине, визуалды иерархияны хабарлау үшін қолданылады.

Үздік құралдар мен ресурстар

01. Старк
Stark плагині Sketch және Adobe XD-мен үйлеседі және сізге түстердің контрастын тексеруге және түстердің соқырлығын тікелей кенепте модельдеуге көмектеседі. Жақында Figma және InVision студияларына қолдау көрсетіледі.
02.Түстер
Түстер дегеніміз - WCAG 2.0 нұсқауларын қанағаттандыру үшін түс контрастының тиісті мөлшеріне ие 90 түстер үйлесімі, олардың кейбіреулері тіпті AAA стандартына сай келеді.
03. A11y жобасы
A11y жобасы - бұл қол жетімділікке қатысты барлық массивтер. Оған ресурстар, құралдар, кеңестер, оқулықтар кіреді және оны Stark плагинін жасаушы жасайды және InVision-тен қаржыландыруды алады.

Түстің үш түрі

Түстер мағынаны білдіреді, сондықтан олардың көп болмауы маңызды. Мағыналардың көптігі пайдаланушы түсінетін және есте сақтайтын көптеген нәрселерге әкеліп соқтырады - бұл біз үшін көбірек түстер үйлесімі туралы айтпағанда. Жалпы, бұл ұсынылатын формат болады:

  • Әрекетке шақыру түсі (сонымен қатар негізгі бренд түсі)
  • Бейтарап қара түс (интерфейс элементтеріне немесе күңгірт режимге жақсырақ)
  • Жоғарыда айтылғандардың барлығы үшін сәл жеңіл және қараңғы вариация

Бұл келесі мүмкіндік береді:

  • Қараңғы режимге оңай қол жеткізуге болады
  • Біздің CTA түсіміз ешқашан басқа түстермен қайшы келмейді
  • Кез-келген сценарийде біз баса назар аудара аламыз

Бояғышты орнатыңыз

Өзіңіздің интерфейсті жобалау құралымен әр түске («Бренд», «Бейтарап / Жеңіл» және «Бейтарап / Қараңғы» деп аталатын бір үлкен арт-тақта жасаңыз (A түртіңіз)). Содан кейін, әр артборда түстің күңгірт және жеңіл вариацияларын, сондай-ақ басқа түстердің өзін көрсететін қосымша кішігірім тіктөртбұрыштар жасаңыз.

Біз сәл ашық және күңгірт деп қарайтынбыз, сәйкесінше 10 пайыз ақ және 10 пайыз қосымша қара. Аяқтағаннан кейін әр тақтада типографиялық стильдердің көшірмесін көрсетіңіз. Бұл мәтін қабаттарының түсі бейтарап жарық болуы керек, тек бейтарап қараңғы болуы керек бейтарап ашық тақтада.

Контраст

Әрі қарай бізге түстердің оңтайлы контрастын тексеру керек. Мұны істеуге болатын әр түрлі құралдар бар, мысалы, Sketch және Adobe XD үшін Stark плагині немесе macOS үшін Contrast - дегенмен, контраст тексерушісі немесе түсті контраст тексерушісі сияқты онлайн шешім өте жақсы болады.

Әр комбинация үшін түстердің контрастын тексеріп, түстерді сәйкесінше өзгертіңіз. Егер сіз қандай түстерді қолданатындығыңызды білмесеңіз, Color Safe ұсынымдарын қолданып көріңіз.

03. Сілтемелер мен батырмалардың стилі

Өлшемі

Түймелер мен сілтемелер, типография сияқты, бірнеше вариацияға ие болуы керек. Ақыр соңында, барлық іс-әрекеттер бірдей маңыздылық деңгейіне ие емес, және біз жоғарыда айтқанымыздай, түс - бұл қарым-қатынастың сенімсіз әдісі, сондықтан ол визуалды иерархияға әсер етудің негізгі әдісі бола алмайды. Біз сондай-ақ мөлшермен ойыншық жасауымыз керек.

Көрнекі сәйкестікті тексеру дегеніміз не?

Көрнекі сәйкестік сынағы дегеніміз - мақсатты нысандардың нұқылатындығын анықтау үшін қолданылатын ыңғайлылық тесті. Дизайнды Studio-дан Freehand-қа синхрондау (⌘⇧F), алынған URL мекенжайын тестерлерге жіберіп, оларды шертілетін деп санайтын элементтерді айналдырыңыз.

InVision Studio-ның пайдаланушылары Freehand-ты да қолдана алады, бірақ InVision Studio-ның пайдаланушылары өз дизайнын FreeV-ке InVision Studio-дан үзіліссіз жібере алады, бұл пайдаланушылардан визуалды кері байланыс алудың ең жылдам және тиімді әдісі.

Әдетте, біз батырма мәтінін 18px (негізгі мәтінмен бірдей) деп жариялауды ұсынамыз, бірақ батырмалардың өздері өлшемдері бойынша үш өзгеріске ие болады:

  • Қалыпты: Биіктігі 44px (бұрыштары дөңгелектелген: 5px)
  • Үлкен: Биіктігі 54px (бұрыштары дөңгеленген: 10px)
  • Өте үлкен: Биіктігі 64px (бұрыштары дөңгелектелген: 15px)

Бұл бізге белгілі бір батырмалардың түске тәуелді болмай-ақ маңызды болып көрінуіне мүмкіндік береді, сонымен қатар ұя батырмаларын орналастырады (мысалы, формасы минималды өрістегі батырманы қолданыңыз).

Тереңдігі

Кранның нысаны батырма немесе форма өрісі болғанына қарамастан, көлеңкелерді тереңдікті арттыру үшін пайдалану керек, сондықтан интерактивтілікті ұсынады. Түймелер мен форма өрістерінің барлық нұсқаларына арналған көлеңкелі стиль жақсы.

Интерактивтілік

Әрбір батырма түріне оның күйін көрсету үшін вариация қажет. Бұл қолданушыға олардың не істеуге тырысқанының толықтай жақсы болатындығын түсіндіреді және олардың кідіріссіз орындалуын қамтамасыз етеді.

Бұл шын мәнінде көрнекі консистенцияны сақтаудың біршама күрделі аспектілерінің бірі, өйткені күйді құру кезінде түс жиі өзгеретін стиль болып табылады. Бақытымызға орай, бұл күй өзгерістері айтарлықтай нәзік болуы мүмкін, сондықтан түсін сәл ашық немесе күңгірт түріне ауыстырған дұрыс - сол үшін олар қажет. Бұл сілтемелерге де қатысты.

Бұған қарсы шешім қабылдау бізде әлдеқашан маңызды мағынаға ие, соның салдарынан пайдаланушылар абдырап қалатын немесе басқа түсті ойлап табуға шешім қабылдайтын түстерді қолдануға мәжбүр етеді. Қосымша түсті қолдану туралы шешім өте жақсы, бірақ оны интерфейс элементтерінен гөрі маркетингтік визуалдау үшін сақтау керек. Аз - көп (және оңай).

Әрбір арт тақта үшін бұл қадамды қайталауды ұмытпаңыз. Брендтік тақтаға брендті CTA батырмаларын қоспаңыз - кейінірек белгілі комбинациялар жұмыс істемей қалса не болатынын қарастырамыз.

04. Өз компоненттеріңізді жасаңыз

Компоненттер уақытты үнемдеуге мүмкіндік береді және интерфейсті жобалаудың барлық құралдары осы мүмкіндікті ұсынады (мысалы, Sketch-те олар Symbols деп аталады). Studio-да біз компоненттерді құрайтын барлық қабаттарды таңдап, ⌘ көмегімен компоненттер жасай аламызҚ төте жол.

Компоненттерді пайдалану

Сымды кадрларды пайдалану

Сымсыз кадрлар өте ыңғайлы интерфейстерді жобалау үшін ғана емес, сонымен бірге біздің интерфейсіміз ұзақ мерзімді перспективада не қажет ететіндігін білу үшін де өте пайдалы. Бұл болашақтың дәлелі сияқты.

Бұл біз көптеген компоненттерді жобалауымыз немесе кез-келген ықтимал сценарийге дайын болуымыз керек дегенді білдірмейді, бірақ «егер болса?» Деген көзқарасты қолдану керек дегенді білдіреді.

Мысалы, егер біздің сымсыз кадрымыз 3х1 компонентті талап етсе, бірақ оның мазмұны тасқа қондырылмағанын білсек, кішкене ойлану бізді ойландыруы мүмкін: ‘Егер бұл компоненттер 4х1 болып бітсе ше?”. Бас бармақ қағидасы: қолданушының бұрыннан бар қажеттіліктеріне арналған дизайн, бірақ шешімдерді салыстырмалы түрде икемді етуге тырысады. Әйтпесе, біз кейінірек сызықшада өте «дизайнерлік қарызды» бастаймыз.

Енді біз бұл компонентті сол жақтағы Кітапханалар> Құжаттан кенепке сүйреп апара отырып, қайта қолдана аламыз, дегенмен бұл жұмыс процесі сіздің интерфейс құралына байланысты әр түрлі болуы мүмкін екенін ескеріңіз.

Стиль нұсқаулығын жасаудың бұл әдісі (ақыр соңында дизайнның өзін жасайды), әсіресе модульдік / картаға негізделген макеттермен жақсы жұмыс істейді, дегенмен, тақырыптар, колонтитулдар мен навигациялар сияқты «жалпы аймақтар» компонентке өте жақсы үміткерлер болып табылады.

Біздің типографиялық стильдеріміз, түстеріміз және түймелеріміз сияқты, біз де компоненттерімізді мұқият ұйымдастыруды ұмытпауымыз керек.

Біздің ережелерімізді пайдалану

Бұрын біз брендтің түсінің үстінде брендті CTA батырмаларын пайдаланбау туралы ескерту жасаған болатынбыз, өйткені брендті CTA түймелері басқалардан ерекшеленуі керек. Сонымен, брендті CTA батырмасын қолдана отырып, фирмалық компонентті қалай жасауға болады? Ақыр соңында, егер біз бейтарап қараңғы түймелерді қолданатын болсақ, мысалы, навигациялық түймелер немесе жай ғана маңызды емес түймелер, бұл мүмкін емес болар еді?

Дұрыс. Сонымен, бұл компонент құрудың тамаша мүмкіндігі болар еді, атап айтқанда, тақырып + мәтін + батырмалар тіркесімі. Брендтік батырманы пайдалануға мүмкіндік беру үшін бейтарап жарық ’картасын’ фонын қалай жасағанымды байқаңыз. Сол сияқты, бейтарап жарық формасы өрісі (форма өрістері, әдетте, қағаз формаларымен синоним болып табылатын ақыл-ой моделіне байланысты ақ түске ие) бейтарап жарық фонында таңғажайып көрінбейді, сондықтан оларды тек бейтарап қараңғы фонда - тікелей немесе шегінде қолдануға болады бейтарап қараңғы компонент. Біздің ережелерімізді сақтай отырып және бірізділікті сақтай отырып, біз дизайнымызды икемді етіп жасаймыз.

Стресс-тестілеу

Ең дұрысы, дизайндағы сенімділікті қамтамасыз етудің жылдам әрі тиімді тәсілі - оны стресс-тест. Дизайнды сынақтан өткізу қатыгездікті білдіреді. Айталық, бізде X элементтері бар навигация бар, өйткені бұл талап болды; икемділікті шынымен қамтамасыз ету үшін, осы талаптарды көбірек nav элементтерін қосу арқылы өзгертуге тырысыңыз немесе жұмыстарға кілт жіберу үшін, басқаларға қарағанда визуалды иерархиясы жоғары nav элементін қосып көріңіз. Біздің өлшеміміз, типографиямыз және түс ережелеріміз осындай нәрсеге жол бере ме? Немесе оңтайлы ыңғайлылықты ұсыну үшін тағы бір ереже керек пе?

Ережелерді қосу мен ережелерді июдің арасындағы айырмашылық бар екенін ұмытпаңыз. Шеткі жағдайлардың көп болуы консистенцияның аздығын білдіреді, сондықтан көбінесе компонентті қайта қарау ыңғайлы болу үшін жақсырақ болады.

05. Құжаттаңыз және бірлесіп жұмыс жасаңыз

Дизайн файлдарын өзіміз үшін де, дизайнерлік файлды қолдануы мүмкін кез-келген дизайнерлер үшін де қалай жеңілдетеміз? Оларды сенімді, ортақ бұлт қоймасында қауіпсіз сақтау маңызды, мұны сіз білесіз.

Түстер

Бірінші қадам, егер біз бұны жасамаған болсақ, барлық түстерді 'Document Colors' үлгісіне сақтау керек - бұл оларды өз дизайнымызда қолдану керек болған кезде оларға қол жетімділікті жеңілдетеді.Ол үшін Инспектордан түсті таңдаушы виджетін ашып, ашылмалы тізімнен 'Құжаттар түстері' таңдап, + + белгішесін басып, бояу үлгісіне түс қосыңыз. Бұл интерфейстің көптеген құралдарында дәл осылай жұмыс істейді.

Ортақ кітапханалар

Әрі қарай, біз құжатымызды типографиялық стильдермен, түстермен, түймелермен, жалпы аймақпен және негізгі компоненттермен толықтай - ортақ кітапханаға айналдыруымыз керек.

Бұл, әрине, тек бір қабаттан тұрса да, әр элементтің құрамдас бөлігі болуы керек дегенді білдіреді. Сол жақтағы Кітапханалар панеліндегі + ‌ батырмасын басыңыз, содан кейін дәл осы құжатты жаңа құжатқа импорттаңыз. Дәл солай: біздің құжат қазір кітапхана болып табылады және интерфейсті кепілдендірілген келісімділікпен жобалауға пайдалануға дайын.

InVision студиясы InVision-дің жобалау жүйесі менеджерінің ресми құралымен синхрондалмайтындығына байланысты біршама шектеулі, бірақ уақыт өте келе басқа дизайнерлерге пайдалану және жаңарту үшін кітапхананы Dropbox-та орналастыру жеткілікті. Өзгеріс енгізілгенде (жергілікті немесе қашықтан), кітапхананы пайдаланатын әрбір Studio файлы (қайтадан, жергілікті немесе қашықтан) түстер мен компоненттерді жаңартқыңыз келетіндігін сұрайды. Дизайн кітапханалары командалар арасында осылай жүргізіледі.

Барлығын қайта өңдеңіз

Көрнекі түрде үйлесімді пайдаланушы интерфейстерін жобалау туралы айтатын болсақ, бәрін қайта қолданыңыз. Түймелерді жасаңыз, содан кейін түймешік компоненттерін жасау үшін батырмаларды қолданыңыз, содан кейін пайдаланыңыз
ескерту және диалогтық терезелер сияқты басқа компоненттерді жасау үшін батырма компоненттері.

Тек қажет емес компоненттерді жасамаңыз. Есіңізде болсын, кітапхана салу - бұл тұрақты, бірлескен күш. Мұны бірден аяқтаудың қажеті жоқ, оны сіз жалғыз аяқтайсыз немесе ешқашан аяқтай алмайсыз. Ол тек тілді жеткізуі керек.

Масштабта жобалау

Дизайн кеңейген сайын оны басқару қиындай түседі. Оны тиімді және тұрақты ұстау үшін әр түрлі түзетулер енгізуге болады, әсіресе InVision компаниясының DSM студиясымен әлі жұмыс істемейді.

Мысалы, біз мәтіндік қабаттарды әр түрлі элементтердің жағдайларын түсіндіру құралы ретінде кітапханамызға түсініктеме беру үшін пайдаланғымыз келуі мүмкін. Типографиялық стильдер үшін біз мәтінді сипаттамалы етіп өңдей аламыз (мысалы, «h1> / 1.3 / 44px»). Бұл айтады h1>s 44px және сызықтың биіктігі 1,3 болуы керек.

Handoff дизайны

Дизайнды беру құралдары дизайнерлер қолданбаны немесе веб-сайтты құра алатындай етіп дизайндағы барлық элементтер қолданатын әртүрлі стильдерді көрсетеді. Бұл құралдар стильдерге шолу, сонымен қатар «құжат түстерінің» үлгісінің көшірмесін қамтиды. Әзірлеушілер тіпті осы стильдерді код ретінде көшіре алады, егер сіз кез-келген жазбаша жобалық құжаттама жасауды шешсеңіз және компоненттердің код үзінділерінің көріністерін қосқыңыз келсе, өте жақсы болады.

Егер сіз веб-сайттың ақаулықтарын жою және басқару туралы алаңдасаңыз, дұрыс веб-хостинг қызметін алғаныңызға көмектеседі, бірақ сіздің дизайн жүйеңізде InVision компаниясының дизайнды жіберу құралы Inspect қолданатын нәрсе. Оны пайдалану үшін InVision Studio-да ‘InVision-ге жариялау’ батырмасын / белгішесін нұқып, алынған URL мекенжайын ашып, одан кейін Inspect режиміне ауысу үшін түртеміз. Бұл шынымен ыңғайлы.

Бұл мазмұн бастапқыда нет журналда пайда болды.

Бөлу
Қалпына келтірілген ноутбукта қалпына келтіру дискісіз парольді қалай қалпына келтіруге болады
Оқу

Қалпына келтірілген ноутбукта қалпына келтіру дискісіз парольді қалай қалпына келтіруге болады

«Шамамен екі ай бұрын мен екінші қолмен ноутбук сатып алдым. Оның басқа пароль сұрайтынын білмей шешіп алдым. Мен қалпына келтіру дискісін алған жоқпын. Қалпына келтірілген ноутбукта қалпына келт...
IPhone 6 және 6 Plus құпия кодын қалай оңай ашуға болады
Оқу

IPhone 6 және 6 Plus құпия кодын қалай оңай ашуға болады

IPhone кодын ұмытып кету немесе бірнеше рет дұрыс емес әрекеттің салдарынан құрылғыдан шығып қалу - бұл қалыпты жағдай. Енді сіз iPhone 6-да дәл осындай жағдайды бастан өткеріп жатқан болсаңыз iPhone ...
Microsoft тіркелгісімен компьютерге қалай кіруге болады
Оқу

Microsoft тіркелгісімен компьютерге қалай кіруге болады

Егер сізде Microoft тіркелгісіне кіруді компьютерде қалай қосуға болатындығы туралы ойлансаңыз немесе сіз оны қосқан болсаңыз, бірақ Microoft тіркелгісіне кіру паролін ұмытып қалған болсаңыз, онда сіз...