IT-инфраструктура для бизнеса и творчества
Разработка
Dmitry Kotenko

Проектирование как способ не слить бюджет на разработку приложения

Разработка — важно, дизайн — решает, проектирование — а это что? Так реагируют 7 из 10 заказчиков InfoShell, когда мы рассказываем, из чего состоит бюджет проекта. Человеческими словами объясняем, почему проектирование — основа любого проекта.

Когда мы рассказываем заказчику процесс создания продукта, у него обычно не возникает вопросов, зачем нужна разработка или хороший дизайн. Но когда говорим о проектировании, в глазах читается: «А можно без этого?». Немой вопрос заказчика можно понять, ведь результатом разработки и дизайна является конечный продукт, а результатом проектирования – прототипы, которые будут дорабатываться по ходу разработки. «Так почему нельзя сразу начать разработку, без «лишнего» промедления?», – думает заказчик.

Объясняем на примере, как проектирование уменьшит временные затраты на других этапах. Представьте, что в одном из концов Санкт-Петербурга вам назначена встреча. Вы можете:

а) используя навыки ориентирования и интуицию, сменить несколько автобусов, поблуждать по переходу Садовая/Cпасская/Сенная, пару раз поинтересоваться у прохожих, как добраться от метро до желанного места назначения и, наше любимое, минут 15 поискать вход. Конечно, в итоге в точке Б вы окажетесь. Возможно, даже в нужный день.

б) используя навигаторы, карты и друзей-местных проложить точный маршрут, приехать заранее и выпить чашечку кофе перед встречей. Мысль, надеюсь, понятна.

Попробуйте прикинуть риски, денежные и временные издержки на поиск дороги. Такая логика действует и в разработке.

Итак, тезис:

Разработка с использованием проектирования — это способ создания продукта, при котором есть объективные возможности гарантировать сроки и стоимость.

Приступим к доказательству.

Как оценивают сроки и стоимость?

Проектирование выполняет несколько задач.

1. Аналитическая часть

Определяем первостепенные и второстепенные цели продукта, рисуем портрет целевой аудитории, анализируем конкурентов. В результате получаем начальное видение продукта, на основе которого переходим к следующему этапу.

Результат: концепт продукта.

2. Функциональное проектирование

Определяем «функциональную начинку» приложения: рассматриваем все возможные технологии и думаем, как они повлияют на конечный продукт, проектируем модель взаимодействия пользователей с системой. Здесь фантазия не ограничена ничем — собираем на бумаге продукт мечты, чтобы лучше всего реализовать цели продукта и удовлетворить целевую аудиторию (об этом говорили на предыдущем этапе, помните?)

Результат: предварительный функционал приложения, основанный на аналитике; сценарии взаимодействия пользователя с системой.

3. Интерфейсное проектирование

Этот этап про нахождение формы, в которую можно облечь результат двух предыдущих: как мы представим функции в интерфейсе системы? Продумываем способ, с помощью которого весь оговоренный функционал будет максимально понятным.

Результат: предварительная структура экранов.

4. Техническое проектирование

Самый сложный для понимания, но решающий для разработки этап.

Проводим поиск способов реализации системы, с учетом предыдущих этапов. Здесь мы отвечаем на вопросы: могут ли существовать эти функции на данной платформе? как будет происходить взаимодействие между частями системы? с помощью каких технологий будет реализован функционал?

Результат: основные нефункциональные и функциональные требования, сформированный бэклог.

В нем пишем, как система функционирует с точки зрения пользователя. Подробней о бэклоге читайте здесь.

По окончании процесса, мы собираем результаты проектирования в кучу и получаем денежную оценку и сроки разработки.

Допустим, решили обойтись без проектирования

Ведь все вышеописанное должно выясниться во время разработки, правда? Правда. Вспомните пример в начале статьи. Проектирование в любом случае происходит, но менее качественно, дольше, путем проб и ошибок, которые и предотвращает этап проектирования. А значит, экономит время и деньги.

Почему результат проектирования — не просто перечень требуемого функционала? Потому что чтобы реализовать даже самый простой функционал, необходимо продумать большую систему, которая будет его поддерживать.

Есть много вариантов реализации технологии. Некоторые из них могут быть дешевле в использовании, но менее производительны, в то время как другим может потребоваться больше времени для внедрения. Нужно определить технологический стек — обойти устаревающие или ненадежные технологии. Ошибки могут привести к тому, что спустя время придется переделывать приложение и платить больше за дополнительную работу.

Заключение

Проектирование – то, что спасает от денежных и временных потерь. Это не прихоть разработчиков, а нужный этап разработки любого продукта. Если, конечно, у вас нет правильно написанного и утвержденного технического задания.

{ "author_name": "Dmitry Kotenko", "author_type": "self", "tags": [], "comments": 2, "likes": 0, "favorites": 14, "is_advertisement": false, "subsite_label": "dev", "id": 67342, "is_wide": true, "is_ugc": true, "date": "Thu, 23 May 2019 13:35:31 +0300", "is_special": false }
(function () { let cdnUrl = `https://specialsf378ef5-a.akamaihd.net/SelectelBranding/images/` let previousArticleNumber = null let currentArticleNumber = 0 let platform = 'Desktop' let articles = [ { name: 'camera', url: `${cdnUrl}CameraCat`, text: 'умную камеру для\u00A0наблюдения за\u00A0котиками', link: 'https://vc.ru/selectel/306690', num: 3 }, { name: 'chill', url: `${cdnUrl}ChillCat`, text: 'трекер, который подскажет, когда пора отдохнуть', link: 'https://vc.ru/promo/288561-eye-tracker', num: 1 }, { name: 'cloud', url: `${cdnUrl}CloudCat`, text: 'котика: даёшь ему «пять», а\u00A0он делает бэкап в облако', link: 'https://vc.ru/dev/294799-maneki-neko', num: 2 } ] let buttonCycle = document.querySelector('.button--cycle') let buttonChoose = document.querySelector('.button--choose') let buttonMobile = document.querySelector('.button--mobile') let textField = document.querySelector('.selectel-footer-subtitle') let imageAgent = document.querySelector('.image--agent') let banner = document.querySelector('.selectel-footer') buttonCycle.addEventListener('click', cycleClick) buttonChoose.addEventListener('click', () => sendEvent(`Promo ${articles[currentArticleNumber].num} Left`, 'Click')) buttonMobile.addEventListener('click', () => sendEvent(`Promo ${articles[currentArticleNumber].num} Left`, 'Click')) let media = window.matchMedia("(max-width: 570px)") media.addEventListener('change', matchMedia) function matchMedia() { if (media.matches) { platform = 'Mobile' } else { platform = 'Desktop' } update() } matchMedia() function cycleClick(event) { sendEvent(`Promo ${articles[currentArticleNumber].num} Right`, 'Click') if (event) { event.preventDefault() event.stopPropagation() } window.open('https://vc.ru/tag/selectelDIY', '_blank') //cycle(event) } function cycle(event) { // incrementArticleNumber() textField.innerHTML = generatedText() imageAgent.src = articles[currentArticleNumber].url + platform + '.svg?3' imageAgent.setAttribute("class", "") imageAgent.classList.add('image--agent', articles[currentArticleNumber].name) banner.href = articles[currentArticleNumber].link } function update() { banner.href = articles[currentArticleNumber].link imageAgent.src = articles[currentArticleNumber].url + platform + '.svg' textField.innerHTML = generatedText() } function incrementArticleNumber() { previousArticleNumber = currentArticleNumber if (currentArticleNumber >= articles.length - 1) { currentArticleNumber = 0 } else { currentArticleNumber++ } } const sendEvent = (label, action = 'Click') => { const value = `SelectelDIY — loc: Footer — ${label} — ${action}`; if (window.dataLayer !== undefined) { window.dataLayer.push({ event: 'data_event', data_description: value, }); } }; function generatedText() { let defaultText if (platform === 'Desktop') { defaultText = `Мы тут собрали %text%. Хотите научим?` } else { defaultText = `Мы тут собрали %text%.` } return defaultText.replace('%text%', articles[currentArticleNumber].text) } function getRandom(min, max) { min = Math.ceil(min) max = Math.floor(max) return Math.floor(Math.random() * (max - min + 1)) + min } (function create() { currentArticleNumber = getRandom(0, articles.length - 1) cycle() let page = document.querySelector('.page--entry') if (page) { function insertAfter() { let parents = page.querySelectorAll('[data-id="7"]') let referenceNode = parents[0] referenceNode.parentNode.insertBefore(banner, referenceNode.nextSibling); loaded() } setTimeout(() => insertAfter(), 0) } }()) function loaded() { banner.classList.add('loaded') } loadImages([ `${cdnUrl}CameraCatDesktop.svg`, `${cdnUrl}ChillCatDesktop.svg`, `${cdnUrl}CloudCatDesktop.svg`, `${cdnUrl}CameraCatMobile.svg`, `${cdnUrl}ChillCatMobile.svg`, `${cdnUrl}CloudCatMobile.svg?3`, ]) function loadImages(urls) { return Promise.all(urls.map(function (url) { return new Promise(function (resolve) { var img = document.createElement('img'); img.onload = resolve; img.onerror = resolve; img.src = url; }); })); } }())
0
2 комментария
Популярные
По порядку

Никто:
InfoShell: Люди не понимают, что проектирование важно

0

Речь о заказчиках. Читайте внимательнее)

0
Читать все 2 комментария
Почему индексные фонды стали популярными. Рассказывает персональный брокер
Онлайн-кинотеатр IVI объявил дату премьеры сериала «Везёт» с Евгением Цыгановым​
Adobe представила веб-версии Photoshop и Illustrator с ограниченными возможностями для совместной работы Статьи редакции

Пользователи смогут вместе работать над проектом, не открывая и не скачивая десктопные приложения. Подписка Creative Cloud для просмотра не нужна.

Построй свой план по достижению карьеры мечты

Edwica – онлайн сервис автоматического построения карьерной траектории на основе данных об образовании, профессиональном опыте и требованиях работодателей.

На OZON.ru для оплаты предлагаются чужие банковские карты

Сегодня вечером я разместил заказ на OZON.ru, перешел к оплате и обнаружил сохраненную карту, чему я несколько удивился, т.к. обычно их нигде не сохраняю. Тем не менее, я ввёл CVV код и перешел к подтверждению платежа. Но push и смс от банка упорно не приходили. Я вернулся на шаг назад и понял, что OZON предлагает оплатить мой заказ неизвестной…

Как программист-интроверт стал СЕО стартапа, сделал MVP за один месяц и заработал 12 млн за год – история Revvy

SaaS-сервис Revvy, который помогает бизнесу общаться с клиентами и умеет «перехватывать» негатив.

Пример позитивного отзыва и “перехвата” негатива
Как имиджевый проект о безопасном вождении привлёк лиды и расширил маркетинговую воронку страховой компании

А игра с виртуальной фарфоровой статуэткой помогла 6,5 тысячам водителей не превышать скорость.

«2ГИС» представил обновлённый навигатор с мини-картой на экране, данными о камерах и парковках Статьи редакции

Его уже подключил «Ситимобил».

Обновлённый интерфейс навигатора  «2ГИС»
Что означает выражение «цена на нефть»

Что есть «мировые цены на нефть», о которых говорится в СМИ, где они формируются и почему нефтяные бенчмарки зачастую не являются в строгом смысле ценами на нефть.

null