Мен екі жылдай фронт-әзірлеуші болып жұмыс істеп келемін және көптеген жобаларды жасауға қатыстым. Мен үйренген сабақтардың бірі - мақсаты бір, бірақ міндеттері мен жауапкершілігі әртүрлі әзірлеушілер тобы арасындағы ынтымақтастық оңай емес.
Басқа топ мүшелерімен, дизайнерлермен және әзірлеушілермен кеңесе отырып, мен шағын топтарға (5-15 адам) арналған веб-сайт жасау циклін жасадым. Оған Confluence, Jira, Airtable және Abstract сияқты құралдар кіреді. Бұл мақалада мен жұмыс процесін ұйымдастыру ерекшеліктерімен бөлісемін.
Skillbox ұсынады: Екі жылдық практикалық курс .
Біз еске саламыз: «Хабрдың» барлық оқырмандары үшін - «Habr» жарнамалық кодын пайдаланып кез келген Skillbox курсына жазылу кезінде 10 000 рубль көлемінде жеңілдік.
Мұның бәрі не үшін қажет?
Веб-сайтты нөлден жасау үшін қажетті ең аз команда - дизайнер, бағдарламашы және жоба менеджері. Менің жағдайымда команда құрылды. Бірақ бір-екі сайт шыққаннан кейін менде бірдеңе дұрыс емес сияқты болды. Кейде біз өз міндеттерімізді толық түсінбедік, ал клиентпен қарым-қатынас көп нәрсені қалаусыз қалдырды. Мұның бәрі процесті бәсеңдетіп, барлығын алаңдатты.
Мен мәселені шешуге кірістім.
Google іздеу біздің мәселе бойынша жақсы нәтиже береді.
Орындалған жұмысты көрнекі ету үшін мен мұнда жұмыстың қалай орындалатыны туралы түсінік беретін жұмыс процесі диаграммасын жасадым.
Толық ажыратымдылықта ашу үшін суретті басыңыз.
Мақсаттары мен міндеттері
Мен тестілеуді шешкен алғашқы әдістердің бірі «каскадтық модель» (Сарқырама) болды. Мен оны проблемаларды көрсету және оларды шешу жолын түсіну үшін қолдандым.
Мәселе: Көбінесе клиент веб-сайтты жасау процесін әзірлеушілер сияқты модульдік түрде бағаламайды. Оны кәдімгі сайт ретінде қабылдайды, яғни жеке парақшалар арқылы ойлайды. Оның пікірінше, дизайнерлер мен бағдарламашылар бірінен соң бірі жеке беттерді жасайды. Нәтижесінде, тұтынушы нақты процесс кезінде неден кейін не болатынын түсінбейді.
Тапсырма: Клиентті басқаша сендірудің қажеті жоқ, ең жақсы нұсқа - беттік үлгі негізінде компания ішінде веб-сайтты құрудың модульдік процесін әзірлеу.
Әмбебап дизайн белгілері мен құрамдастарын әзірлеушілер де, дизайнерлер де басқарады.
Мәселе: Бұл көптеген стратегиялар қарастыратын жалпы жағдай. Көптеген қызықты шешімдер бар, көп жағдайда стильдік нұсқаулық / кітапхана генераторлары басқаратын дизайн жүйесін құру ұсынылады. Бірақ біздің жағдайда дизайнерлерге қол жеткізу деңгейлерін басқаруға мүмкіндік беретін әзірлеу процесіне басқа құрамдас бөлікті қосу мүмкін болмады.
Тапсырма: дизайнерлер, әзірлеушілер және менеджерлер бір-біріне кедергі жасамай синхронды түрде жұмыс істей алатын әмбебап жүйені құру.
Дәл дамуды қадағалау
Мәселе: Мәселелерді бақылауға және жалпы прогресті өлшеуге арналған көптеген пайдалы құралдар бар болғанымен, олардың көпшілігі икемді немесе оңтайлы емес. Құрал әдетте нақты тапсырмалар бойынша сұрақтар мен түсініктемелерге жұмсалатын топ уақытын үнемдеу арқылы пайдалы болуы мүмкін. Бұл сонымен қатар менеджерлерге бүкіл жоба туралы дәлірек түсінік беру арқылы олардың өмірін жеңілдетеді.
Тапсырма: әртүрлі топ мүшелері орындаған тапсырмалардың орындалу барысын бақылау үшін бақылау тақтасын жасаңыз.
Құрал жиынтығы
Әртүрлі құралдармен тәжірибе жасағаннан кейін мен келесі жинаққа тоқтадым: Confluence, Jira, Airtable және Abstract. Төменде мен әрқайсысының пайдасын ашамын.
Конфликтілік
Құралдың рөлі: ақпараттық-ресурстық орталық.
Confluence жұмыс кеңістігін орнату салыстырмалы түрде оңай, көптеген мүмкіндіктер, әртүрлі қолданбалармен біріктіру және жеке, теңшелетін үлгілері бар. Бұл бір өлшемді шешім емес, бірақ ақпараттық-ресурстық орталық ретінде өте қолайлы. Бұл жобаға қатысты кез келген анықтама немесе техникалық мәліметтер дерекқорға енгізілуі керек дегенді білдіреді.
Құрал әрбір құрамдас бөлікті және жоба туралы кез келген басқа мәліметтерді дұрыс құжаттауға мүмкіндік береді.
Confluence бағдарламасының басты артықшылығы - құжат үлгілерін теңшеу. Сонымен қатар, оны қатысушылардың қол жеткізу деңгейлерін бөлетін спецификациялардың бірыңғай репозиторийін және әртүрлі жобалық құжаттаманы жүзеге асыру үшін пайдалануға болады. Құжаттарды электрондық пошта арқылы жіберген кездегідей, енді сізде техникалық сипаттаманың ескі нұсқасы бар деп алаңдамайсыз.
Құрал туралы қосымша ақпарат .
Джира
Құралдың рөлі: мәселені бақылау және тапсырмаларды басқару.
Jira - жобаны жоспарлау мен басқарудың өте қуатты құралы. Функционалдықтың негізгі бөлігі теңшелетін жұмыс процестерін жасау болып табылады. Мәселелерді тиімді басқару үшін (бұл бізге қажет), сұрау түрі мен мәселе түрін (мәселе түрі) дұрыс пайдалануға ерекше назар аударған жөн.
Осылайша, әзірлеушілер дұрыс дизайнға негізделген құрамдас бөліктерді жасап жатқанына көз жеткізу үшін дизайндағы бірдеңе өзгерген сайын оларға хабарлау қажет. Компонент жаңартылған бойда дизайнер мәселені ашуы керек, жауапты әзірлеушіге тағайындап, оған дұрыс мәселе түрін тағайындайды.
Jira көмегімен процестің барлық қатысушылары (еске сала кетейін, біздің жағдайда олардың саны 5–15) дұрыс тапсырмаларды алатынына және олардың орындаушысын табатынына сенімді бола аласыз.
Jira туралы көбірек біліңіз .
Әуе кассасы
Құралдың рөлі: компоненттерді басқару және прогресс тақтасы.
Airtable - электрондық кестелер мен деректер қорының қоспасы. Мұның бәрі жоғарыда талқыланған барлық құралдардың жұмысын реттеуге мүмкіндік береді.
1-мысал: Құрамдастарды басқару
Стиль нұсқаулығы генераторына келетін болсақ, оны пайдалану әрқашан ыңғайлы емес - мәселе дизайнерлер оны өңдей алмайды. Бұған қоса, Sketch компоненттерінің кітапханасын пайдалану жақсы шешім болмас еді, өйткені оның көптеген шектеулері бар. Сірә, сіз бұл кітапхананы бағдарламадан тыс пайдалана алмайсыз.
Airtable де мінсіз емес, бірақ ол көптеген басқа ұқсас шешімдерге қарағанда жақсы. Мұнда Құрамдастарды басқару кестесі үлгісінің демонстрациясы берілген:
Әзірлеуші дизайн құрамдас бөлігін қабылдағанда, құрамдас бөлікті кестеге жазу арқылы алынған ABEM мәнін бағалайды. Барлығы 9 баған бар:
- Аты - ABEM принципі бойынша компоненттің атауы.
- Алдын ала қарау - мұнда скриншот немесе басқа көзден жүктелген құрамдастың суреті орналастырылады.
- Байланыстырылған бет - бұл компонент бетіне сілтеме.
- Еншілес компонент – еншілес компоненттерге сілтеме.
- Модификатор – стиль опцияларының болуын тексереді және оларды анықтайды (мысалы, белсенді, қызыл және т.б.).
- Компонент категориясы – жалпы категория (мәтін, жарнамалық сурет, бүйірлік тақта).
- Даму жағдайы – нақты даму барысы және оны анықтау (аяқталған, аяқталуда және т.б.).
- Жауапты – осы компонентке жауапты әзірлеуші.
- Атомдық деңгей - бұл құрамдас бөліктің атомдық категориясы (атомдық дизайн тұжырымдамасы бойынша).
- Деректерге бірдей немесе әртүрлі кестелерде сілтеме жасауға болады. Нүктелерді қосу масштабтау кезінде шатасудың алдын алады. Сонымен қатар, деректерді еш қиындықсыз сүзуге, сұрыптауға және өзгертуге болады.
2-мысал: бетті әзірлеу барысы
Бетті әзірлеу барысын бағалау үшін сізге осы мақсат үшін арнайы жасалған үлгі қажет. Кесте команданың өзінің де, клиенттің де қажеттіліктерін қанағаттандыра алады.
Парақ туралы кез келген ақпаратты осында белгілеуге болады. Бұл соңғы мерзім, InVision прототипіне сілтеме, тағайындалған орын, еншілес компонент. Дизайнды құжаттауға және жаңартуға қатысты, сондай-ақ алдыңғы және бэк-экендті әзірлеу күйіне қатысты операцияларды орындау өте ыңғайлы екендігі бірден байқалады. Сонымен қатар, бұл операциялар бір уақытта орындалады.
дерексіз
Құралдың рөлі: дизайн активтері үшін нұсқаларды басқарудың жалғыз көзі.
Аннотацияны Sketch-тегі активтерге арналған GitHub деп атауға болады және ол дизайнерлерді файлдарды көшіру және қою қажеттілігінен сақтайды. Құралдың басты артықшылығы - ол «ақиқаттың жалғыз көзі» ретінде әрекет ететін дизайн репозиторийін қамтамасыз етеді. Дизайнерлер негізгі тармақты бекітілген орналасудың соңғы нұсқасына жаңартуы керек. Осыдан кейін олар әзірлеушілерге хабарлауы керек. Олар, өз кезегінде, негізгі филиалдың дизайнерлік активтерімен ғана жұмыс істеуі керек.
Қорытынды ретінде
Жаңа әзірлеу процесін және жоғарыда аталған барлық құралдарды енгізгеннен кейін жұмысымыздың жылдамдығы кем дегенде екі есе өсті. Бұл тамаша шешім емес, бірақ бұл өте жақсы шешім. Рас, оның жұмыс істеуі үшін сізге көп күш салу керек - оның барлығын жаңартып, жұмыс тәртібінде ұстау үшін «қолмен жұмыс» қажет.
Skillbox ұсынады:
- Практикалық курс .
- Онлайн курс .
- Практикалық курс .
Ақпарат көзі: www.habr.com