ІНТЕРНЕТ ПЛАТФОРМА З ПРОДАЖУ ЕНЕРГОНЕЗАЛЕЖНИХ РОЗУМНИХ ПРИСТРОЇВ

Ясюк, Дмитро Олегович
Please use this identifier to cite or link to this item: https://er.chdtu.edu.ua/handle/ChSTU/6881
Title:	ІНТЕРНЕТ ПЛАТФОРМА З ПРОДАЖУ ЕНЕРГОНЕЗАЛЕЖНИХ РОЗУМНИХ ПРИСТРОЇВ
Authors:	Катаєв, Дмитро Сергійович Ясюк, Дмитро Олегович
Keywords:	інтернет-платформа;WORDPRESS;енергонезалежні пристрої;електронна комерція;MAMP
Issue Date:	5-Jun-2025
Abstract:	. У сучасних умовах глобальних екологічних викликів та зростаючої потреби в раціональному використанні природних ресурсів особливого значення набуває розробка й впровадження енергонезалежних пристроїв, що функціонують на основі альтернативних джерел енергії. Такі технології є ключовими для мінімізації негативного впливу людської діяльності на довкілля. Крім того, стрімкий розвиток технологій і постійне підвищення вартості традиційних енергоносіїв стимулюють пошук ефективних енергетичних рішень. Створення інтернет-платформ для підтримки енергонезалежних пристроїв має вагоме економічне значення: воно сприяє формуванню нових ринкових ніш, активізації інвестиційної діяльності та загальному економічному зростанню. Водночас застосування таких технологій підвищує енергетичну автономність домогосподарств, зменшує залежність від централізованих систем енергопостачання та покращує якість життя населення. Усе це комплексно впливає на соціально-економічний розвиток суспільства. Отже, розбудова інтернет-платформи для енергонезалежних пристроїв є актуальним завданням, що поєднує екологічну доцільність, економічну вигоду та соціальну значущість.
URI:	https://er.chdtu.edu.ua/handle/ChSTU/6881
Appears in Collections:	126 Інформаційні системи та технології (Web-технології, web-дизайн)
Files in This Item:
File	Description	Size	Format
РЕП_БАК_Ясюк_WEB-2111.pdf Restricted Access		3.02 MB	Adobe PDF	View/Open Request a copy
Show full item record
Extracted text
МІНІСТЕРСТВО ОСВІТИ І НАУКИ УКРАЇНИ 
ЧЕРКАСЬКИЙ ДЕРЖАВНИЙ ТЕХНОЛОГІЧНИЙ УНІВЕРСИТЕТ 
 
Факультет інформаційних технологій і систем 
 
Кафедра інформаційних технологій проектування 
 
 
 
 
 
 
Пояснювальна записка 
до кваліфікаційної роботи  
                                         бакалавра       
 (освітньо-кваліфікаційний рівень) 
 
на тему: «ІНТЕРНЕТ ПЛАТФОРМА З ПРОДАЖУ ЕНЕРГОНЕЗАЛЕЖНИХ 
РОЗУМНИХ ПРИСТРОЇВ» 
 
 
 
 
Виконав: студент 4 курсу, групи WEB-2111 
  
спеціальності  126 – «Інформаційні технології 
проектування»       
                                                                     (шифр і назва спеціальності) 
 
освітня програма «Інформаційні технології 
проектування»       
 
Ясюк Дмитро 
 
Керівник___________   Катаєв Д.С.    
                                                                  (прізвище та ініціали) 
 
Рецензент___________          
                                                             (прізвище та ініціали) 
 
 
 
 
 
 
 
 
 
Черкаси 2025 року 
Бланк завдання на кваліфікаційну роботу бакалавра студенту 
 
Черкаський державний технологічний університет 
Факультет Інформаційних технологій і систем 
Кафедра Комп’ютерних наук та системного аналізу 
Освітньо-кваліфікаційний рівень Бакалавр 
Спеціальність 126  – Інформаційні технології проектування 
Освітня програма Інформаційні технології проектування 
 
 
ЗАТВЕРДЖУЮ 
Завідувач кафедри ІТП  
_______________ Тетяна ПРОКОПЕНКО 
«____» _____________ 2025 р. 
 
ЗАВДАННЯ 
на кваліфікаційну роботу бакалавра студенту 
Ясюку Дмитру 
(прізвище, ім’я, по батькові) 
1. Тема роботи  ІНТЕРНЕТ ПЛАТФОРМА З ПРОДАЖУ ЕНЕРГОНЕЗАЛЕЖНИХ  
                        РОЗУМНИХ ПРИСТРОЇВ          
 
Керівник роботи     Катаєв Д.С., к.т.н., старший викладач   
(прізвище, ім’я, по батькові, науковий ступінь, вчене звання) 
затверджені наказом університету від «25» лютого 2025 р. №25/03-03. 
 
2. Строк подання студентом роботи «06» червня 2025 року  
3. Вихідні дані до роботи:  
Практичні навики роботи з інформаційними ресурсами. Робота з базами даних. 
Звіт з виробничої практики. Звіт з переддипломної практики. 
4. Зміст пояснювальної записки (перелік питань, що їх належить розробити): 
Вступ 
4.1. Дослідження предметної області 
4.2. Проєктування інтернет платформи енергонезалежних пристроїв 
4.3. Програмна реалізація інтернет-платформи енергонезалежних пристроїв 
Висновки.  
 5. Перелік додатків (з точним зазначенням назв додатків): 
5 .1. Додаток А. Специфікація 482.ЧДТУ. 50000-01. 
 51..2 І.н Дстордуактцоікя  Бк.о Треиксстту впарчоаграми. 
5.3. Додаток В. Інструкція користувача. 
 5.4. Презентація у вигляді 24 слайдів. 
 
 
 
 
6. Консультанти розділів роботи 
Прізвище, ініціали та Підпис, дата 
Розділ посада 
консультанта завдання видав завдання прийняв 
 
    
    
 
7. Дата видачі завдання 15.01.2025 р. 
  
 
КАЛЕНДАРНИЙ ПЛАН 
№ з/п Назва етапів кваліфікаційної роботи бакалавра Строк виконання 
  етапів роботи Примітка 
 
1 Видача завдання на кваліфікаційну роботу 
бакалавра. до 15.01.2025 Виконано 
 
2 Аналіз літературних джерел, об’єкту та предмету 
дослідження. до 12.02.2025 Виконано 
 
3 Написання теоретичного розділу кваліфікаційної 
роботи бакалавра до 18.03.2025 Виконано 
. 
4 Написання аналітичного розділу (аналіз об’єкту 
й предмету дослідження). до 01.04.2025 Виконано 
 
5 Написання практичних розділів й висновків по 
роботі. до 01.05.2025 Виконано 
 
6 Передзахист кваліфікаційної роботи бакалавра 
на засіданні кафедри КНСА. до 03.06.2025 Виконано 
 
7 Подання роботи завідувачу кафедри КНСА. до 10.06. 2025 Виконано 
8 Захист кваліфікаційної роботи бакалавра. 06.06.2025 Виконано 
    
    
    
    
 
 
Студент                                   _____________________________    Дмитро ЯСЮК 
(підпис)                                                           
 
Керівник роботи                     _____________________________    Дмитро КАТАЄВ 
                                           (підпис)            
                                                        
 
 
 
 
 
 
 
 
 
 
РЕФЕРАТ 
Кваліфікаційна робота бакалавра містить: 70 с., 23 рис., 1 таблицю, 10 
використаних джерел, 3 додатки. 
Актуальність теми. У сучасних умовах глобальних екологічних викликів та 
зростаючої потреби в раціональному використанні природних ресурсів особливого 
значення набуває розробка й впровадження енергонезалежних пристроїв, що 
функціонують на основі альтернативних джерел енергії. Такі технології є ключовими 
для мінімізації негативного впливу людської діяльності на довкілля. Крім того, 
стрімкий розвиток технологій і постійне підвищення вартості традиційних 
енергоносіїв стимулюють пошук ефективних енергетичних рішень. 
Створення інтернет-платформ для підтримки енергонезалежних пристроїв має 
вагоме економічне значення: воно сприяє формуванню нових ринкових ніш, 
активізації інвестиційної діяльності та загальному економічному зростанню. 
Водночас застосування таких технологій підвищує енергетичну автономність 
домогосподарств, зменшує залежність від централізованих систем енергопостачання 
та покращує якість життя населення. Усе це комплексно впливає на соціально-
економічний розвиток суспільства. 
Отже, розбудова інтернет-платформи для енергонезалежних пристроїв є 
актуальним завданням, що поєднує екологічну доцільність, економічну вигоду та 
соціальну значущість. 
Мета роботи та завдання дослідження 
Основною метою кваліфікаційної роботи є створення ефективної інтернет-
платформи для реалізації енергонезалежних пристроїв. Для досягнення поставленої 
мети передбачається розв’язання таких дослідницьких завдань: 
 здійснити комплексний аналіз наявних інтернет-платформ, що спеціалізуються 
на продажу енергонезалежних пристроїв, з метою виявлення їхніх сильних і слабких 
сторін; 
 визначити основні запити, очікування та вимоги цільової аудиторії щодо 
 
функціональності, асортименту та зручності використання таких платформ; 
 інтегрувати сучасні технологічні рішення для підвищення ефективності, 
продуктивності та користувацького досвіду онлайн-магазину; 
 провести оцінювання результативності впроваджених заходів та, за 
необхідності, скоригувати стратегію розвитку платформи з метою досягнення 
оптимальних результатів. 
Об'єкт дослідження: об'єктом дослідження даної кваліфікаційної роботи 
бакалавра є інтернет-платформа енергонезалежних пристроїв. 
Предмет дослідження: предметом дослідження даної кваліфікаційної роботи 
бакалавра є розвиток та подальше покращення функціоналу інтернет-платформи 
енергонезалежних пристроїв, та зокрема аналіз її працездатності в задоволенні потреб 
споживачів. 
Методи дослідження 
Для реалізації поставленої мети та вирішення завдань дослідження в роботі буде 
застосовано комплекс методів, а саме: 
1. Аналіз сучасних інтернет-платформ — детальне дослідження 
функціональних можливостей, візуального оформлення, маркетингових 
підходів та системи обслуговування клієнтів платформ, що спеціалізуються на 
продажу енергонезалежних пристроїв. 
2. Опитування споживачів — проведення анкетування серед потенційних і 
наявних користувачів з метою ідентифікації їхніх потреб, очікувань та рівня 
задоволеності якістю сервісу. 
3. SWOT-аналіз — оцінка сильних і слабких сторін, а також виявлення зовнішніх 
можливостей і загроз для обґрунтування стратегічного напряму розвитку 
платформи. 
4. Теоретичне узагальнення — опрацювання наукових джерел, аналітичних 
даних та публікацій щодо ефективності маркетингових стратегій, поточних 
тенденцій на ринку енергонезалежних пристроїв і сучасних технологічних 
рішень у сфері електронної комерції. 
 
5. Експертне оцінювання — залучення фахівців у галузях електронної торгівлі, 
маркетингу та енергозбереження для отримання кваліфікованих рекомендацій 
щодо удосконалення інтернет-платформи. 
Перелік ключових слів:  ІНТЕРНЕТ-ПЛАТФОРМА, ЕНЕРГОНЕЗАЛЕЖНІ 
ПРИСТРОЇ, ЕЛЕКТРОННА КОМЕРЦІЯ, WORDPRESS, MAMP. 
  
 
ABSTRACT 
The bachelor's qualification thesis comprises 70 pages, 23 figures, 1 table, 10 sources, 
and 3 appendices. 
Relevance of the Topic 
In the context of current global environmental challenges and the increasing demand 
for the rational use of natural resources, the development and implementation of energy-
independent devices based on alternative energy sources is of paramount importance. These 
technologies are crucial for minimizing the negative impact of human activity on the 
environment. Moreover, the rapid advancement of technology and the continuous rise in the 
cost of traditional energy resources are driving the demand for efficient energy solutions. 
The development of internet platforms to support energy-independent devices holds 
significant economic value: it fosters the emergence of new market niches, stimulates 
investment activity, and contributes to overall economic growth. At the same time, the use 
of such technologies enhances the energy autonomy of households, reduces dependence on 
centralized energy systems, and improves the quality of life for the population. All these 
factors have a comprehensive impact on the socio-economic development of society. 
Thus, building an internet platform for energy-independent devices is a highly 
relevant task that combines environmental sustainability, economic benefit, and social 
significance. 
Research Objective and Tasks 
The main goal of this bachelor's qualification thesis is to develop an effective internet 
platform for the sale of energy-independent devices. To achieve this goal, the following 
research tasks have been set: 
 Conduct a comprehensive analysis of existing internet platforms specializing 
in the sale of energy-independent devices to identify their strengths and weaknesses; 
 Determine the key needs, expectations, and requirements of the target audience 
regarding functionality, product range, and ease of use of such platforms; 
 Integrate modern technological solutions to improve the efficiency, 
performance, and user experience of the online store; 
 
 Evaluate the effectiveness of the implemented measures and adjust the platform 
development strategy, if necessary, to achieve optimal results. 
Object of Research: the internet platform for energy-independent devices. 
Subject of Research: the development and improvement of the functionality of the 
internet platform for energy-independent devices, particularly in terms of its ability to meet 
consumer needs. 
Research Methods 
To achieve the stated goal and accomplish the research tasks, the following set of 
methods will be applied: 
1. Analysis of modern internet platforms — an in-depth study of the functional 
capabilities, visual design, marketing strategies, and customer service systems of platforms 
selling energy-independent devices. 
2. Consumer surveys — conducting questionnaires among potential and existing 
users to identify their needs, expectations, and satisfaction levels regarding service quality. 
3. SWOT analysis — assessment of the platform's strengths and weaknesses, 
along with identification of external opportunities and threats, to justify the strategic 
direction of its development. 
4. Theoretical generalization — reviewing academic literature, analytical data, 
and publications on the effectiveness of marketing strategies, market trends in energy-
independent devices, and modern technological solutions in e-commerce. 
5. Expert evaluation — consulting specialists in the fields of e-commerce, 
marketing, and energy efficiency to obtain qualified recommendations for improving the 
internet platform. 
Keywords: INTERNET PLATFORM, ENERGY-INDEPENDENT DEVICES, E-
COMMERCE, WORDPRESS, MAMP. 
 
 8 
ЗМІСТ 
ПЕРЕЛІК УМОВНИХ ПОЗНАЧЕНЬ, СИМВОЛІВ, СКОРОЧЕНЬ І ТЕРМІНІВ ...... 10 
ВСТУП ................................................................................................................................ 11 
1 ДОСЛІДЖЕННЯ ПРЕДМЕТНОЇ ОБЛАСТІ ............................................................... 13 
1.1 Аналіз сучасного стану інтернет-платформ енергонезалежних пристроїв .... 13 
1.2 Огляд існуючих аналогів веб-сайтів та інтернет-платформ енергонезалежних 
пристроїв ...................................................................................................................... 13 
1.2.1 Аналіз сайту інтернет-платформи «Енерджи Юа» .................................. 14 
1.2.2 Аналіз сайту інтернет-платформи «Energo Sklad» ................................... 15 
1.2.3 Аналіз сайту інтернет-платформи «Альцест» .......................................... 17 
1.2.4 Аналіз сайту інтернет-платформи «Епіцентр» ......................................... 18 
1.2.5 Аналіз сайту інтернет-платформи «ЕСКО» .............................................. 20 
1.3 Аналіз порівнянь існуючих рішень розглянутих реалізацій та постановка 
завдання ........................................................................................................................ 21 
Висновки до розділу 1 ................................................................................................ 23 
2 ПРОЄКТУВАННЯ САЙТУ ІНТЕРНЕТ-ПЛАТФОРМИ ЕНЕРГОНЕЗАЛЕЖНИХ 
ПРИСТРОЇВ ....................................................................................................................... 26 
2.1 Опис функціонального програмного середовища для розробки ..................... 26 
2.2 Основні принципи розробки веб-сайту .............................................................. 26 
2.3 Архітектура веб-сайтів ......................................................................................... 28 
2.4 Розробка діаграми варіантів використання ........................................................ 33 
2.5 Проєктування структури бази даних .................................................................. 36 
2.6 Опис процесу проєктування структури сайту інтернет-платформи 
енергонезалежних товарів .......................................................................................... 36 
2.7 Проєктування інтерфейсу користувача .............................................................. 43 
Висновки до розділу 2 ................................................................................................ 44 
3 ПРОГРАМНА РЕАЛІЗАЦІЯ ІНТЕРНЕТ-ПЛАТФОРМИ ЕНЕРГОНЕЗАЛЕЖНИХ 
ПРИСТРОЇВ ....................................................................................................................... 46 
3.1 Опис реалізації завдання ...................................................................................... 46 
 9 
3.2 Опис архітектури програмного забезпечення .................................................... 47 
3.3 Огляд сторінок та інструкції користувача .......................................................... 47 
3.4 Особливості тестування веб-сайту ...................................................................... 53 
3.5 Аналіз отриманих результатів ............................................................................. 54 
Висновки до розділу 3 ................................................................................................ 57 
ВИСНОВКИ ....................................................................................................................... 59 
СПИСОК ВИКОРИСТАНИХ ДЖЕРЕЛ ......................................................................... 60 
ДОДАТОК А. Специфікація 482.ЧДТУ. 42220-01 ........................................................ 62 
ДОДАТОК Б. Текст програми ......................................................................................... 64 
ДОДАТОК В. Інструкція користувача ............................................................................ 65 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
  
 1
ПЕРЕЛІК УМОВНИХ ПОЗНАЧЕНЬ, СИМВОЛІВ, СКОРОЧЕНЬ І ТЕРМІНІВ0  
БД (база даних) – структурована сукупність даних, яка зберігається та управляється 
з метою швидкого доступу, обробки та оновлення інформації. 
Система управління вмістом (CMS – Content Management System) – це 
спеціалізоване програмне забезпечення, призначене для створення, редагування, 
організації та публікації цифрового контенту на веб-сайтах без необхідності 
програмування. 
UX/UI 
 UX (User Experience) – досвід користувача, що охоплює всі аспекти взаємодії 
людини з продуктом, включаючи зручність, ефективність та емоційне 
сприйняття під час використання. 
 UI (User Interface) – графічне та функціональне оформлення інтерфейсу, через 
яке користувач здійснює взаємодію з цифровим продуктом. 
CDN (Content Delivery Network) – це розподілена мережа серверів, яка забезпечує 
швидке доставлення веб-контенту (зображення, відео, скрипти тощо) до 
користувачів, використовуючи географічно найближчі вузли. 
SSL (Secure Sockets Layer) – протокол шифрування, що забезпечує безпечну 
передачу даних між веб-браузером користувача та сервером, запобігаючи їхньому 
перехопленню третіми особами. 
URL (Uniform Resource Locator) – унікальна адреса, яка використовується для 
доступу до ресурсів в Інтернеті, зокрема веб-сторінок, файлів, зображень або сервісів. 
SEO (Search Engine Optimization) – комплекс заходів, спрямованих на підвищення 
видимості веб-сайту в пошукових системах, що сприяє збільшенню кількості 
відвідувачів і покращенню позицій у результатах пошуку. 
SQL-ін’єкція – тип вразливості веб-додатків, який дозволяє зловмисникам впливати 
на базу даних шляхом вставлення шкідливих SQL-запитів через інтерфейс 
користувача. 
Мікроінтеракції – невеликі, але важливі елементи взаємодії між користувачем і 
цифровим продуктом, які підвищують зручність використання, наприклад, 
візуальний ефект натискання кнопки чи підказка при наведенні курсора. 
 
  
 1
ВСТУП 1 
Актуальність теми 
У сучасних реаліях, коли зростає увага до енергоефективності та розвитку 
альтернативних джерел енергії, значущість енергонезалежних пристроїв суттєво 
зростає. Такі технології активно впроваджуються як у виробничих сферах, так і в 
побуті, водночас набуваючи високого попиту серед споживачів. Питання 
забезпечення енергетичної автономії та раціонального використання ресурсів стають 
особливо важливими з огляду на необхідність охорони довкілля й досягнення цілей 
сталого розвитку. 
Актуальність кваліфікаційної роботи 
Значущість дослідження зумовлена активним зростанням інтересу суспільства 
до енергонезалежних технологій, що дозволяють не лише заощаджувати енергію, а й 
зменшувати екологічне навантаження. Такі пристрої мають широкий спектр переваг: 
вони є зручними для кінцевих користувачів, а також легко доступними завдяки 
онлайн-торгівлі. Функціонування інтернет-магазинів, які спеціалізуються на продажу 
енергонезалежних рішень, забезпечує зручний пошук товарів, можливість порівняння 
характеристик, отримання знижок і швидкої доставки. Усе це підтверджує 
доцільність та своєчасність розробки спеціалізованої інтернет-платформи для таких 
товарів. 
Мета та завдання роботи 
Метою кваліфікаційної роботи є розробка сайту інтернет-платформи, 
призначеної для продажу енергонезалежних пристроїв. 
Для досягнення поставленої мети було сформульовано такі завдання: 
 дослідити предметну область та вивчити її особливості; 
 провести порівняльний аналіз існуючих інтернет-ресурсів, що 
спеціалізуються на реалізації енергонезалежних товарів; 
 проаналізувати сучасні технологічні рішення та розробити стратегію 
просування інтернет-платформи; 
 обрати відповідні програмні та технічні засоби для реалізації вебсайту; 
 1
 створити функціональний сайт та здійснити його тестування дл2я  
перевірки працездатності. 
Об’єкт і предмет дослідження 
Об’єктом дослідження виступають технологічні та маркетингові аспекти 
створення онлайн-платформ для реалізації енергонезалежних пристроїв. 
Предметом дослідження є веб-сайт інтернет-платформи, що забезпечує доступність 
та зручність продажу таких пристроїв. 
Методи дослідження 
У процесі виконання роботи були використані такі методи: 
 теоретичний метод – для аналізу наукових джерел, що стосуються теми 
дослідження; 
 порівняльний метод – для аналізу та співставлення функціональних 
можливостей аналогічних веб-платформ; 
 емпіричний метод – у процесі практичного спостереження та 
конфігурації сайту, зокрема у частині замовлення товарів; 
 експериментальний метод – для тестування різних варіантів дизайну з 
метою виявлення найбільш зручного інтерфейсу для користувача. 
Технічна реалізація 
Сайт інтернет-платформи було створено з використанням CMS WordPress і 
розгорнуто на локальному серверному середовищі MAMP, яке включає компоненти 
Apache та MySQL. 
 
 
 
  
 1
1 ДОСЛІДЖЕННЯ ПРЕДМЕТНОЇ ОБЛАСТІ 3 
1.1 Аналіз сучасного стану сайтів інтернет-платформ енергонезалежних 
пристроїв 
Стан та тенденції розвитку інтернет-платформ. Сучасна еволюція інтернет-
платформ є складним, динамічним процесом, на який впливає широкий спектр 
чинників. Одним із ключових драйверів є стрімке зростання популярності 
електронної комерції серед споживачів, які дедалі частіше обирають онлайн-шопінг 
завдяки його зручності та доступності. Це, своєю чергою, посилює конкуренцію між 
онлайн-магазинами та стимулює їх до вдосконалення сервісів і впровадження 
інноваційних рішень. 
Одним із провідних напрямів розвитку є розширення функціональних 
можливостей інтернет-платформ за рахунок інтеграції інтелектуальних технологій, 
зокрема систем аналітики даних і машинного навчання. Застосування таких рішень 
дозволяє забезпечити високий рівень персоналізації користувацького досвіду, 
підвищити ефективність маркетингових стратегій і сприяти зростанню обсягів 
продажів. 
Останніми роками спостерігається також посилення уваги до питань 
екологічної сталості та корпоративної соціальної відповідальності. Чимало компаній 
реалізують ініціативи зі зменшення свого вуглецевого сліду, впроваджують 
екологічно безпечні технології та підтримують соціально значущі проєкти. Такі дії не 
лише формують позитивний імідж бренду, а й сприяють залученню лояльної 
аудиторії. 
Не менш важливою є тенденція зростання мобільної комерції, що зумовлює 
потребу в адаптації інтернет-платформ до мобільних пристроїв. Враховуючи 
зростаючу кількість користувачів смартфонів і планшетів, наявність оптимізованої 
мобільної версії сайту стає критично важливою для забезпечення зручності та 
доступності покупок. 
Окрему увагу необхідно приділяти питанням кібербезпеки. З огляду на 
підвищений ризик загроз у цифровому середовищі, інтернет-платформи повинні 
впроваджувати ефективні засоби захисту персональних даних користувачів, зокрема 
 1
шифрування, двофакторну автентифікацію та механізми виявлення шахрайсько4ї  
активності. 
Загалом аналіз поточного стану інтернет-платформ свідчить про їхній стрімкий 
розвиток і постійну адаптацію до актуальних вимог ринку та очікувань споживачів, 
що підкреслює значущість цього сегмента у структурі сучасної електронної комерції. 
1.2 Огляд існуючих аналогів веб-сайтів інтернет-платформ 
енергонезалежних пристроїв 
У межах виконання кваліфікаційної роботи було здійснено аналіз наявних 
аналогів інтернет-платформ, що реалізують енергонезалежні пристрої. Зокрема, було 
розглянуто такі ресурси, як «Енерджи Юа», «Energo Sklad», «Альцест», «Епіцентр» 
та «ЕСКО». Кожен із зазначених інтернет-магазинів посідає вагоме місце на ринку 
відповідної продукції та характеризується власною стратегією розвитку, 
функціональними особливостями та підходами до взаємодії з клієнтами. Їхній досвід 
слугує цінним джерелом для формування вимог до розробки ефективної інтернет-
платформи. 
1.2.1 Аналіз сайту інтернет-платформи «Енерджи Юа». Інтернет-магазин 
«Енерджи Юа» спеціалізується на реалізації енергонезалежних пристроїв та рішень, 
призначених для забезпечення електропостачання в умовах відсутності традиційних 
джерел енергії. Асортимент платформи охоплює різноманітну продукцію, зокрема 
сонячні панелі, портативні акумуляторні системи, вітрові турбіни та інші 
альтернативні енергетичні рішення [4]. 
На рисунку 1.1 наведено головну сторінку інтернет-платформи «Енерджи Юа». 
 1
5 
Рисунок 1.1 – Головна сторінка інтернет-платформи «Енерджи Юа» [4] 
Переваги інтернет-платформи «Енерджи Юа» 
Широкий асортимент продукції. Платформа пропонує велику кількість 
енергонезалежних пристроїв, що дає змогу задовольнити потреби різних категорій 
споживачів — як побутових, так і комерційних. 
Високий рівень якості. Продукція, представлена на сайті, відзначається 
надійністю та довговічністю, що підтверджується як позитивними відгуками клієнтів, 
так і оцінками галузевих експертів. 
Зручний інтерфейс. Сайт має логічну структуру та інтуїтивно зрозумілу 
навігацію, що забезпечує комфортний пошук товарів і простоту здійснення онлайн-
покупок. 
Недоліки інтернет-платформи «Енерджи Юа» 
Цінова політика. Окремі позиції в каталозі мають вищу вартість порівняно з 
аналогічними товарами на конкуруючих платформах, що може стримувати частину 
потенційних покупців. 
Проблеми з логістикою та сервісом. За відгуками деяких клієнтів, іноді 
трапляються затримки в доставці, а також недостатньо ефективна підтримка клієнтів 
після здійснення покупки. 
1.2.2 Аналіз web-сайту інтернет-платформи «Energo Sklad». Інтернет-
 1
магазин «Energo Sklad» спеціалізується на реалізації енергонезалежних рішень6,  
орієнтованих як на побутове, так і на комерційне використання. У каталозі 
представлено широкий спектр продукції, зокрема сонячні батареї, акумуляторні 
системи, вітрогенератори, інвертори та інші пристрої, що сприяють досягненню 
енергетичної самостійності споживачів [5]. 
На рисунку 1.2 зображено головну web-сторінку інтернет-платформи «Energo 
Sklad». 
 
Рисунок 1.2 – Головна сторінка сайту інтернет-платформи «Energo Sklad» [5] 
Переваги інтернет-платформи «Energo Sklad» 
 Розмаїття асортименту. Магазин пропонує великий вибір енергонезалежних 
пристроїв, що задовольняють потреби як приватних користувачів, так і бізнес-
клієнтів. 
 Надійність продукції. Високу якість товарів підтверджують численні позитивні 
відгуки користувачів. 
 Зручність користування. Інтерфейс сайту є зрозумілим, а процедура 
оформлення замовлення — швидкою та простою. 
 Наявність гарантій. Платформа забезпечує гарантійне обслуговування та 
можливість повернення продукції відповідно до чинного законодавства. 
 Професійна підтримка. Кваліфіковані консультанти надають допомогу у виборі 
 1
відповідного обладнання згідно з потребами клієнта. 7 
Недоліки інтернет-платформи «Energo Sklad» 
 Високий рівень цін. Деякі товари мають вищу вартість у порівнянні з 
аналогічною продукцією на інших платформах. 
 Логістичні труднощі. Існує ймовірність затримок із доставкою, особливо у 
випадках великих партій замовлень. 
 Обмежений запас товарів. Дефіцит окремих позицій може бути пов’язаний з 
високим попитом та обмеженими обсягами постачання. 
 Недосконалий дизайн. Візуальне оформлення головної сторінки сайту не 
завжди відповідає сучасним естетичним вимогам, що може впливати на перше 
враження користувача. 
1.2.3 Аналіз сайту інтернет-платформи «Альцест». Інтернет-магазин 
«Альцест» орієнтований на реалізацію енергонезалежних пристроїв та супутніх 
аксесуарів. Асортимент ресурсу охоплює широкий спектр товарів, призначених для 
забезпечення енергетичної автономії, серед яких сонячні панелі, вітрові турбіни, 
акумуляторні системи та інше обладнання [3]. 
На рисунку 1.3 представлено головну web-сторінку інтернет-платформи 
«Альцест»
 
Рисунок 1.3 – Головна сторінка сайту інтернет-платформи «Альцест» [3] 
 1
Переваги інтернет-платформи «Альцест» 8 
 Широкий асортимент продукції. Платформа пропонує різноманітні товари для 
забезпечення енергетичної автономії, що дозволяє задовольнити потреби 
різних категорій користувачів. 
 Оптимальне співвідношення ціни та якості. Вартість продукції є 
конкурентоспроможною з огляду на технічні характеристики та надійність 
товарів. 
 Зручність користування. Інтерфейс сайту розроблений таким чином, щоб 
користувач міг швидко й легко здійснити замовлення. 
 Гнучкі умови оплати та доставки. Платформа підтримує декілька варіантів 
оплати, а також забезпечує різноманітні способи доставки продукції. 
 Професійна клієнтська підтримка. Користувачі можуть отримати кваліфіковані 
консультації щодо вибору обладнання та його експлуатації. 
Недоліки інтернет-платформи «Альцест» 
 Перевантаженість головної сторінки. Візуальний дизайн стартової сторінки не 
є достатньо привабливим і містить надмірну кількість текстового контенту, що 
ускладнює навігацію. 
 Затримки в доставці. Існує ризик сповільненої логістики у випадку доставки до 
віддалених населених пунктів. 
 Нерівномірний асортимент. Деякі категорії товарів представлені в обмеженій 
кількості, що може впливати на вибір користувачів. 
 Недостатня інформативність. На сторінках окремих товарів іноді бракує 
детального опису технічних характеристик, що ускладнює прийняття рішення 
про покупку. 
1.2.4 Аналіз сайту інтернет-платформи «Епіцентр». «Епіцентр» — 
масштабна мережа роздрібної торгівлі, що спеціалізується на продажу товарів для 
будівництва, ремонту, облаштування побуту та саду. У структурі товарного 
асортименту представлено також енергонезалежні пристрої, що робить платформу 
релевантною для аналізу в контексті теми дослідження [2]. 
 
 1
На рисунку 1.4 зображено головну сторінку інтернет-платформи «Епіцентр»9.  
 
Рисунок 1.4 – Головна сторінка сайту інтернет-платформи «Епіцентр» [2] 
Переваги інтернет-платформи «Епіцентр»: 
Широкий асортимент енергонезалежного обладнання. Платформа пропонує 
великий вибір автономних енергетичних рішень та супутніх аксесуарів, що 
задовольняють запити різних категорій споживачів. 
Можливість офлайн-перевірки товарів. Завдяки розгалуженій мережі фізичних 
торговельних точок користувачі мають змогу особисто ознайомитися з продукцією 
перед її придбанням. 
Гнучкі умови логістики та оплати. Компанія пропонує декілька варіантів 
доставки та підтримує зручні способи розрахунку, що підвищує комфорт для 
покупців. 
Професійна консультаційна підтримка. Клієнти можуть отримати кваліфіковані 
рекомендації щодо підбору обладнання відповідно до індивідуальних потреб. 
Детальна інформативність. На сайті представлено чіткі й повні описи товарів, 
включно з їхніми технічними характеристиками, що сприяє усвідомленому вибору. 
Недоліки інтернет-платформи «Епіцентр»: 
 Недоліки інтернет-платформи «Епіцентр» 
 Обмеженість спеціалізованого асортименту. У порівнянні з профільними 
 2
онлайн-магазинами, перелік енергонезалежних пристроїв може бути менш0  
різноманітним. 
 Висока вартість окремих товарів. Деякі позиції реалізуються за цінами, що 
перевищують середньоринкові показники. 
 Ймовірність затримок у доставці. У періоди пікового навантаження можливе 
збільшення термінів виконання замовлень. 
 Перевантаження головної сторінки. Велика кількість товарів на стартовій 
сторінці може ускладнювати навігацію для користувачів. 
1.2.5 Аналіз сайту інтернет-платформи «ЕСКО». Інтернет-магазин «ЕСКО» 
спеціалізується на реалізації електроніки, побутової техніки та енергонезалежних 
пристроїв, призначених для використання в побуті, офісах та інших просторах. 
Платформа пропонує широкий спектр сучасних технологічних рішень, спрямованих 
на підвищення рівня комфорту та автономності у повсякденному житті [1]. 
 
На рисунку 1.5 представлено головну сторінку інтернет-платформи «ЕСКО».
 
Рисунок 1.5 – Головна сторінка сайту інтернет-платформи «ЕСКО» [1] 
Переваги інтернет-платформи «ЕСКО»: 
Розширений асортимент продукції. Магазин пропонує великий вибір 
енергонезалежного обладнання, зокрема сонячні панелі, акумулятори, інвертори та 
інші сучасні технології для автономного енергозабезпечення. 
 2
Доступна цінова політика. Платформа приваблює клієнті1в  
конкурентоспроможними цінами, а також регулярними акційними пропозиціями та 
знижками. 
Зручність замовлення. Вебсайт має зрозумілу навігацію та зручний інтерфейс, 
що спрощує процес пошуку товарів і оформлення покупки. 
Гнучкі умови логістики. Магазин надає декілька варіантів доставки, включаючи 
можливість самостійного отримання замовлення в торговельній точці. 
Кваліфікована консультаційна підтримка. Користувачі можуть отримати 
професійні поради щодо вибору продукції, що найкраще відповідає їхнім потребам. 
Недоліки інтернет-платформи «ЕСКО»: 
Нерівномірність асортименту. У деяких товарних категоріях спостерігається 
обмежений вибір продукції, що може ускладнити задоволення специфічних потреб 
клієнтів. 
Недостатня інформативність. Інколи на сторінках товарів бракує детальних 
технічних характеристик або чітких описів, що утруднює прийняття обґрунтованого 
рішення щодо купівлі. 
Логістичні затримки. У періоди високого навантаження можуть виникати 
труднощі з вчасним виконанням замовлень і доставкою продукції. 
Недосконалий дизайн інтерфейсу. Візуальне оформлення сайту не відповідає 
сучасним вимогам естетики та юзабіліті, що може негативно впливати на 
користувацьке враження. 
Перевантаженість головної сторінки. Надлишок текстової інформації та слабка 
візуальна структура ускладнюють навігацію та знижують ефективність сприйняття 
контенту. 
1.3 Аналіз порівнянь існуючих рішень розглянутих реалізацій та 
постановка завдання 
На основі проведеного порівняльного огляду інтернет-платформ «Енерджи 
Юа», «Energo Sklad», «Альцест», «Епіцентр» та «ЕСКО» було здійснено аналітичне 
узагальнення їхніх ключових переваг і недоліків. Отримані результати дозволяють 
окреслити характерні сильні сторони та виявити проблемні зони в аспектах 
 2
функціональності, сервісного обслуговування, структури інтерфейсу т2а  
асортиментної політики. Такий аналіз є важливою основою для формування вимог до 
розробки нової інтернет-платформи енергонезалежних пристроїв, орієнтованої на 
покращення користувацького досвіду та підвищення ефективності онлайн-продажів. 
Під час аналізу було виявлено наступні ключові висновки: 
 У ході аналізу ключових факторів, що впливають на ефективність інтернет-
платформ з продажу енергонезалежних пристроїв, було виявлено низку важливих 
аспектів: 
 Широкий асортимент та висока якість продукції залишаються визначальними 
чинниками для споживачів під час вибору торговельного майданчика. 
 Цінова доступність та гнучка цінова політика безпосередньо впливають на 
рівень конкурентоспроможності інтернет-магазину. 
 Зручна структура сайту та інтуїтивно зрозумілий інтерфейс значно підвищують 
задоволеність користувачів і спрощують процес здійснення покупок. 
 Оперативність та надійність доставки є важливими складовими позитивного 
клієнтського досвіду. 
 Кваліфікована клієнтська підтримка та надання консультацій сприяють 
формуванню довіри до платформи й підвищують рівень лояльності споживачів. 
У таблиці 1.1 представлено узагальнений порівняльний аналіз п’яти 
розглянутих інтернет-платформ, що спеціалізуються на реалізації енергонезалежних 
товарів: «Енерджи Юа», «Energo Sklad», «Альцест», «Епіцентр» та «ЕСКО». 
Оцінювання здійснено за ключовими критеріями, зокрема: асортимент, цінова 
політика, зручність інтерфейсу, якість обслуговування, інформаційне наповнення та 
логістика. Такий підхід дозволяє виявити сильні та слабкі сторони кожної з платформ 
і сформувати обґрунтовані рекомендації для проєктування власної інтернет-
платформи енергонезалежних пристроїв. 
Таблиця 1.1 – Таблиця порівнянь існуючих рішень та розглянутих реалізацій 
Критерії Назва інтернет-платформи 
порівняння «Енерджи «Energo 
сайтів «Альцест» «Епіцентр» «ЕСКО» 
 Ю_а» Sklad» 
 2
Дизайн 3 
5 4 3 3 3 
(0-5) 
Інтуїтивність 
і зручність 5 4 4 5 4 
(0-5) 
Функціонал 
4 4 3 4 4 
(0-5) 
Якість 
контенту і 
5 3 3 3 4 
інформації 
(0-5) 
Аналітичний висновок за результатами порівняльного аналізу 
Згідно з даними таблиці 1.1, інтернет-магазин «Енерджи Юа» посідає провідну 
позицію серед досліджених платформ за такими критеріями, як якісний дизайн, 
інтуїтивність інтерфейсу та інформаційне наповнення. Водночас за рівнем 
функціональності цей ресурс знаходиться на одному рівні з конкурентами, зокрема з 
платформами «Energo Sklad», «Епіцентр» та «ЕСКО». 
Натомість інтернет-магазин «Альцест» продемонстрував найнижчі показники за 
більшістю проаналізованих параметрів, що свідчить про потребу у вдосконаленні 
його функціональних і візуальних компонентів. 
На основі проведеного аналізу в межах бакалаврської кваліфікаційної роботи 
при розробці власного вебсайту інтернет-платформи енергонезалежних товарів 
доцільно врахувати наступні ключові вимоги: 
 сайт повинен мати зручний, зрозумілий та привабливий інтерфейс, 
адаптований для різних груп користувачів; 
 вебресурс має забезпечувати високу швидкодію та ефективну реалізацію 
основних функцій (пошук, фільтрація, обробка замовлень тощо); 
 необхідно реалізувати надійні засоби безпеки, що гарантують захист 
персональних даних та відповідність чинному законодавству. 
Постановка завдання 
1. Розробка інтуїтивно зрозумілого інтерфейсу: 
– Створення інтерфейсних рішень, доступних для сприйняття та використання 
 2
користувачами з різним рівнем технічної підготовки. 4 
– Налаштування логіки взаємодії з урахуванням потреб цільової аудиторії для 
досягнення максимальної зручності у користуванні платформою. 
2. Оптимізація швидкодії та підвищення ефективності: 
– Оптимізація продуктивності сайту, зменшення часу завантаження сторінок. 
– Вдосконалення пошукової системи та механізмів фільтрації товарів для 
забезпечення швидкого доступу до релевантного контенту. 
3. Реалізація високого рівня захисту персональних даних: 
– Розробка системи безпеки, що передбачає шифрування даних, захист від 
несанкціонованого доступу та кібератак. 
– Дотримання стандартів конфіденційності та відповідність законодавчим вимогам 
щодо обробки персональної інформації користувачів. 
Висновки до розділу 1 
У першому розділі кваліфікаційної роботи було здійснено комплексний аналіз 
існуючих інтернет-платформ, що спеціалізуються на реалізації енергонезалежних 
пристроїв, зокрема: «Енерджи Юа», «Energo Sklad», «Альцест», «Епіцентр» та 
«ЕСКО». Аналіз охопив ключові аспекти, такі як дизайн, інтуїтивність та зручність 
інтерфейсу, функціональність платформи, інформативність контенту та якість 
наданих сервісів. 
У процесі дослідження були ідентифіковані основні фактори, що впливають на 
конкурентоспроможність платформи та рівень задоволеності користувачів: 
 Якість та різноманітність товарного асортименту. 
 Цінова доступність та конкурентна політика ціноутворення. 
 Зручність користування сайтом і логічна структура інтерфейсу. 
 Оперативність обслуговування, включаючи логістику та консультації. 
 Повнота, достовірність та наочність інформації про продукцію. 
Для візуалізації результатів дослідження була створена порівняльна таблиця, 
яка дозволила виявити переваги й недоліки кожного з аналізованих рішень. На її 
 2
основі було сформульовано основні вимоги до майбутньої розробки інтернет5- 
платформи. 
У підсумку визначено ключові завдання, які слід реалізувати в межах 
проєктування власного веб-ресурсу: 
 Створення інтуїтивно зрозумілого та функціонального інтерфейсу. 
 Оптимізація продуктивності сайту та ефективності його основних 
процесів. 
 Забезпечення високого рівня інформаційної безпеки та захисту 
персональних даних користувачів. 
Таким чином, результати першого розділу стали основою для подальшої 
розробки конкурентоспроможної, технічно надійної та клієнтоорієнтованої інтернет-
платформи з продажу енергонезалежних пристроїв. 
 
 
 
 
 
 
 
 
 
 
 
  
 2
2 ПРОЄКТУВАННЯ САЙТУ ІНТЕРНЕТ-ПЛАТФОРМИ 6 
ЕНЕРГОНЕЗАЛЕЖНИХ ПРИСТРОЇВ 
2.1 Опис функціонального програмного середовища для розробки 
Для реалізації інтернет-платформи енергонезалежних пристроїв було 
використано набір сучасних інструментів і технологій, орієнтованих на забезпечення 
стабільності, зручності в обслуговуванні та високої функціональності вебресурсу. 
Основу середовища розробки склали WordPress як система управління вмістом та 
MAMP як інструмент для локального розгортання сайту. 
WordPress 
WordPress – це популярна CMS (Content Management System) з відкритим 
кодом, яка активно використовується для створення сайтів різного призначення, 
зокрема інтернет-магазинів. Основними перевагами WordPress є: 
 простота встановлення та налаштування; 
 широкі можливості кастомізації; 
 підтримка великою спільнотою розробників і користувачів; 
 гнучке керування вмістом без потреби програмування [9]. 
MAMP 
MAMP (Macintosh, Apache, MySQL, PHP) — це програмний комплекс, що надає 
можливість створювати локальне серверне середовище для розробки веб-додатків. 
Його застосування дозволяє: 
 запускати та тестувати сайт без підключення до Інтернету; 
 безпечно вносити зміни до коду; 
 швидко і зручно налаштовувати середовище розробки з інтуїтивно зрозумілим 
інтерфейсом [10]. 
Використані плагіни WordPress 
Для розширення функціональності та покращення користувацького досвіду 
було інтегровано низку ключових плагінів: 
Elementor 
 Плагін-конструктор сторінок із підтримкою drag-and-drop. 
 2
 Забезпечує гнучке створення дизайнів без знань програмування. 7 
 Містить велику бібліотеку готових віджетів та шаблонів. 
WooCommerce 
 Потужний інструмент для реалізації функціоналу інтернет-магазину. 
 Підтримує необмежену кількість товарів, налаштування цін, оплату та 
доставку. 
 Містить аналітичні інструменти для відстеження продажів. 
Login/Signup Popup 
 Додає можливість реєстрації/входу через спливаюче вікно. 
 Покращує зручність авторизації користувачів. 
Kadence WooCommerce Email Designer 
 Дозволяє налаштовувати вигляд електронних листів, що надсилаються 
покупцям. 
 Підтримує зміну стилів, логотипів, шрифтів, кольорів тощо. 
Kadence Blocks – Gutenberg Blocks for Page Builder Features 
 Розширює можливості стандартного редактора Gutenberg. 
 Надає нові макети, блоки та стилі для створення складних сторінок без 
коду. 
Kadence AI Starter Templates 
 Швидкий старт завдяки шаблонам готових сторінок. 
 Дає змогу адаптувати шаблони до потреб інтернет-платформи з мінімальними 
зусиллями. 
Fluent Forms 
 Інструмент для створення зворотного зв’язку, форм опитування чи 
реєстрації. 
 Підтримує валідацію, повідомлення та налаштування інтеграцій. 
Інтерфейсна тема 
Як основа для дизайну використовувалась тема Kadence, яка була адаптована з 
урахуванням функціональних і естетичних потреб проєкту. Її перевагами є: 
 2
 сучасний адаптивний дизайн, що коректно відображається на всіх типах8  
пристроїв; 
 висока швидкодія та підтримка SEO; 
 гнучкі можливості кастомізації без зміни коду. 
Підсумок 
Комбінація WordPress, MAMP та згаданих плагінів дозволила реалізувати 
інтернет-платформу енергонезалежних пристроїв з такими характеристиками: 
 висока функціональність і стабільність; 
 зручність адміністрування; 
 ефективна взаємодія з кінцевим користувачем; 
 можливість масштабування та подальшого вдосконалення. 
Цей технологічний стек забезпечив повноцінну підтримку процесу розробки, 
тестування і запуску сайту в умовах локального середовища перед перенесенням на 
продуктивний сервер. 
2.2 Основні принципи розробки веб-сайту 
При розробці веб-сайту інтернет-платформи енергонезалежних пристроїв 
важливо дотримуватись ключових принципів, які забезпечують стабільну роботу 
ресурсу, позитивний користувацький досвід та відповідність сучасним веб-
стандартам. 
Одним з основних напрямів є формування привабливого дизайну та 
ефективного користувацького інтерфейсу. Вебсайт має відповідати стилістиці та 
очікуванням цільової аудиторії. Інтерфейс повинен бути зрозумілим і зручним, що 
досягається завдяки використанню адаптивних елементів, анімацій та 
мікроінтеракцій. 
Також важливо забезпечити повну мобільну адаптивність ресурсу. Контент і 
дизайн повинні коректно відображатися на різних пристроях, включаючи смартфони 
та планшети. Додатково можуть бути задіяні специфічні можливості мобільних 
пристроїв, такі як GPS, камера чи push-сповіщення. 
 2
Особливу увагу слід приділяти швидкості завантаження сторінок. Ц9е  
досягається шляхом оптимізації зображень, скриптів і таблиць стилів, а також 
використанням кешування та мереж доставки контенту (CDN), що дозволяє 
забезпечити швидкий доступ до ресурсу з будь-якої локації. 
Ще одним критичним аспектом є безпека сайту. Для захисту персональних 
даних користувачів має застосовуватись SSL-шифрування, а всі компоненти сайту 
(движок, плагіни, теми) повинні регулярно оновлюватися. Також доцільно 
впроваджувати сучасні інструменти захисту від несанкціонованого доступу. 
Для підвищення впізнаваності сайту та його пошукової видимості слід 
реалізувати принципи SEO-оптимізації. Зокрема, оптимізувати метатеги, URL-
адреси, атрибути зображень та використовувати ключові слова. Важливим чинником 
є також створення унікального, змістовного контенту, що є цінним для користувачів 
і привабливим для пошукових систем. 
Не менш важливою є система аналітики, що дозволяє відстежувати поведінку 
користувачів і вдосконалювати сайт. Для цього інтегруються інструменти на зразок 
Google Analytics. Крім того, застосування A/B-тестування та аналіз ефективності 
маркетингових кампаній сприяють постійному поліпшенню функціональності 
платформи. 
Комплексне впровадження вищезазначених принципів дозволяє створити 
якісний, сучасний, безпечний і зручний веб-сайт, орієнтований на потреби 
користувачів і вимоги електронного ринку. 
2.3 Архітектура веб-сайтів 
Архітектура веб-сайту відіграє ключову роль не лише у формуванні його 
логічної структури, але й у забезпеченні ефективного використання ресурсів та 
підтримці належного рівня безпеки. Грамотно спроєктована архітектурна модель 
сприяє зручній навігації для користувачів, забезпечує швидке завантаження сторінок 
і дозволяє ефективно протидіяти потенційним загрозам. Крім того, архітектура 
безпосередньо впливає на швидкодію ресурсу, зокрема на час обробки запитів, що є 
важливим чинником у формуванні позитивного користувацького досвіду.  
 3
Структура сайту та її організація: 0 
Структура сайту та її організація 
Організація структури сайту є одним із ключових чинників у процесі створення 
ефективного та зручного веб-ресурсу. На початкових етапах розробки важливо 
визначити основні розділи та категорії, які будуть представлені на сайті. До них 
можуть належати сторінки з каталогами товарів чи послуг, інформаційні розділи, 
контактна інформація, сторінка «Про нас» тощо. 
Структура повинна бути логічно впорядкованою та зручною для користувачів. 
Основне меню має охоплювати найважливіші розділи, що відображають суть 
діяльності ресурсу. У разі значного обсягу товарів або послуг доцільним є 
впровадження системи категорій та підкатегорій, що значно спрощує процес 
навігації. 
При побудові структури також необхідно враховувати вимоги SEO — зокрема, 
оптимізовані URL-адреси та використання ключових слів. Це сприяє покращенню 
видимості сайту у пошукових системах і привабленню цільової аудиторії. 
Крім того, структура сайту має бути адаптованою для мобільних пристроїв, що 
забезпечує коректне відображення сторінок на різних екранах та гарантує 
комфортний користувацький досвід. 
Меню та система навігації 
Меню та навігаційна система є важливими елементами взаємодії користувача з 
сайтом. Чітко структуроване меню дозволяє швидко знаходити потрібну інформацію 
та переходити до необхідних сторінок без зайвих дій. Правильне розташування 
пунктів меню позитивно впливає на користувацький досвід і може збільшити 
показники конверсії. 
У меню слід враховувати ієрархічність категорій і сторінок. Найбільш 
популярними елементами меню є «Головна», «Каталог товарів», «Акції», «Контакти» 
тощо. Доцільним є використання підкатегорій, фільтрів або панелей сортування для 
покращення пошуку товарів або інформації. 
Сама навігація повинна бути інтуїтивно зрозумілою: кнопки й посилання мають 
бути легко доступними з будь-якої сторінки сайту, а навігаційна логіка — 
 3
послідовною й простою. Це дозволяє користувачам швидко орієнтуватися та уникати1  
непотрібних труднощів під час переходу між розділами. 
Безпека сайту 
При проєктуванні архітектури сайту необхідно враховувати всі аспекти 
інформаційної безпеки. Для захисту користувацьких даних слід використовувати 
SSL-сертифікати, регулярно оновлювати програмне забезпечення та впроваджувати 
сучасні засоби захисту. 
Особливої уваги потребує захист адміністративної панелі, що передбачає 
налаштування прав доступу, використання надійних паролів, а також впровадження 
двофакторної автентифікації. 
Регулярне проведення аудитів безпеки, виявлення потенційних вразливостей і 
їх своєчасне усунення є обов’язковими складовими підтримки надійної роботи сайту. 
Мобільна адаптивність та швидкість завантаження 
Адаптивний веб-дизайн і висока швидкість завантаження сторінок є критично 
важливими вимогами до сучасного веб-ресурсу. У зв’язку зі зростанням 
використання мобільних пристроїв для перегляду сайтів і здійснення покупок, 
необхідно забезпечити коректне відображення сторінок на будь-якому екрані. 
Адаптивність дозволяє змінювати вигляд сайту відповідно до параметрів 
пристрою, на якому його переглядають, що забезпечує комфортне користування та 
читабельність контенту. Швидке завантаження сторінок досягається шляхом 
оптимізації зображень і скриптів, а також застосуванням кешування та CDN для 
покращення доступу до сайту з будь-якого регіону. 
SEO-оптимізація та аналітика 
SEO-оптимізація та системи аналітики є невід’ємною частиною успішної 
реалізації інтернет-платформи. SEO дозволяє покращити позиції сайту в результатах 
пошуку, а аналітика — відстежувати ефективність його роботи. 
SEO-оптимізація охоплює впровадження ключових слів у контент, 
налаштування метатегів, оптимізацію URL-структури, зображень і загального вмісту 
сторінок. Також враховуються фактори, що впливають на ранжування в пошукових 
системах, зокрема мобільна адаптивність, швидкість завантаження та безпека сайту. 
 3
Інструменти аналітики, зокрема Google Analytics, дозволяють відслідковувати2  
кількість відвідувачів, джерела трафіку, поведінкові показники та конверсії. Це дає 
змогу коригувати стратегії маркетингу та приймати обґрунтовані рішення щодо 
вдосконалення веб-ресурсу. Постійний аналіз отриманих даних та адаптація до змін 
у поведінці користувачів і пошукових алгоритмах сприяє стабільному зростанню 
показників ефективності. 
Схема архітектури веб-сайту 
Архітектурна схема сайту є ключовою складовою його структури, яка визначає 
взаємозв’язки між окремими елементами та забезпечує узгодженість усіх 
функціональних компонентів. Вона дозволяє досягти оптимального балансу між 
функціональністю, безпекою та зручністю використання. 
На схемі архітектури сайту платформи енергонезалежних пристроїв можна 
побачити логічне розміщення основних розділів. Зліва розташовано головне меню з 
доступом до інформаційних сторінок — «Контакти», «Про нас», «Оплата» тощо. 
Праворуч передбачено категорії та підкатегорії товарів, що дає змогу впорядкувати 
асортимент і полегшити користувачам пошук необхідного товару. 
Чітке структурування сайту, відображене на архітектурній схемі (рис. 2.1), 
сприяє зменшенню кількості кроків для досягнення цілі користувача та підвищує 
загальну ефективність взаємодії з ресурсом. 
 3
3 
 
Рисунок 2.1 – Схема архітектури сайту інтернет-платформи 
В цілому, рисунок архітектури веб-сайту інтернет-платформи відображає 
грамотно спроєктовану структуру, яка сприяє досить зручній навігації та 
покращенню загального користувацького досвіду. 
Архітектура веб-сайту визначає не лише логічну побудову його елементів, а й 
суттєво впливає на ефективність використання системних ресурсів і рівень безпеки. 
Раціонально спроєктована архітектура сприяє зручній навігації, швидкому 
завантаженню сторінок і забезпеченню належного захисту від потенційних 
кіберзагроз. Вона також визначає швидкість обробки запитів користувачів, що є 
важливим чинником у формуванні позитивного досвіду взаємодії з веб-ресурсом. 
Усі ці компоненти мають вирішальне значення для успішного функціонування 
сайту, його подальшого розвитку, конкурентоспроможності на ринку та 
привабливості для відвідувачів. Наведена схема архітектури інтернет-платформи 
демонструє приклад ефективно організованої структури, яка сприяє покращенню 
зручності користування та загальної результативності веб-ресурсу. 
2.4 Розробка діаграми варіантів використання 
 3
Створення діаграми варіантів використання є важливим етапом проєктуванн4я  
веб-сайту інтернет-платформи з продажу енергонезалежних пристроїв. Така діаграма 
дозволяє структуровано представити основні функціональні вимоги до системи, 
виокремити типові сценарії взаємодії користувачів із ресурсом та визначити 
ключових учасників цих процесів — так званих акторів. 
Перш ніж розпочинати побудову діаграми, необхідно провести аналіз потреб і 
очікувань користувачів платформи. На цьому етапі визначаються основні функції 
сайту — перегляд продукції, здійснення замовлення, оплата, реєстрація облікових 
записів тощо. Виходячи з отриманих результатів, формується перелік варіантів 
використання, який ляже в основу майбутньої діаграми. 
Далі відбувається безпосереднє проєктування діаграми варіантів використання 
за допомогою нотацій UML (Unified Modeling Language). У межах цієї моделі кожен 
варіант використання ілюструє певний сценарій взаємодії з системою, що 
здійснюється певним актором і включає послідовність дій або операцій, які можуть 
бути реалізовані на веб-платформі. 
До основних елементів діаграми належать: 
1. Актори – ключові учасники взаємодії з сайтом (наприклад, 
зареєстрований користувач, гість, адміністратор). 
2. Сценарії – узгоджені послідовності дій, які виконують актори або 
система у відповідь на їхні запити. 
3. Взаємодії – канали зв’язку між користувачем і платформою: запити, 
відповіді, обмін інформацією. 
До основних функціональних можливостей платформи належать: 
Покупка та доставка товарів 
– Користувач має змогу переглядати каталог енергонезалежних пристроїв, додавати 
товари до кошика й оформлювати замовлення. 
– Після обробки замовлення система надає розрахунок загальної вартості, 
враховуючи доставку, а також доступні варіанти оплати. 
– Користувач отримує підтвердження замовлення і подальшу інформацію щодо 
доставки. 
 3
Сортування та пошук 5 
– Платформа надає можливість фільтрувати товари за ціною, характеристиками 
та іншими критеріями, що спрощує пошук потрібної продукції. 
Реєстрація та особистий кабінет 
– Користувачі можуть створювати персональні облікові записи для зберігання 
інформації про замовлення, адреси доставки, способи оплати. 
– У кабінеті доступна інформація про поточні замовлення, можливість змінити 
персональні дані й отримати індивідуальні пропозиції. 
Відгуки та рейтинги товарів  
– Користувачі мають змогу залишати відгуки, оцінювати продукцію, що сприяє 
об'єктивному вибору товарів іншими відвідувачами. 
– Система автоматично формує рейтинг товарів, ґрунтуючись на оцінках і відгуках. 
Акції та спеціальні пропозиції 
– Сайт підтримує функціонал створення акційних пропозицій для залучення нових 
клієнтів і заохочення постійних. 
– Користувачі можуть отримувати сповіщення про актуальні знижки й акції, що 
стимулює здійснення покупок. 
Перш ніж переходити до побудови конкретних сценаріїв використання, варто 
наголосити, що діаграма варіантів використання є інструментом для візуалізації 
функціональних можливостей платформи. Вона допомагає розробникам, аналітикам 
і дизайнерам чітко уявити, які дії може виконувати користувач і як саме він взаємодіє 
з інтерфейсом сайту (рис. 2.2). 
 3
6 
 
Рисунок 2.2 – Діаграма варіантів використання 
Після створення діаграми варіантів для використання вона стає цінним 
інструментом для подальшого проєктування та розробки веб-сайту. Вона дозволяє не 
лише чітко визначити функціонал системи, а й забезпечити оптимальний досвід 
користувачів. Крім того, вона ж є основою для проведення тестування та 
вдосконалення такого функціоналу сайту в майбутньому, що робить її важливою 
частиною проєктного процесу. 
2.5 Проєктування структури бази даних  
Створення ефективної структури бази даних є одним із найважливіших етапів 
у розробці веб-сайту, особливо в разі використання систем керування вмістом, таких 
як WordPress, у поєднанні з локальними серверами, зокрема MAMP, та базою даних 
MySQL. Грамотно спроєктована база даних сприяє раціональному зберіганню 
інформації, її ефективній обробці та стабільному функціонуванню сайту. 
 3
У процесі проєктування структури БД для сайту, що працює на WordPress і7з  
локальним сервером MAMP і MySQL, слід врахувати низку ключових моментів: 
Аналіз функціональних потреб. Перед початком проєктування бази даних 
необхідно здійснити ґрунтовний аналіз цілей і задач веб-сайту. Це включає 
визначення категорій даних, які потрібно зберігати (наприклад, інформація про 
користувачів, товари, замовлення), їхні взаємозв’язки та передбачуваний обсяг. 
Формування структури таблиць. На основі попереднього аналізу формується 
структура таблиць: кожен тип даних має бути представлений окремою таблицею. 
Також визначаються зв’язки між таблицями через первинні та зовнішні ключі. 
Наприклад, таблиці можуть відповідати за товари, замовлення, клієнтів, оплати тощо. 
Нормалізація даних. Щоб уникнути дублювання інформації та підтримувати її 
узгодженість, слід застосовувати принципи нормалізації. Це дозволяє структурувати 
дані так, щоб кожна одиниця зберігалась лише в одному місці, забезпечуючи логічну 
цілісність бази. 
Використання індексів. Індексація відіграє важливу роль у пришвидшенні 
виконання запитів до бази. Вона дає змогу значно скоротити час на пошук, 
сортування та обробку даних, що особливо важливо для систем з великим обсягом 
інформації. 
Захист даних. Безпека бази даних має бути пріоритетом. Важливо реалізувати 
захист від SQL-ін’єкцій, налаштувати обмеження доступу до бази лише для 
авторизованих користувачів, а також забезпечити регулярне створення резервних 
копій даних. 
Оптимізація продуктивності. Для досягнення максимальної ефективності 
функціонування бази даних необхідно оптимізувати SQL-запити, реалізувати 
механізми кешування, а також застосовувати інші техніки підвищення швидкодії 
системи. 
Після створення та впровадження структури бази даних слід провести 
тестування та валідацію. Цей етап дає змогу перевірити працездатність і ефективність 
системи в умовах реального навантаження, а також виявити та усунути можливі 
недоліки. 
 3
Крім того, для забезпечення стабільної та надійної роботи веб-ресурсу 8в  
майбутньому необхідно здійснювати постійний моніторинг БД, оновлювати її 
структуру відповідно до змін у функціоналі сайту й потреб користувачів, а також 
виконувати регулярне технічне обслуговування. 
Отже, якісне проєктування, впровадження й підтримка бази даних створюють 
надійну основу для ефективної роботи веб-сайту, сприяючи стабільному доступу до 
інформації та задоволенню користувацьких очікувань. 
2.6 Опис процесу проєктування структури сайту інтернет-платформи 
енергонезалежних товарів 
Процес створення структури сайту інтернет-платформи енергонезалежних 
товарів був комплексним і передбачав ретельне планування, що охоплювало низку 
важливих етапів, кожен з яких мав ключове значення для формування зручного та 
функціонального веб-середовища для користувачів. 
На початковій стадії було здійснено проєктування макетів сторінок за 
допомогою онлайн-сервісу Ninjamock. Це дало змогу наочно уявити розміщення 
основних елементів інтерфейсу, оцінити ергономіку сайту та забезпечити логічну й 
послідовну навігацію. На цьому етапі особлива увага приділялась відповідності 
дизайну очікуванням цільової аудиторії. 
Наступним кроком стала реалізація структури сайту на основі CMS WordPress 
із використанням локального серверного середовища MAMP. Для створення 
естетично привабливого та функціонального дизайну була обрана тема Kadence, яка 
відзначається гнучкими можливостями налаштування та сучасним виглядом 
інтерфейсу. 
У сформовану структуру сайту входять такі ключові сторінки: 
Головна сторінка 
Це основна точка входу на сайт, що знайомить відвідувачів з асортиментом 
товарів і поточними пропозиціями. На головній сторінці розміщено блоки з 
найновішими надходженнями, інформацією про знижки та спеціальні пропозиції. Її 
дизайн орієнтований на швидкий доступ до найважливішої інформації, що дозволяє 
 3
користувачам без зайвих кроків переходити до перегляду товарів або оформленн9я  
замовлення (рис. 2.3).  
Рисунок 2.3 – Макет сторінки «Головна» 
Сторінка «Каталог»: ця сторінка є центральним місцем, де представлений повний 
каталог енергонезалежних пристроїв, доступних на сайті. Користувачі можуть зручно 
переглядати товари і скористатися можливістю сортування та фільтрації за різними 
критеріями, такими як ціна, категорія товарів, рейтинг користувачів, новинки тощо. 
Це значно полегшує процес знаходження потрібного товару і дозволяє здійснити 
покупку швидко та зручно (рис. 2.4). 
 4
0 
 
Рисунок 2.4 – Макет сторінки «Товари» 
Сторінка «Перегляд товару»: на цій сторінці детально описані характеристики 
кожного товару, його особливості та переваги. Користувачам надається можливість 
додати товар до кошика безпосередньо з цієї сторінки, а також переглянути відгуки 
та оцінки інших покупців, що дозволяє зробити обґрунтований вибір при покупці. 
Завдяки інформації на цій сторінці користувач може докладно ознайомитися з 
продуктом перед придбанням, що робить цю сторінку ключовою для прийняття 
рішення про покупку (рис. 2.5). 
 4
1 
 
Рисунок 2.5 – Макет сторінки «Перегляд товару» 
Сторінка «Про нас»: тут надана інформація про компанію, її історія, місія та цінності. 
Користувачі можуть дізнатися більше про те, хто стоїть за веб-сайтом і які принципи 
керують діяльністю компанії (рис. 2.6). 
 
Рисунок 2.6 – Макет сторінки «Про нас» 
 4
На цій сторінці зібрано всю необхідну інформацію для зв’язку з компанією2.  
Відвідувачі сайту мають змогу звернутися за консультацією щодо товарів чи послуг, 
отримати технічну підтримку або залишити свої відгуки й зауваження. Компанія 
гарантує швидкий та професійний зворотний зв’язок, що сприяє підвищенню рівня 
довіри та комфорту клієнтів під час взаємодії з платформою (рис. 2.7). 
 
Рисунок 2.7 – Макет сторінки «Контакти» 
Ця сторінка надає користувачам змогу легко та зручно завершити процес 
покупки. Вони можуть обрати бажаний спосіб доставки та оплати, внести необхідну 
контактну інформацію й деталі для доставки товару. Інтерфейс сторінки спрощує 
оформлення замовлення, забезпечуючи швидкий та безперешкодний процес 
придбання, що позитивно впливає на загальний користувацький досвід (рис. 2.8). 
 4
3 
 
Рисунок 2.8 – Макет сторінки «Оформлення замовлення» 
Увесь процес для проєктування структури сайту є орієнтований на 
забезпечення зручності використання для всіх користувачів, оптимізації швидкості 
завантаження сторінок та безпеки обробки особистої інформації про клієнтів. Крім 
того, було приділено увагу по адаптивності дизайну під різні пристрої, щоб 
забезпечити однаково зручний доступ до сайту як на комп'ютерах, так і на мобільних 
пристроях. 
Загальна мета проєктування структури сайту полягала у створенні 
функціональної та привабливої інтернет-платформи енергонезалежних товарів, що 
відповідає потребам користувачів і сприяє ефективному просуванню та розвитку 
бізнесу. 
2.7 Проєктування інтерфейсу користувача 
Проєктування інтерфейсу користувача є ключовим етапом у розробці веб-
сайтів, особливо для інтернет-платформ енергонезалежних пристроїв. При розробці 
інтерфейсу враховуються не лише естетичні аспекти, але й функціональність та 
 4
зручність для користувачів. Основні принципи, які враховуються: 4 
Навігація та структура сайту: правильно організована система навігації дає 
змогу користувачам швидко орієнтуватися на сайті та знаходити потрібну 
інформацію. Це охоплює зрозумілі меню, логічну побудову сторінок і зручні 
маршрути переходу між розділами. 
Адаптивність інтерфейсу: інтерфейс повинен коректно відображатися на різних 
пристроях – від комп’ютерів до смартфонів – забезпечуючи зручність користування 
незалежно від розміру екрана. 
Візуальна привабливість: зовнішній вигляд сайту має бути естетично приємним 
і відповідати сучасним тенденціям, із гармонійно підібраними кольорами, шрифтами, 
іконками та графічними елементами, що формують позитивне враження. 
Зручність взаємодії: сайт має бути інтуїтивно зрозумілим у користуванні — 
користувачі повинні без труднощів шукати товари, додавати їх до кошика, 
оформлювати замовлення й звертатися до служби підтримки. 
Повноцінна функціональність: інтерфейс повинен охоплювати весь необхідний 
функціонал для здійснення покупок, зокрема можливість переглядати 
характеристики товарів, читати відгуки, обирати способи доставки та оплати. 
Тестування й удосконалення: після створення інтерфейсу проводяться 
випробування з метою виявлення недоліків. За результатами тестування вносяться 
відповідні зміни для підвищення зручності користування. 
Якісний контент і комунікація: інтерфейс має забезпечувати не лише 
інформативність, а й ефективну взаємодію з відвідувачами — через форми зворотного 
зв’язку, онлайн-чати, реагування на коментарі та відгуки.Проєктування інтерфейсу 
користувача для інтернет-платформи енергонезалежних пристроїв включає в себе 
комплексний підхід, що спрямований на забезпечення зручності, ефективності та 
задоволення потреб користувачів під час їхнього перебування на сайті. 
Висновки до розділу 2 
У другому розділі було проаналізовано ключові етапи розробки інтернет-
платформи енергонезалежних пристроїв, зокрема побудову бази даних, формування 
 4
структури сайту та проєктування інтерфейсу користувача. Основні підсумки5  
викладено нижче: 
1. Проєктування бази даних: правильне створення структури бази даних є 
фундаментом для ефективного управління інформацією на сайті. Дотримання 
базових принципів проєктування забезпечує стабільність, масштабованість і 
продуктивність системи. 
2. Структура веб-сайту: раціонально побудована структура ресурсу з 
урахуванням очікувань користувачів сприяє зручній навігації, спрощує пошук 
інформації та покращує загальний досвід взаємодії з платформою. 
3. Інтерфейс користувача: якісно розроблений UI має вирішальне 
значення для залучення й утримання відвідувачів. Зрозуміле управління, 
привабливий зовнішній вигляд і наявність потрібного функціоналу сприяють 
підвищенню рівня задоволення клієнтів. 
4. Адаптивність і продуктивність: забезпечення коректної роботи сайту на 
різних типах пристроїв, а також оптимізація швидкості завантаження сторінок 
позитивно впливають на користувацький досвід і позиції ресурсу в пошуковій видачі. 
5. Загальні висновки: дотримання вищезазначених підходів і 
впровадження сучасних технологій у процес розробки дозволяє створити 
конкурентоспроможну інтернет-платформу, що задовольняє як потреби 
користувачів, так і вимоги бізнесу. 
 
 
 
 
 
 
 
  
 4
3 ПРОГРАМНА РЕАЛІЗАЦІЯ ІНТЕРНЕТ-ПЛАТФОРМИ 6 
ЕНЕРГОНЕЗАЛЕЖНИХ ПРИСТРОЇВ 
3.1 Опис реалізації завдання 
Головною метою кваліфікаційної роботи бакалавра стало створення веб-сайту 
для інтернет-платформи, що спеціалізується на енергонезалежних пристроях. 
Для реалізації проєкту було обрано платформу WordPress у поєднанні з 
локальним сервером MAMP. База даних, створена на основі MySQL Server, була 
інтегрована з WordPress під назвою «wordpress». Такий підхід забезпечив 
автоматичне оновлення вмісту бази даних у процесі внесення змін на сайті, що 
дозволило оперативно актуалізувати інформацію та підвищити зручність для 
користувачів. 
Процес реалізації завдання включав кілька ключових кроків: 
Формування структури бази даних: Було спроєктовано детальну схему бази 
даних, яка включає таблиці для категорій товарів, окремих товарних позицій, 
замовлень, користувачів та іншої ключової інформації, необхідної для 
функціонування онлайн-магазину. 
Розробка користувацького інтерфейсу: Для створення зручного й естетично 
привабливого інтерфейсу було обрано тему Kadence у середовищі WordPress. 
Попередньо макети сторінок були створені в сервісі Ninjamock, що дозволило швидко 
перейти до реалізації без затримок. 
Функціональність платформи: Реалізовано базовий набір функцій для 
користувачів, зокрема перегляд товарного каталогу, фільтрацію за різними 
параметрами, додавання товарів до кошика та оформлення замовлення з вибором 
способу доставки й оплати. 
Безпека та оптимізація: У проєкті були застосовані сучасні засоби захисту 
даних та методи оптимізації, що дозволяють забезпечити стабільну, безпечну та 
продуктивну роботу веб-сайту в умовах реального використання.Під час розробки 
сайту виникла необхідність уважно аналізувати та виправляти помилки, що 
допускалися під час програмування та налаштування. Важливою складовою було 
 4
також тестування функціоналу на різних пристроях та веб-браузерах, що7б  
забезпечити коректну роботу сайту для всіх користувачів. 
У результаті реалізації завдання вдалося створити функціональний та 
привабливий інтернет-магазин, який задовольняє потреби користувачів у зручному та 
безпечному шопінгу енергонезалежних пристроїв. 
3.2 Опис архітектури програмного забезпечення 
Інтернет-магазин «Вільна енергія» базується на сучасних технологіях та 
платформах для забезпечення надійності та ефективності його роботи. Основні 
технічні параметри включають в себе: 
 CMS (Content Management System): Web-сайт розроблено з 
використанням популярної системи управління контентом WordPress, що дозволяє 
легко керувати вмістом сайту та його функціональністю. 
 Хостинг: Для локального розроблення та тестування використовується 
MAMP (MySQL, Apache, PHP), що забезпечує зручність та швидкість роботи з сайтом 
на власному комп'ютері. 
 БД: Дані сайту зберігаються в MySQL Server, назва бази даних 
«wordpress», що забезпечує надійну та швидку роботу з великим обсягом інформації. 
 Мови програмування: Веб-сайт написаний на PHP, використовує HTML, 
CSS, та JavaScript для коректного відображення та взаємодії з користувачами. 
Технічні параметри платформи «Вільна енергія» відіграють ключову роль у 
забезпеченні її стабільної та надійної роботи, що сприяє ефективному 
функціонуванню веб-сайту в цілому. 
Структура сайту ретельно опрацьована та охоплює всі основні розділи, 
необхідні для зручної навігації й повноцінної взаємодії користувачів із ресурсом: 
Головна сторінка: слугує вітальним елементом, знайомить відвідувачів з 
магазином та актуальними пропозиціями. 
Каталог товарів: представлений у вигляді зручної категоризованої системи, що 
дозволяє швидко знаходити необхідні товари. 
 4
Про магазин: містить відомості про історію компанії, її місію, бачення та цінності8.  
Контакти: надає всі необхідні способи зв’язку з адміністрацією платформи. 
Особистий кабінет: функціональний простір для зареєстрованих користувачів, де 
зберігається історія замовлень і налаштування профілю. 
Кошик: інтерфейс управління обраними товарами перед підтвердженням 
замовлення. 
Оформлення замовлення: сторінка, на якій користувач заповнює контактні дані, 
обирає спосіб оплати та доставки й завершує покупку. 
Додаткові розділи: включають інші інформаційні або сервісні сторінки, які 
розширюють функціональність ресурсу. 
Завдяки продуманій структурі, користувачі можуть легко орієнтуватися на 
сайті та швидко знаходити потрібну інформацію або товари. 
Крім того, грамотна побудова архітектури сайту сприяє раціональному 
використанню серверних ресурсів, що забезпечує високу швидкість завантаження 
сторінок та безперебійну роботу платформи. Ефективно налаштована система 
керування контентом у поєднанні з базою даних дає змогу зручно адмініструвати 
сайт, оперативно оновлювати інформацію та зберігати важливі дані щодо товарів, 
користувачів та замовлень. 
3.3 Огляд сторінок та інструкції користувача 
Інтернет-магазин «Вільна енергія» пропонує досить широкий вибір 
енергонезалежних пристроїв від надійних та провідних виробників. Зусилля 
спрямовані власне на забезпечення зручності та надійності під час покупок. Кожна 
сторінка сайту ретельно розроблена з урахуванням потреб користувачів. 
Сторінка «Головна» 
Початкова сторінка сайту (рис. 3.1) привітно вітає з відгуками задоволених 
клієнтів, коротким описом магазину та спеціальними акційними пропозиціями. Для 
зручності навігації по сайту, розміщено верхнє меню, що містить всі основні категорії 
товарів та сервісів. Завдяки цьому, можна легко знайти потрібну інформацію та 
перейти до відповідних розділів сайту. 
 4
9 
 
Рисунок 3.1 – Сторінка «Головна» 
Сторінка «Каталог» 
В каталозі (рис. 3.2) представлені усі доступні товари з можливістю фільтрації 
за категоріями, цінами та іншими параметрами для зручного пошуку необхідних 
позицій. Тут користувач може одразу додати товар, який йому сподобався, до кошика, 
або перейти на сторінку товару для отримання додаткової інформації. З 
використанням фільтрів користувач можете швидко знаходити товари, що 
відповідають його потребам та побажанням. 
 
Рисунок 3.2 – Сторінка «Каталог» 
 
Сторінка «Про магазин» 
 5
На сторінці «Про магазин» (рис. 3.3) представлена детальна інформація пр0о  
команду, історію розвитку та основні цінності, що втілюються в роботі з клієнтами. 
Знайти важливі дані про склад команди, історичні кроки у розвитку магазину та 
основні принципи співпраці з покупцями можна саме тут. 
 
Рисунок 3.3 – Сторінка «Про магазин» 
Сторінка «Контакти» 
На сторінці «Контакти» (рис. 3.4) доступна контактна інформація та форма для 
зв'язку з менеджерами для консультацій чи вирішення питань. 
 
Рисунок 3.4 – Сторінка «Контакти» 
Сторінка «Особистий кабінет» 
 5
У персональному кабінеті користувача (рис. 3.5) доступна не лише можливіст1ь  
перегляду історії попередніх замовлень, а й контроль за їх поточним статусом і 
орієнтовними термінами доставки. Окрім цього, клієнти мають змогу зручно 
оновлювати свої особисті дані, зокрема адресу доставки, контактні телефони та 
електронну пошту. Додаткові функції кабінету включають створення списку бажаних 
товарів, підписку на розсилки новин, а також отримання індивідуальних 
рекомендацій на основі попередніх покупок. 
 
Рисунок 3.5 – Сторінка  «Особистий кабінет» 
1. Сторінки «Кошик» а також «Оформлення замовлення» 
Отже, на сторінці «Кошик» (рис. 3.6) клієнти можуть переглядати і змінювати 
кількість, видаляти товари та переглядати загальну вартість замовлення перед 
оформленням.  
Сторінка «Оформлення замовлення» (рис. 3.7) дозволяє вибрати зручний спосіб 
доставки та оплати, заповнити необхідні контактні дані і завершити процес покупки 
з підтвердженням замовлення. 
 5
2 
 
Рисунок 3.6 – Сторінка   «Кошик» 
 
Рисунок 3.7 – Сторінка   «Оформлення замовлення» 
На веб-сайті передбачено низку додаткових інформаційних сторінок, зокрема 
умови користування сервісом, політика повернення товарів, а також розділи з 
детальними інструкціями щодо оплати та доставки. Завдяки розміщеним у футері 
(нижній частині сайту) посиланням, користувачі можуть швидко отримати відповіді 
на поширені запитання, не витрачаючи зайвий час на пошук. 
У нижній частині кожної сторінки (рис. 3.8) також зручно згруповано 
 5
посилання на всі основні категорії товарів, що забезпечує швидкий доступ до3  
необхідного розділу. Крім того, тут розміщені переходи на офіційні сторінки 
магазину в соціальних мережах, де регулярно оновлюється контент, публікуються 
новини та спеціальні пропозиції для клієнтів. 
 
Рисунок 3.8 – Футер сайту 
3.4 Особливості тестування веб-сайту 
Тестування веб-сайту є ключовим етапом у процесі створення ресурсу, що дає 
змогу перевірити його функціональність, швидкодію та коректність відображення на 
різних пристроях і у різних веб-браузерах. 
Інтернет-платформа «Вільна енергія» проходить комплексне тестування з 
метою виявлення можливих технічних помилок і недоліків, які можуть вплинути на 
стабільність роботи ресурсу або погіршити досвід користувача. Для цього 
застосовуються різноманітні методи перевірки, що забезпечують високий рівень 
надійності, продуктивності та зручності у використанні. 
Основні методи тестування: 
Функціональне тестування — здійснюється з метою перевірки відповідності 
роботи сайту запланованому функціоналу. Це охоплює тестування ключових 
процесів: оформлення замовлень, роботу особистого кабінету, навігацію, пошук 
товарів тощо. 
Тестування інтерфейсу — передбачає перевірку коректності розташування та 
відображення елементів інтерфейсу користувача, включаючи адаптивність до різних 
 5
екранів та браузерів. 4 
Оцінка продуктивності — включає аналіз швидкості завантаження сторінок, 
часу відповіді сервера та інших технічних параметрів, що впливають на загальну 
швидкодію сайту. 
Тестування сумісності — забезпечує перевірку функціонування платформи на 
різних пристроях і браузерах з метою гарантування коректної роботи незалежно від 
середовища користувача.Процедури тестування: 
1. Підготовка тестових сценаріїв: розробка та виконання тестових сценаріїв для 
оцінки різних аспектів роботи сайту. 
2. Виконання тестів на реальних умовах: тестування в реальних умовах 
використання сайту, залучення реальних користувачів для оцінки 
функціональності та зручності використання. 
3. Аналіз результатів тестування: оцінка отриманих результатів тестування, 
ідентифікація помилок та недоліків, розробка плану вдосконалення та 
оптимізації роботи сайту. 
Тестування є невід'ємною складовою забезпечення якості та надійної роботи 
веб-сайту «Вільна енергія». Воно дає змогу своєчасно виявляти та усувати проблеми, 
пов’язані з функціональністю та взаємодією з користувачами. У процесі тестування 
використовуються різні підходи: модульне, інтеграційне, системне та UX/UI-
тестування. 
Модульне тестування дозволяє перевірити роботу окремих елементів сайту — 
функцій, скриптів чи компонентів — в ізоляції від інших частин системи. 
Інтеграційне тестування спрямоване на перевірку того, як ці елементи працюють 
разом, і допомагає виявити збої, що можуть виникнути під час їх взаємодії. 
Системне тестування охоплює всю платформу в цілому, оцінюючи її відповідність 
технічним і функціональним вимогам в умовах, наближених до реального 
використання. 
UX/UI-тестування моделює поведінку реальних користувачів, що дозволяє 
оцінити зручність інтерфейсу, інтуїтивність навігації та загальне враження від роботи 
з сайтом. 
 5
Комплексне застосування всіх видів тестування забезпечує підготовк5у  
платформи «Вільна енергія» до стабільної, безперебійної та комфортної роботи для 
кінцевих користувачів. 
3.5 Аналіз отриманих результатів 
Оцінювання продуктивності та швидкодії веб-сайту є важливою складовою 
аналізу його ефективності, оскільки надає об'єктивне уявлення про якість 
функціонування ресурсу. Для цього застосовуються спеціалізовані інструменти та 
показники, які дозволяють комплексно оцінити ефективність використання ресурсів 
та загальну стабільність роботи сайту. Такий аналіз допомагає своєчасно виявляти 
вузькі місця, що впливають на швидкодію, і створює основу для подальшої 
оптимізації. 
 
Одним із ключових параметрів є час завантаження сторінок, що вимірюється в 
секундах. Цей показник безпосередньо впливає на зручність користування: чим 
швидше завантажується сайт, тим вища ймовірність позитивного враження у 
відвідувача. Оптимальний час завантаження сприяє підвищенню задоволеності 
користувачів, особливо в умовах жорсткої конкуренції та високих очікувань до якості 
онлайн-сервісів. Забезпечення швидкого завантаження покращує загальну взаємодію 
з сайтом і сприяє утриманню цільової аудиторії. 
 
Крім того, проводилося тестування сайту на різноманітних пристроях і в 
популярних браузерах для перевірки сумісності та коректного відображення 
контенту. Це дозволило гарантувати стабільну роботу веб-ресурсу на різних 
платформах і уникнути проблем з версткою чи функціональністю. Забезпечення 
адаптивності сайту розширює його охоплення та підвищує якість користувацького 
досвіду. 
 
Окрему увагу було приділено продуктивності бази даних, особливо в умовах 
збільшеного обсягу інформації та навантаження на сервер. Застосування інструментів 
 5
для моніторингу та аналізу дозволило виявити вузькі місця в обробці запитів 6і  
провести необхідну оптимізацію. Це забезпечило ефективніше використання ресурсів 
і сприяло загальному підвищенню швидкодії сайту. 
 
Результати оцінювання продуктивності за допомогою Lighthouse (рис. 3.9–3.10) 
засвідчили зростання рейтингу з 72 до 81 після впровадження низки оптимізаційних 
заходів. Це є свідченням успішного покращення технічних параметрів і позитивного 
впливу на роботу веб-сайту. 
 
 
Рисунок 3.9 – Оцінка продуктивності для сайту в Lighthouse до самої оптимізації 
 5
7 
 
Рисунок 3.10 – Оцінка продуктивності цього сайту в Lighthouse після оптимізації 
Під час оцінювання продуктивності та швидкодії веб-сайту «Вільна енергія» 
було розглянуто кілька ключових компонентів: 
1. Час завантаження сторінок — його оптимізація позитивно позначається 
на взаємодії з користувачем і зменшує ризик втрати відвідувачів через повільну 
роботу ресурсу. 
2. Адаптивність і кросплатформеність — перевірка відображення сайту на 
різних пристроях і в браузерах гарантує стабільне функціонування незалежно від 
технічних умов користувача. 
3. Продуктивність бази даних — аналіз ефективності обробки запитів 
дозволяє забезпечити стабільну роботу ресурсу навіть при високих навантаженнях. 
4. Інструменти оцінювання продуктивності — використання Lighthouse та 
подібних засобів допомагає отримати об’єктивну картину технічного стану сайту та 
виявити напрями для оптимізації. 
У ході дослідження були виявлені певні недоліки, що потребують 
доопрацювання. Зокрема, встановлено, що деякі запити до бази даних мають 
тенденцію до зниження ефективності при зростанні обсягу інформації, що може 
негативно вплинути на загальну продуктивність. 
 5
Таким чином, всебічний аналіз продуктивності веб-сайту дозволяє своєчасн8о  
виявляти вузькі місця та впроваджувати заходи з удосконалення. Це сприяє 
підвищенню загальної ефективності ресурсу та покращенню користувацького 
досвіду. 
Висновки до розділу 3 
У третьому розділі кваліфікаційної роботи було всебічно розглянуто програмну 
реалізацію інтернет-платформи енергонезалежних пристроїв «Вільна енергія». 
Зокрема, представлено етапи розробки веб-сайту, описано архітектуру програмного 
забезпечення, особливості процесу тестування, а також здійснено аналіз отриманих 
результатів. 
Розробка здійснювалася із використанням сучасних технологій і методів, що 
дало змогу створити функціональний, стабільний і продуктивний інтернет-ресурс. 
Результати тестування підтвердили коректну роботу сайту в різних браузерах та на 
різноманітних пристроях, а також засвідчили його високу швидкодію і зручність для 
кінцевого користувача. 
У процесі аналізу результатів були визначені напрями для подальшого 
вдосконалення платформи, зокрема покращення швидкості завантаження сторінок, 
оптимізація серверної відповіді, підвищення адаптивності інтерфейсу та 
ефективності роботи з базою даних для раціонального використання серверних 
ресурсів. 
Проведені дослідження та оцінка функціональних характеристик веб-сайту 
свідчать про високий рівень його реалізації, відповідність сучасним стандартам якості 
та актуальним вимогам до веб-ресурсів. У рамках оцінки продуктивності було 
враховано низку ключових факторів: швидкість завантаження, кросплатформенність, 
ефективність роботи бази даних, а також результати тестування за допомогою 
інструменту Lighthouse. 
Такий комплексний підхід забезпечує стабільну, ефективну та зручну роботу 
інтернет-платформи для користувачів незалежно від пристрою чи середовища 
доступу. 
 5
ВИСНОВКИ 9 
Мету кваліфікаційної роботи бакалавра досягнуто. У процесі її виконання було 
здійснено всебічний аналіз і реалізацію інтернет-платформи «Вільна енергія», 
орієнтованої на продаж енергонезалежних пристроїв. Визначено та реалізовано 
основні завдання проєкту, зокрема розробку користувацького інтерфейсу, 
оптимізацію функціональних процесів та впровадження заходів із забезпечення 
захисту даних. 
У результаті створено повноцінний інтернет-магазин, що пропонує широкий 
асортимент товарів: генератори, сонячні батареї, вітрогенератори та інші пристрої для 
автономного енергозабезпечення. Проведене тестування ключових елементів сайту 
дозволило досягти високого рівня надійності та ефективності, що є критично 
важливим для забезпечення комфортного користування ресурсом. 
Запропонований веб-сайт має потенціал стати значущим інструментом для 
популяризації енергонезалежних технологій, сприяючи поширенню екологічно 
чистих рішень серед широкого кола споживачів. Це, у свою чергу, сприятиме 
розвитку зеленої енергетики та формуванню екологічної відповідальності. 
Майбутній розвиток проєкту може включати розширення функціональних 
можливостей, збільшення асортименту товарів і вдосконалення дизайну та зручності 
інтерфейсу. Отримані результати також можуть слугувати основою для подальших 
досліджень у сфері автономних енергетичних систем і розвитку аналогічних онлайн-
платформ. 
Загалом, реалізація інтернет-платформи «Вільна енергія» є вагомим внеском у 
розвиток сталих енергетичних рішень і сприяє зменшенню негативного впливу на 
довкілля. 
  
 6
СПИСОК ВИКОРИСТАНИХ ДЖЕРЕЛ 0 
1. Інтернет-магазин «ЕСКО». URL: https://www.esco.ua/uk/ (дата звернення: 
11.03.2024). 
2. Інтернет-магазин «Епіцентр».URL: https://epicentrk.ua/ (дата звернення: 
11.03.2024). 
3. Інтернет-магазин «Альцест». URL: https://e-altsest.com/ua/ (дата звернення: 
11.03.2024). 
4. Інтернет-магазин «Енерджі Юа». URL: https://energyua.com.ua/ (дата звернення: 
11.03.2024). 
5. Інтернет-магазин «Energo Sklad». URL: https://energosklad.com.ua/ua/ (дата 
звернення: 11.03.2024). 
6. Васильєв О.С., Васильєва І.В. Дизайн інтернет-платформи: вагома складова 
його успішності. // Інноватика: збірник наукових праць. - 2020. - № 4. - С. 467-
472. URL: https://journals.sagepub.com/doi/abs/10.1177/10538259221098549 (дата 
звернення: 20.03.2024). 
7. Стаття: Тренди в Створенні Сайтів. URL:  https://www.plerdy.com/ 
ua/blog/trends-2020-ecommerce-website-creation/ (дата звернення: 21.03.2024). 
8. Інтернет-магазин «Розетка».  URL:  https://rozetka.com.ua/ (дата 
звернення: 28.03.2024). 
9. Система керування вмістом WordPress. URL: https://uk.wordpress.org/ (дата 
звернення: 15.03.2024). 
10. Набір програмного забезпечення для створення локального веб-сервера 
MAMP. URL: https://www.mamp.info/en/mamp/windows/  (дата звернення: 
15.03.2024). 
11. Стаття: 15+ визначних прикладів інтернет-платформ. Як відкрити інтернет-
магазин: https://impulse-design.com.ua/ua/15-vydayushchikhsya-primerov-
internet-magazinov.html  (дата звернення: 21.03.2024). 
12. Стаття: Як відкрити інтернет-магазин. URL:  
https://fondy.ua/uk/knowledge/online-store-creation/ (дата звернення: 21.03.2024). 
 6
13. Стаття: СТВОРЕННЯ ІНТЕРНЕТ-ПЛАТФОРМИ. URL1:  
https://koloro.ua/ua/sozdanie-internet-magazina.html (дата звернення: 22.03.2024). 
14. Стаття: Як вивести правильну структуру сайту. URL: https://elit-
web.ua/ua/blog/kak-vyvesti-tekuschuju-strukturu-sajta (дата звернення: 
23.03.2024). 
15. Стаття: Як відкрити свій інтернет-магазин. URL: https://appointer.ua/blog/yak-
vidkrity-sviy-internet-magazin-ukraini-v%E2%80%93ukraine-z-nulya-pokrokoviy-
putivnik/  (дата звернення: 25.03.2024). 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 6
ДОДАТОК А 2 
 
 
 
        Затверджую               
Зав. кафедри ІТП, 
___________ Тетяна ПРОКОПЕНКО 
«____»__________2025 р.                              
 
 
 
 
 
 
 
ІНТЕРНЕТ ПЛАТФОРМА З ПРОДАЖУ ЕНЕРГОНЕЗАЛЕЖНИХ РОЗУМНИХ 
ПРИСТРОЇВ 
 
Специфікація  
482.ЧДТУ. 52220-01  
 
Листів 2 
 
 
 
 
 
 
Розробник                          ____________________                 Ясюк Д. 
 
Керівник                             ____________________                Катаєв Д.В. 
 
 
 
 
 
 
 
 
 
 
 
 
 
Черкаси – 2025 
 6
482.ЧДТУ. 52220-01 3 
Позначення Найменування Примітка 
   
   
 Документація  
   
   
482.ЧДТУ. 52220-01         12 01 Текст програми  
482.ЧДТУ. 52220-01         34 01 Інструкція користувача  
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
 6
ДОДАТОК Б 4 
 
 
«Затверджую»               
Завідувач кафедри ІТП 
_________ проф. Тетяна  Прокопенко 
                                                                    «____»______________2025 р. 
 
 
 
ІНТЕРНЕТ ПЛАТФОРМА З ПРОДАЖУ ЕНЕРГОНЕЗАЛЕЖНИХ РОЗУМНИХ 
ПРИСТРОЇВ 
 
 
 
Текст програми 
482.ЧДТУ. 52220-01 12 01 
 
Листів 6 
 
 
Розробник    _____________                   Ясюк Д. 
 
 
 
 
 
 
 
Черкаси – 2025 
 6
Фрагмент коду для входу, реєстрації та скидання пароля на веб-сторінці: 5 
 
div class="xoo-el-form-container xoo-el-form-inline" data-active="login"> 
  <div class="xoo-el-header"> 
    <ul class="xoo-el-tabs"> 
      <li data-tab="login" class="xoo-el-login-tgr xoo-el-active">Увійти</li> 
      <li data-tab="register" class="xoo-el-reg-tgr">Зареєструватися</li> 
    </ul> 
  </div> 
 
  <!-- Login Section --> 
  <div data-section="login" class="xoo-el-section xoo-el-active"> 
    <div class="xoo-el-fields"> 
      <form class="xoo-el-action-form xoo-el-form-login"> 
        <div class="xoo-aff-group xoo-el-username_cont"> 
          <div class="xoo-aff-input-group"> 
            <span class="xoo-aff-input-icon fas fa-user"></span> 
            <input type="text" name="xoo-el-username" placeholder="Ім'я користувача або Email" 
required> 
          </div> 
        </div> 
 
        <div class="xoo-aff-group xoo-el-password_cont"> 
          <div class="xoo-aff-input-group"> 
            <span class="xoo-aff-input-icon fas fa-lock"></span> 
            <input type="password" name="xoo-el-password" placeholder="Пароль" autocomplete="new-
password" required> 
            <div class="xoo-aff-pw-toggle"> 
              <span class="xoo-aff-pwtog-show"><i class="far fa-eye"></i></span> 
              <span class="xoo-aff-pwtog-hide"><i class="far fa-eye-slash"></i></span> 
            </div> 
          </div> 
        </div> 
 
        <div class="xoo-aff-group xoo-el-login-btm-fields"> 
          <label><input type="checkbox" name="xoo-el-rememberme" value="forever"> Запам'ятати 
мене</label> 
          <a class="xoo-el-lostpw-tgr" href="#">Забули пароль?</a> 
        </div> 
 
        <input type="hidden" name="_xoo_el_form" value="login"> 
        <input type="hidden" name="xoo_el_redirect" value="/my-account/"> 
        <button type="submit" class="xoo-el-login-btn">Увійти</button> 
      </form> 
    </div> 
  </div> 
 
  <!-- Register Section --> 
  <div data-section="register" class="xoo-el-section"> 
    <div class="xoo-el-fields"> 
      <form class="xoo-el-action-form xoo-el-form-register"> 
 6
        <div class="xoo-aff-group"> 6 
          <div class="xoo-aff-input-group"> 
            <span class="xoo-aff-input-icon fas fa-user"></span> 
            <input type="text" name="xoo_el_reg_username" placeholder="Ім'я користувача" 
minlength="3" maxlength="20" required> 
          </div> 
        </div> 
 
        <div class="xoo-aff-group"> 
          <div class="xoo-aff-input-group"> 
            <span class="xoo-aff-input-icon fas fa-at"></span> 
            <input type="email" name="xoo_el_reg_email" placeholder="E-mail" autocomplete="email" 
required> 
          </div> 
        </div> 
 
        <div class="xoo-aff-group"> 
          <div class="xoo-aff-input-group"> 
            <span class="xoo-aff-input-icon fas fa-key"></span> 
            <input type="password" name="xoo_el_reg_pass" placeholder="Пароль" minlength="6" 
maxlength="20" autocomplete="new-password" required> 
            <div class="xoo-aff-pw-toggle"> 
              <span class="xoo-aff-pwtog-show"><i class="far fa-eye"></i></span> 
              <span class="xoo-aff-pwtog-hide"><i class="far fa-eye-slash"></i></span> 
            </div> 
          </div> 
        </div> 
 
        <div class="xoo-aff-group"> 
          <div class="xoo-aff-input-group"> 
            <span class="xoo-aff-input-icon fas fa-key"></span> 
            <input type="password" name="xoo_el_reg_pass_again" placeholder="Підтвердьте пароль" 
autocomplete="new-password" required> 
          </div> 
        </div> 
 
        <div class="xoo-aff-group"> 
          <label> 
            <input type="checkbox" name="xoo_el_reg_terms" value="yes" required> 
            Я приймаю <a href="/угода-користувача/" target="_blank">умови користувальницької 
угоди</a> 
          </label> 
        </div> 
 
        <input type="hidden" name="_xoo_el_form" value="register"> 
        <input type="hidden" name="xoo_el_redirect" value="/my-account/"> 
        <button type="submit" class="xoo-el-register-btn">Зареєструватися</button> 
      </form> 
    </div> 
  </div> 
 
  <!-- Lost Password Section --> 
 6
  <div data-section="lostpw" class="xoo-el-section"> 7 
    <div class="xoo-el-fields"> 
      <form class="xoo-el-action-form xoo-el-form-lostpw"> 
        <span>Забули пароль? Введіть свій логін або email, щоб отримати посилання для скидання 
паролю.</span> 
        <div class="xoo-aff-group"> 
          <div class="xoo-aff-input-group"> 
            <span class="xoo-aff-input-icon fas fa-user"></span> 
            <input type="text" name="user_login" placeholder="Ім'я користувача або Email" required> 
          </div> 
        </div> 
 
        <input type="hidden" name="_xoo_el_form" value="lostPassword"> 
        <input type="hidden" name="_wp_http_referer" value="/my-account/"> 
        <button type="submit" class="xoo-el-lostpw-btn">Надіслати посилання</button> 
      </form> 
    </div> 
  </div> 
</div> 
 
 
 
  
 6
ДОДАТОК В 8 
 
 
 
 
 
 
 
 
ІНТЕРНЕТ ПЛАТФОРМА З ПРОДАЖУ ЕНЕРГОНЕЗАЛЕЖНИХ РОЗУМНИХ 
ПРИСТРОЇВ 
 
 
ІНСТРУКЦІЯ КОРИСТУВАЧА 
482.ЧДТУ. 52220-01 34 01 
Листів 4 
 
 
 
 
 
Розробник    _____________                   Ясюк Д. 
 
 
 
 
 
 
 
Черкаси – 2025 
 6
Додаток розроблено з урахуванням двох основних ролей користувачів: 9 
 Покупець — користувач, який використовує додаток для придбання товарів або 
послуг. 
 Адміністратор — користувач із розширеними правами доступу, який здійснює 
керування та контроль функціонування додатку. 
Основні можливості інтернет-магазину: 
1. Реєстрація та авторизація користувачів 
Користувач має можливість створити обліковий запис і здійснити вхід на сайт, 
що дозволяє переглядати історію своїх замовлень і відстежувати їхній статус 
(див. рис. В.1). 
 
Рисунок В.1  –  вигляд сторінки «Особистий кабінет» 
Пошук та перегляд товарів 
Користувач має можливість знайти необхідні товари за допомогою пошуку за 
категоріями або ключовими словами, а також застосовувати фільтри за ціною та 
іншими критеріями. Після цього він може перейти на сторінку обраного товару та 
переглянути його детальний опис (див. рис. В.2).
 7
0 
 
Рисунок В.2  –  результат фільтрації товарів 
1. Додавання товарів до кошика 
Користувач може вибрати товар та додати його до кошика для подальшого 
перегляду та визначення кількості (рис. В.3). 
 
Рисунок В.3  –  вигляд сторінки товару 
2. Оформлення замовлення 
Користувач може обрати метод доставки та спосіб оплати, ввести необхідні дані 
для оформлення замовлення та отримати підтвердження на електронну пошту (рис. 
В.4). 
 7
1 
 
Рисунок В.4  –  вигляд сторінки «Оформлення замовлення» 
3. Зв'язок з підтримкою 
Користувач може звернутися до служби підтримки, через контактні форми на 
сайті, або за вказаними телефонами та електронною поштою (рис. В.5). 
 
Рисунок В.5  –  вигляд контактної форми
ChSTU repository

ChSTU repository preserves and enables easy and open access to all types of digital content including text, images, moving images, mpegs and data sets
