Розробка веб-сервісу для обробки фотографій на основі TouchRetouch

 

Підсумкова курсова  робота

на тему:

„Розробка веб-сервісу  для обробки фотографій на основі TouchRetouch ”

Зміст

1. ПОСТАНОВКА ЗАВДАННЯ………………………………………………… 3
2. ОПИС ПРОВЕДЕНИХ РОБІТ………………………………………………... 3
1. Проектування сайту. Розробка технічного завдання…………………....3
1. Концептуальне проектування……………………………………....  4
2. Логічне проектування……………………………………………….. 6
3. Фізичне проектування………………………………………………..7
4. Написання технічного завдання……………………………………. 8
2. Управління процесом розробки………………………………………….. 8
1. Управління процесом розробки за допомогою DotProject……….. 8
2. Створення діаграми Ганта………………………………………….. 10
3. Тестування………………………………………………………………… 11
1. Написання тест-плану……………………………………………..... 12
3. ПРАКТИЧНІ РЕЗУЛЬТАТИ…………………………………………………. 14
4. ВИСНОВКИ…………………………………………………………………… 15

СПИСОК ЛІТЕРАТУРИ ………………………………………………………… 16

ДОДАТКИ………………………………………………………………………… 17

Додаток 1 Діаграма варіантів  використання………………………………  17

Додаток 2 Загальний шаблон сторінок…………………………………….  18

Додаток 3 Структура сайту………………………………………………....  19

Додаток 4 Клієнт-серверна архітектура……………………………………  20

Додаток 5 Структура бази даних…………………………………………...  22

Додаток 6 Діаграма Ганта…………………………………………………… 23

 

 

 

 

 

 

1. ПОСТАНОВКА ЗАВДАННЯ

Розробити веб-сервіс для  обробки фотографій (видалення небажаних  об’єктів з фотографії) аналогічно до існуючої програми TouchRetouch. Крім обробки фотографій, повинна бути реалізована база даних для зберігання інформації та необхідні серверні компоненти. На веб-сайті повинна бути реалізована наступна функціональність:

1. Компоненти реєстрації, авторизації, зміни особистих даних.
2. Конкурс фотографій для зареєстрованих користувачів.
3. Перегляд конкурсних фотографій для всіх користувачів сайту.
4. Голосування за фотографію.
5. Перевірка конкурсних фотографій адміністратором та можливість блокування.
6. Перегляд адміністратором списку користувачів та можливість блокування і видалення користувачів.
7. Особиста сторінка з фотографіями для зареєстрованих користувачів та можливість видалення фотографій.

2. ОПИС ПРОВЕДЕНИХ РОБІТ

2.1. Проектування сайту. Розробка технічного завдання

Для розробки проекту TouchRetouchOnline було обрано спіральну модель розробки програмного забезпечення. Суть моделі, як це видно з назви полягає в русі по спіралі. Робота починається з першого етапу – «Планування і аналіз» - і послідовно проходить всі інші – розробку архітектури, кодування та створення дизайну, тестування. Паралельно з розробкою сайту акумулюються ідеї щодо покращення сайту, внесення додаткових можливостей. Після завершення останнього етапу робота знову повертається до першого. Таким чином, цикл повторюється кілька разів. Головна перевага спіральгої моделі проектування сайтів – можливість створення складних проектів з поступовою їх зміною та поліпшенням.

Проектування сайту розбивається на наступні стадії:

1. Концептуальне проектування.
2. Логічне проектування.
3. Фізичне проектування.

Етапи слідують послідовно один за одним , але в деяких випадках можливий перехід до наступної стадії без закінчення попередньої. Це може відбуватися, наприклад, коли розробників декілька і кожен працює зі своєю частиною сайту. У будь-якому випадку, після закінчення етапу фізичного проектування слід повернутися до початку і внести відповідні корективи.

 

1. Концептуальне проектування

Концептуальне проектування – це створення концептуальної моделі взаємодії користувачів з продуктом  через його інтерфейс. Модель включає  в себе опис концепції взаємодії  користувачів з продуктом і чорновий макет основних екранів інтерфейсу (їх схематичне зображення, що показує  всі можливості користувача виконати певні дії і отримати певну  інформацію).

Концептуальне проектування сайту включає визначення цільової аудиторії, аналіз, збір та документування вимог користувачів. При проектуванні і розробці важливо, щоб сайт бува орієнтований на конкретних користувачів і відповідав їхнім вимогам.

Концептуальне проектування складається з таких етапів:

1. Постановка мети, яку переслідує сайт.
2. Визначення цільової аудиторії.
3. Опис прецедентів.
4. Опис структури інтерфейсу. Створення чорнового макета, що містить опис основних частин продукту і основних екранів інтерфейсу.

Постановка мети

Метою створення сайту  є наочне представлення функціональності та можливостей прикладної програмної системи TouchRetouch. Сайт повинен вирішити такі завдання:

1. Повністю скопіювати функціональність розробленої існуючої прикладної програми TouchRetouch.
2. Розширити коло потенційних покупців TouchRetouch.
3. Наочно відобразити можливості TouchRetouch за рахунок організації конкурсу оброблених фотографій.
4. Створити базу даних для збереження необхідної інформації.
5. Розробити систему управління користувачами для повноцінного користування сайту.
6. Створити сервер для обробки фотографій.

Профілі користувачів

А) опис цільової аудиторії

Цільова аудиторія розроблюваного проекту належить до б2с – сектору (бізнес для користувачів), тобто  стосується сфери індивідуального  споживача. Така цільова аудиторія  є динамічною і може змінюватись  залежно від різноманітних обставин, наприклад, появи на ринку нових  пропозицій.

Веб-сайт призначений насамперед для молоді – людей віком 16-30 років. Серед них:

1. Користувачі IPhone. Програма TouchRetouch розроблена під IPhone і веб-сайт демонструє роботу TouchRetouch онлайн, дозволяючи оцінити її переваги.
2. Люди, які цікавляться фотографіями та їх обробкою.

Оскільки онлайн-версія TouchRetouch зрозуміла і проста у використанні, вона підійде навіть тим людям, які не мають навичок обробки фотографій.

Б) визначення класів користувачів та їх характеристик

Класи користувачів веб-сервісу представлені на рис.2.

 

гість

 

 

 

Зареєстрований користувач                 Адміністратор

Рис.2. Класи користувачів

Функції веб-сервісу, призначені для користувачів кожного з класів, наведено в табл.1.

 

 

 

 

 

 

 

 

 

 

Табл.1. Класи користувачів та доступні для них функції

Клас користувачів	Функції
1.Гість (Зареєстрований  користувач включно)	Завантаження та редагування  фотографій, перегляд фотографій конкурсу та окремих користувачів, перегляд новин сайту.
2.Зареєстрований користувач	Перегляд особистої сторінки з фотографіями, видалення власних  фотографій; участь в конкурсі, голосування.
3.Адміністратор	Заборона фотографій, блокування або розблокування користувачів, перегляд списку зареєстрованих користувачів, видалення користувача

Опис прецедентів

Опис прецедентів включає  діаграму варіантів використання і  сценарії використання, які повинні  повністю описувати функціонал розроблюваної  системи.

Діаграма використання варіантів наведена в додатку 1.

Сценарій використання є  детальним покроковим описом дій  користувачів і відповідних реакцій  системи для виконання конкретної функції. Сценарії використання є зручним  засобом опису функціональності системи, оскільки дозволяють максимально  деталізувати функціональні вимоги навантаження надлишковою інформацією.

Функціональні вимоги до розроблюваного проекту у вигляді сценаріїв  використання описані в технічному завданні.

Розробка базової  структури інтерфейсу

Цей етап проектування передбачає опис розташування основних елементів  на сторінках сайту, спільних для  всіх сторінок.

Типовий шаблон сторінки сайту  містить такі основні елементи:

1. Компонент для авторизації з посиланнями на сторінку реєстрації та сторінку нагадування паролю. Якщо користувач авторизований, цей компонент заміняється на компонент з привітанням та посиланням на сторінку редагування особистих даних.
2. Меню сайту. Меню змінюється залежно від поточної сторінки та статусу користувача.
3. Новини сайту. Тут відображаються посилання на статті з новинами.
4. Внизу сторінки – контактна інформація.

Загальний шаблон сторінок сайту наведений в додатку  2.

2.1.2. Логічне проектування

Логічне проектування включає  організацію інформації на сайті, побудову його структури і навігації по розділах.

На даному етапі слід вирішити, яким чином буде впорядкована інформація. На цьому етапі потрібно описати  наступне:

1. Тип структури сайту (лінійна, ієрархічна, контекстна, інша).
2. Назви розділів.
3. Що буде містити в собі кожен розділ.
4. Організація та зв'язок між собою.
5. Яка інформація буде розміщена на певних сторінках сайту.

Кінцевий результат логічного  проектування оформляється у вигляді  блок-схем, структурних діаграм або  іншими способами, що показують взаємозв’язок  різних частин сайту.

Структура сайту

Під час проектування даного сайту було обрано змішаний тип структури  сайту (мережева навігація). Вона включає  в себе елементи всіх трьох типів. Схематичне зображення структури сайту  наведено в додатку 3.

Назви розділів

Було вирішено зробити  такі сторінки сайту:

1. Сторінка опрацювання фотографій.
2. Сторінка конкурсу.
3. Сторінка перегляду фотографій користувача.
4. Сторінка перегляду однієї фотографії.
5. Сторінка реєстрації.
6. Сторінка зміни особистих даних.
7. Сторінка перегляду неперевірених фотографій для адміністратора.
8. Сторінка перегляду списку користувачів для адміністратора.
9. Сторінка перегляду усіх фотографій для адміністратора.
10. Сторінка перегляду фотографій користувача для адміністратора.
11. Сторінка перегляду особистих фотографій.

Вміст кожного з розділів та організація зв’язку між сторінками описані в технічному завданні.

2.1.3.Фізичне проектування

На цьому етапі описують наступне:

1. Клієнт-серверна  архітектура.
2. Технології, що будуть застосовуватись на сайті.
3. Використовуване програмне забезпечення.
4. Структура бази даних.

Після завершення даного етапу  слід повернутися до концептуального  проектування і перевірити, чи не потрібно внести зміни, у зв’язку з переосмисленням  проекту на інших стадіях.

На етапі фізичного  проектування було розроблене наступне:

1. Створено модель клієнт-серверної архітектури. (Додаток Д).
2. Розроблено список мов програмування, необхідних для написання сайту.
3. Створено список необхідного програмного забезпечення.
4. Розроблено структури бази даних. (наведена в додатку 4).

2.1.4.Написання  технічного завдання

Технічне завдання – це документ, який містить опис функціональних та не функціональних вимог до розроблюваної  системи, опис інтерфейсів системи, її структури та іншу інформацію, необхідну  розробникам системи.

Технічне завдання до веб-сервісу  TouchRetouchOnline було розроблене за допомогою інструментів програми Microsoft Office Visio Professional.

Розроблене технічне завдання містить такі пункти:

1. Вступ (містить опис цілей сайту, цільової аудиторії тощо).
2. Загальний опис системи.
3. Інформаційна архітектура та інтерфейс.
4. Функціональні вимоги.
5. Не функціональні вимоги.

2.2.Управління  процесом розробки

2.2.1.Управління  процесом розробки за допомогою  системи DotProject

Управління процесом розробки проекту включає:

• Формування списку задач для розробників
• Контроль за виконанням задач
• Створення допоміжних файлів по проекту (шаблонів сторінок, опису змін у вимогах)

Для управління процесом розробки було обрано систему управління проектами  DotProject.

DotProject – це інфраструктура управління проектами через Web, в яку входять модулі для управління компаніями, проектами і завданнями (з діаграми Ганта).  Підтримуються форуми, обмін файлами, календарі, контакти, заявки до служби helpdesk. Система багатомовна (17 мов), є система дозволів для користувачів і модулів, зовнішній вигляд налаштовується. Архітектура системи дозволяє легко підключати додаткові модулі (наприклад, модуль обліку часу або інвентаризації).