Ezzel az azonosítóval hivatkozhat erre a dokumentumra forrásmegjelölésben vagy hiperhivatkozás esetén: http://elartu.tntu.edu.ua/handle/lib/49570
Összes dokumentumadat
DC mezőÉrtékNyelv
dc.contributor.advisorДмитроца, Леся Павлівна-
dc.contributor.advisorDmytrotsa, Lesia-
dc.contributor.authorМацюк, Мар’яна Сергіївна-
dc.contributor.authorMatsiuk, Mariana Serhiivna-
dc.date.accessioned2025-07-05T09:34:28Z-
dc.date.available2025-07-05T09:34:28Z-
dc.date.issued2025-06-26-
dc.date.submitted2025-06-12-
dc.identifier.citationМацюк М. С. Створення адаптивного дизайну веб-сайту квіткової крамниці «Flora» за допомогою Figma : робота на здобуття кваліфікаційного ступеня бакалавра : спец. 122 - комп’ютерні науки / наук. кер. Л. П. Дмитроца. Тернопіль : Тернопільський національний технічний університет імені Івана Пулюя, 2025. 58 с.uk_UA
dc.identifier.urihttp://elartu.tntu.edu.ua/handle/lib/49570-
dc.descriptionРоботу виконано на кафедрі комп'ютерних наук Тернопільського національного технічного університету імені Івана Пулюя. Захист відбудеться 26.06.2025р. на засіданні екзаменаційної комісії №30 у Тернопільському національному технічному університеті імені Івана Пулюяuk_UA
dc.description.abstractКваліфікаційна робота присвячена дослідженню принципів створення адаптивного дизайну вебсайту для квіткової крамниці «Flora» за допомогою Figma. У першому розділі висвітлено підходи для побудови зрозумілого та цілісного інтерфейсу із використанням принципів UI/UX – дизайну. Розглянуто значення адаптивності у формуванні позитивного користувацького досвіду, а також проаналізовано конкурентне середовище у сфері продажу квітів. У другому розділі проведено аналіз програмного забезпечення для реалізації поставлених завдань. Досліджено переваги використання Figma як основного інструменту для розробки дизайну вебсайту. У третьому розділі представлено практичну реалізацію дизайну вебсайту квіткової крамниці. Описано вибір кольорів та типографіки, побудову структури основної версії сайту, а також створення дизайну для мобільних пристроїв. Крім того, наведено опис створення прототипу. Четвертий розділ присвячено безпеці життєдіяльності та основам охорони праці. Описано вплив кольору на покращення роботоздатності, наведено вимоги організації безпечних умов праці користувачів ПК та розглянуто рекомендації щодо надання долікарської допомоги в умовах надзвичайної ситуаціїuk_UA
dc.description.abstractThe qualification work is dedicated to the study of the principles of creating a responsive website design for the flower shop «Flora» using Figma. In the first section, approaches to building a clear and cohesive interface using UI/UX design principles are presented. The importance of responsiveness in shaping a positive user experience is examined, along with an analysis of the competitive environment in the flower sales industry. In the second section, an analysis of software for the implementation of the assigned tasks is conducted. The advantages of using Figma as the primary tool for website design development have been studied. In third section presents the practical implementation of the flower shop`s website design. The choice of colors and typography, the construction of the main version structure, as well as the creation of the design for mobile devices are described. In addition, a description of the creation of a prototype is provided. The fourth section is dedicated to life safety and the fundamentals of occupational health. The influence of color on improving work capacity is described, the requirements for organizing safe working conditions for PC users are provided, and recommendations for providing first aid in emergency situationsuk_UA
dc.description.tableofcontentsВСТУП 8 РОЗДІЛ 1. ПІДХОДИ ДО РОЗРОБКИ ЕФЕКТИВНОГО ТА АДАПТИВНОГО ВЕБІНТЕРФЕЙСУ 9 1.1 UI/UX – дизайн для побудови зрозумілого та цілісного інтерфейсу 9 1.2 Роль адаптивності у формуванні позитивного користувацького досвіду 10 1.3 Огляд конкурентного середовища 11 РОЗДІЛ 2. АНАЛІЗ ПРОГРАМНОГО ЗАБЕЗПЕЧЕННЯ ДЛЯ РЕАЛІЗАЦІЇ ПРОЄКТУ 17 2.1 Критерії вибору інструментів для створення дизайну вебсайту. 17 2.2 Оцінка програмного забезпечення для розробки UI/UX 18 2.2.1 Sketch для побудови дизайн – систем і векторної графіки 19 2.2.2 Adobe XD як інструмент для інтерактивного прототипування 20 2.2.3 InVision для демонстрації користувацьких сценаріїв 20 2.2.4 Axure RP для моделювання логіки інтерфейсу 21 2.2.5 Figma для побудови макетів і візуального структурування сторінок 22 2.3 Використання Figma для реалізації проєктного рішення. 23 РОЗДІЛ 3. РОЗРОБКА ДИЗАЙНУ ВЕБСАЙТУ КВІТКОВОЇ КРАМНИЦІ «FLORA» 24 3.1 Вибір кольору та типографіки для побудови цілісного інтерфейсу 24 3.2 Створення дизайну вебсайту квіткової крамниці 29 3.3 Розробка дизайну мобільної версії «Flora» 33 3.4 Побудова прототипу для візуалізації взаємодії користувача із сайтом 38 РОЗДІЛ 4. БЕЗПЕКА ЖИТТЄДІЯЛЬНОСТІ, ОСНОВИ ОХОРОНИ ПРАЦІ 44 4.1 Вплив кольору на покращення умов праці 44 4.2 Організація безпечних умов праці користувачів ПК 45 4.3 Долікарська медична допомога в умовах надзвичайної ситуації 46 ВИСНОВКИ 48 ПЕРЕЛІК ДЖЕРЕЛ 49 ДОДАТКИuk_UA
dc.format.extent58-
dc.language.isoukuk_UA
dc.publisherТНТУ ім. І.Пулюя, ФІС, м. Тернопіль, Українаuk_UA
dc.subject122uk_UA
dc.subjectадаптивний дизайнuk_UA
dc.subjectдизайн вебсайтуuk_UA
dc.subjectпрототипуванняuk_UA
dc.subjectтипографікаuk_UA
dc.subjectінтерфейсuk_UA
dc.subjectdesignuk_UA
dc.subjectinterfaceuk_UA
dc.subjectprototypinguk_UA
dc.subjecttypographyuk_UA
dc.subjectwebsiteuk_UA
dc.subjectresponsive designuk_UA
dc.titleСтворення адаптивного дизайну веб-сайту квіткової крамниці «Flora» за допомогою Figmauk_UA
dc.title.alternativeCreating an Adaptive Design for the «Flora» Flower Shop Website Using Figmauk_UA
dc.typeBachelor Thesisuk_UA
dc.rights.holder© Мацюк Мар‘яна Сергіївна, 2025uk_UA
dc.coverage.placenameТернопільuk_UA
dc.subject.udc004.51uk_UA
dc.relation.references1 Струтинська І. В., Дмитроца Л. П., Сороківська О. А., Козбур Г. В. Особливості цифрового розвитку малого і середнього бізнесу України, країн Європи та G7 / І. В. Струтинська, Л. П. Дмитроца, О. А. Сороківська, Г. В. Козбур // Трансформація бізнесу для сталого майбутнього: дослідження, цифровізація та інновації: монографія. – ФОП Паляниця В. А., 2024. – С. 411- 427.uk_UA
dc.relation.references2 UX/UI дизайн – що це таке та як його правильно застосовувати [Електронний ресурс]. – Режим доступу: https://www.site2b.ua/ua/web-blog-ua/ux-ui-dizajn-shho-ce-take-ta-yak-jogo-pravilno-zastosovuvati.html (дата звернення: 24.05.2025).uk_UA
dc.relation.references3 UI Design Blog and Tutorials — Toptal [Електронний ресурс]. Режим доступу до ресурсу: https://www.toptal.com/designers/blog/ui-design (дата звернення: 24.05.2025).uk_UA
dc.relation.references4 UX Design Principles — Gabriela Arcia (2023) [Електронний ресурс]. – Режим доступу до ресурсу: https://medium.com/@gabrielaaarcia/ux-design-principles-d163e9871845 (дата звернення: 24.05.2025).uk_UA
dc.relation.references5 CASES. Як зробити аналіз цільової аудиторії? [Електронний ресурс]. – Режим доступу до ресурсу: https://cases.media/article/yak_zrobiti_analiz_cilovoyi_audit (дата звернення: 24.05.2025).uk_UA
dc.relation.references6 Найкращі практики адаптивного веб-дизайну — Dizz Agency (2023) [Електронний ресурс]. – Режим доступу до ресурсу: https://dizz.in.ua/uk/najkrashhi-praktiki-adaptivnogo-veb-dizajnu/ (дата звернення: 25.05.2025).uk_UA
dc.relation.references7 Адаптивний дизайн сайту і його основні переваги — Selector.Space (2021) [Електронний ресурс]. – Режим доступу до ресурсу: https://blog.selector.space/blog/адаптивний-дизайн-сайту/ (дата звернення: 25.05.2025).uk_UA
dc.relation.references8 Дмитроца Л., Старицький О. Оптимізація продуктивності та SEO при масштабуванні проєктів на основі React і Next.js / Л. Дмитроца, О. Старицький. – Збірник тез доповідей ⅩⅢ Міжнародної науково-практичної конференції молодих учених та студентів «Актуальні задачі сучасних технологій». – 2024. – С. 465–466.uk_UA
dc.relation.references9 Мацюк М. Адаптивний інтерфейс вебсайту з урахуванням принципів UX / UI дизайну / М. Мацюк. – VIII Міжнародна студентська науково-технічна конференція «Природничі та гуманітарні науки. Актуальні питання» – Тернопіль: Тернопільський національний технічний університет ім. І. Пулюя, 2025., 24–25 квіт. – С. 176 –177.uk_UA
dc.relation.references10 A Guide to Competitive Analysis for UX Design [Електронний ресурс]. – Режим доступу: https://medium.com/design-bootcamp/a-guide-to-competitive-analysis-for-ux-design-1ddafeb9a3e7 (дата звернення: 26.05.2025).uk_UA
dc.relation.references11 Flowers.ua [Електронний ресурс]. – Режим доступу до ресурсу: https://flowers.ua/ (дата звернення: 26.05.2025).uk_UA
dc.relation.references12 UFL (Українська служба доставки квітів) [Електронний ресурс]. – Режим доступу до ресурсу: https://www.u-f-l.net/ (дата звернення: 26.05.2025).uk_UA
dc.relation.references13 Мушинська Г., Дмитроца Л. П. Ефективність чат-ботів у сфері електронної комерції / Г. Мушинська, Л. П. Дмитроца // Трансформація бізнесу для сталого майбутнього: дослідження, діджиталізація та інновації: збірник тез доповідей Ⅱ Міжнародної науково-практичної конференції. – 2022. – С. 47–49.uk_UA
dc.relation.references14 Kvitna.ua – Електронний ресурс. – Режим доступу: https://kvitna.ua/ (дата звернення: 26.05.2025).uk_UA
dc.relation.references15 ТОП -10 інструментів для UX/UI дизайнера [Електронний ресурс]. – Режим доступу до ресурсу: https://ocean-agency.com.ua/top-10-instrumentiv-dlya-ux-ui-dizajnera (дата звернення: 27.05.2025).uk_UA
dc.relation.references16 UI/UX Tools for Beginners: Designing and Prototyping in Sketch — Ramotion [Електронний ресурс]. Режим доступу до ресурсу: https://store.ramotion.com/blog/ui-ux-tools-for-beginners-designing-and-prototyping-in-sketch/ (дата звернення: 27.05.2025).uk_UA
dc.relation.references17 Sketch. Інструменти для прототипування у Sketch [Електронний ресурс]. Режим доступу до ресурсу: https://www.sketch.com/prototype/ (дата звернення: 27.05.2025).uk_UA
dc.relation.references18 Sketch. Офіційний сайт програми Sketch [Електронний ресурс]. Режим доступу до ресурсу: https://www.sketch.com (дата звернення: 27.05.2025).uk_UA
dc.relation.references19 Adobe XD. Довідка користувача [Електронний ресурс]. – Режим доступу до ресурсу: https://helpx.adobe.com/ua/xd/user-guide.html (дата звернення: 27.05.2025).uk_UA
dc.relation.references20 Simplilearn. Adobe XD Tutorial: What is Adobe XD and How to Use it? [Електронний ресурс]. – Режим доступу до ресурсу: https://www.simplilearn.com/tutorials/ui-ux-career-resources/adobe-xd (дата звернення: 27.05.2025).uk_UA
dc.relation.references21 Kaarwan. How to Use InVision for Prototyping: A Comprehensive Guide [Електронний ресурс]. – Режим доступу до ресурсу: https://www.kaarwan.com/blog/ui-ux-design/how-to-use-invision-for-prototyping-a-comprehensive-guide?id=1403 (дата звернення: 28.05.2025).uk_UA
dc.relation.references22 ProfileTree. Prototyping Made Easy with InVision [Електронний ресурс]. – Режим доступу до ресурсу: https://profiletree.com/prototyping-made-easy-with-invision/ (дата звернення: 28.05.2025).uk_UA
dc.relation.references23 Axure. Official website of Axure RP – UX Prototypes, Specifications, and Diagrams [Електронний ресурс]. – Режим доступу до ресурсу: https://www.axure.com/ (дата звернення: 28.05.2025).uk_UA
dc.relation.references24 Axure Boutique. Axure Tutorial – Actions Full Guide: Axure Interactive Template [Електронний ресурс]. – Режим доступу до ресурсу: https://axureboutique.medium.com/axure-tutorial-actions-full-guide-axure-interactive-template-4f0808ac4eb0 (дата звернення: 28.05.2025).uk_UA
dc.relation.references25 Figma. Офіційний сайт Figma – інструмент для створення UI/UX дизайну [Електронний ресурс]. – Режим доступу до ресурсу: https://www.figma.com/ (дата звернення: 28.05.2025).uk_UA
dc.relation.references26 Mate Academy. Figma shortcuts: швидкі клавіші для ефективної роботи у Figma [Електронний ресурс]. – Режим доступу: https://mate.academy/blog/ui-ux-design/figma-shortcuts/ (дата звернення: 28.05.2025).uk_UA
dc.relation.references27 UX Playbook. Figma tips for UX designers [Електронний ресурс]. – Режим доступу: https://uxplaybook.org/articles/figma-tips-for-ux-designers (дата звернення: 28.05.2025).uk_UA
dc.relation.references28 CareerFoundry. Beginner’s guide to typography [Електронний ресурс]. – Режим доступу: https://careerfoundry.com/en/blog/ui-design/beginners-guide-to-typography/ (дата звернення: 29.05.2025).uk_UA
dc.relation.references29 Typography. 10 порад для типографіки у Web дизайні [Електронний ресурс]. – Режим доступу: https://medium.com/@uiuxukr/10-7de8e1567a0e (дата звернення: 29.05.2025).uk_UA
dc.relation.references30 Webpromo. Як вибрати гамму кольорів для дизайну сайту? [Електронний ресурс]. – Режим доступу: https://web-promo.ua/ua/blog/kak-vybrat-cvetovuyu-gammu-dlya-dizaina-sajta/ (дата звернення: 29.05.2025).uk_UA
dc.relation.references31 Brainlab. Колір в веб-дизайні: особливості використання та основні тренди 2020 [Електронний ресурс]. – Режим доступу: https://brainlab.com.ua/uk/blog-uk/kolr-v-veb-dizayn-osoblivost-vikoristannya-ta-osnovni-trendu-2020 (дата звернення: 29.05.2025).uk_UA
dc.relation.references32 Скиба, О. П., Назаревич, О. Б., & Шимчук, Г. В. (2019). Комп’ютерна графіка: методичний посібник та завдання до виконання графічних та самостійних робіт для студентів усіх форм навчання спеціальностей 122" Комп’ютерні науки" та 123" Комп’ютерна інженерія" з курсу" Комп’ютерна графіка".uk_UA
dc.relation.references33 Шимчук, Г. В., Маєвський, О. В., & Назаревич, О. Б. (2016). Конспект лекцій з дисципліни Комп’ютерна графіка для студентів освітнього рівня «бакалавр» спеціальності 125 «Кібербезпека».uk_UA
dc.relation.references34 Evergreen. Прототип сайту – як він допомагає оцінювати і розробляти сайти [Електронний ресурс]. – Режим доступу: https://evergreens.com.ua/ua/articles/prototype-site.html.uk_UA
dc.relation.references35 StudentBooks. Вплив кольору на людину та її працездатність – Електронний ресурс. – Режим доступу: URL: https://studentbooks.com.ua/content/view/955/76/1/4/ (дата звернення: 30.05.2025).uk_UA
dc.relation.references36 ДСТУ ISO 9241-5:2004. Ергономічні вимоги до офісних робочих місць з відеотерміналами (ВДТ). Частина 5. Розташування робочого місця та робоче положення користувача. – Чинний від 2005-01-01. – К.: Держспоживстандарт України, 2004. – 15 с.uk_UA
dc.relation.references37 Onninen. Як світлі кольори впливають на ефективність роботи – Електронний ресурс. – Режим доступу: URL: https://onninen.ua/stattya/jak-svitli-kolbory-vplyvajutb-na-efektyvnistb-roboty (дата звернення: 30.05.2025).uk_UA
dc.relation.references38 ДСТУ EN 12464-1:2017. Світло та освітлення. Освітлення робочих місць. Частина 1. Робочі місця в приміщеннях. – Чинний від 2018-01-01. – К.: ДП «УкрНДНЦ», 2017. – 45uk_UA
dc.relation.references39 Держпраці. Охорона праці при роботі з комп’ютером: роз’яснює Держпраці – Електронний ресурс: – Режим доступу: URL: https://news.dtkt.ua/labor/labor-relations/39447-oxorona-praci-pri-roboti-z-kompiuterom-roziasniuye-derzpraci (дата звернення: 30.05.2025).uk_UA
dc.relation.references40 Paramdic.ua. Як надати першу допомогу при кровотечах? – Електронний ресурс. – Режим доступу: URL: https://paramedic.ua/ua/pervaja-pomoshh-pri-krovotechenii (дата звернення: 30.05.2025).uk_UA
dc.relation.references41 PHC.org.ua. Як надавати першу домедичну допомогу при термічних опіках – Електронний ресурс. – Режим доступу: URL: https://phc.org.ua/news/yak-nadavati-pershu-domedichnu-dopomogu-pri-termichnikh-opikakh (дата звернення: 30.05.2025).uk_UA
dc.contributor.affiliationТНТУ ім. І. Пулюя, Факультет комп’ютерно-інформаційних систем і програмної інженерії, Кафедра комп’ютерних наук, м. Тернопіль, Українаuk_UA
dc.coverage.countryUAuk_UA
Ebben a gyűjteményben:122 — Компʼютерні науки (бакалаври)

Fájlok a dokumentumban:
Fájl Leírás MéretFormátum 
2025_KRB_SN-42_Matsiuk_M.S..pdfДипломна робота2,33 MBAdobe PDFMegtekintés/Megnyitás


Minden dokumentum, ami a DSpace rendszerben szerepel, szerzői jogokkal védett. Minden jog fenntartva!

Admin Tools