Code Breakers | No-code solutions
5.84K subscribers
379 photos
3 videos
368 links
Download Telegram
🖥 Птичий язык разработки: сленг и непонятные слова [часть 1]

Наверняка у вас было такое: при погружении в новую для себя сферу все коллеги будто говорят на другом языке, употребляя много непонятных слов, специфических терминов и аббревиатур. И мы вас прекрасно понимаем, сами там были! И выпадали в осадок от предложений типа: «А я и говорю, раз вайфрейм удался, переходи к мокапу, надо понять флоу приложения, всё зафиналить и скорее деплойнуться уже». И как бы понятно, что ничего не понятно!

Поэтому мы сделали небольшой словарик языка No-code разработки в нескольких частях. Чтобы вы могли легче влиться в новую для себя сферу, лучше понимать коллег и не бояться неправильно употребить какое-либо слово.

Вайрфрейм (от англ. wireframe — каркас) схематический набросок структуры приложения. Его делают в чёрно-белом виде, не заморачиваясь о дизайне и красоте. Задача вайрфреминга построить и показать структуру приложения: сколько у него экранов, где будут находиться элементы (меню, кнопки и др.). Вайрфрейм надо делать на начальном этапе работы, потому что он поможет увидеть общую картину будущего проекта.

Прототип — сложный набросок приложения. Тут проработаны дизайн, красота и тонкости UX/UI-дизайна. Прототип интерактивный, и внешне его почти нельзя отличить от уже готового приложения, — то есть в прототипе можно нажать на кнопку и попасть на нужную страницу. Он нужен, чтобы довести до ума стадию проработки и планирования приложения. Это последний этап перед созданием логики приложения.

Мокап (от англ. mock-up, mockup — макет) самый красивый, полный и демонстрационный вариант макета приложения. Полномасштабная и полноэкранная модель приложения или сервиса. Его делают в рамке экрана компьютера или смартфона, и он максимально похож на оригинал. В нём даже есть интерактив и анимация. То есть в мокапе можно ткнуть на кнопку и она перекинет на нужный экран.

Флоу приложения или воркфлоу (от англ. workflow — рабочий процесс, flow — поток) — последовательность действий и процессов внутри приложения, от которой зависят события. Это простройка логики приложения, например, пользователь нажимает на кнопку и попадает на экран регистрации. Всё это настраивается разработчиком внутри приложения: элементам присваивается необходимая последовательность событий. Поэтому говорят: «Создать флоу приложения». Хорошо сделанный вайфрейм, прототип и мокап помогают не сбиваться с пути и чётко, шаг за шагом, выстраивать логику приложения, перенося идею и набросок в реальность.

Деплой (от англ. deploy — разворачивать) выпуск первой готовой или новой версии приложения туда, где его уже могут потрогать и попробовать пользователи. Ещё называется выкладкой. В классической разработке это непростой и многоэтапный проект. А в ноукодинге это, по сути, означает выпуск приложения.

#code_breakers_птичий_язык_разработки



Хотите всегда понимать коллег, легко пройти онбординг и быстро влиться в сферу No-code разработки? Тогда ждём на нашем флагманском курсе «No-code разработчик». На ближайший поток осталось 3 свободных места!

🤓 Запишите меня на курс:
codebreakers.tech/profession
🖥 Птичий язык разработки: сленг и непонятные слова [часть 2]

В одном из предыдущих постов мы уже начали рассказывать о специфических терминах и непонятных словах из сферы No-code разработки. Если вдруг пропустили его, то вот ссылка на этот пост. Ещё его можно найти по хештегу: #code_breakers_птичий_язык_разработки.

А сегодня мы расскажем ещё о нескольких словах из мира ноукода в целом и немного пройдёмся по терминам, описывающим структуру IT-продукта.

Темплейт (от англ. template — шаблон) шаблон приложения, сайта, сервиса. Их сделали какие-то другие разработчики и выставили в библиотеке темплейтов на платформе. Бывают очень полными с проработкой логики, а бывают схематичными набросками внешнего вида приложения. Помогают сориентироваться, если не хватает фантазии в дизайне и структуре IT-продукта.

Фавикон (сокр. от англ. FAVorite ICON — любимая иконка)маленькая иконка, которую мы видим на закладках в браузере. По сути — логотип сайта.

Хедер и футер (header, footer) — иначе: шапка и подвал страницы. Шапка находится наверху веб-страницы или мобильного приложения. Как правило, туда помещают логотип компании или продукта, меню, кнопку, ведущую в профиль, личный кабинет или корзину. Футер — подвал, находится внизу страницы или приложения. Там часто дублируют меню, расширяя его дополнительной и технической информацией. Например, там можно найти ссылки на подробное описании компании, вакансии, контакты. Там же находится информация о том, кто делал продукт и на чём он сделан.

Фронтенд и бэкенд (frontend, backend) — внешняя и внутренняя части IT-продукта. Фронтенд, внешняя часть — всё, что видит пользователь и с чем непосредственно взаимодействует. Это картинки и тексты, кнопки и формы, видео и анимации. Это всё, что происходит в браузере или в самом приложении на глазах пользователя. Бэкенд, внутренняя часть — всё, что пользователь не видит или всё, что находится «под капотом» сайта или приложения. Фактически роль бэкенда в том, чтобы принимать запросы и передавать запросы серверу. Но это сложная вычислительная работа: обработка поступающей и имеющейся информации, поиск и извлечение данных, динамическая (то есть меняющаяся) визуализация страниц (изменение фронтенда), проверка безопасности и проч.



Хотите всегда понимать коллег, легко пройти онбординг и быстро влиться в сферу No-code разработки? Тогда ждём на нашем флагманском курсе «No-code разработчик». Начинаем учиться уже 9 ноября!

🖥 Хочу на курс: codebreakers.tech/profession
🖥 Птичий язык разработки: сленг и непонятные слова [часть 3]

В нескольких предыдущих постах мы уже начали рассказывать о специфических терминах и непонятных словах из сферы No-code разработки. Если вы вдруг пропустили, — ищите их по хештегу: #code_breakers_птичий_язык_разработки.

А сегодня мы расскажем ещё о нескольких терминах, описывающих структуру IT-продукта.

Интерфейс (от англ. interface) буквально «место соприкосновения», точка соприкосновения пользователя с внешней частью продукта, чтобы «добиться» результата от внутренней части. Через интерфейс пользователь взаимодействует с операционной системой. А сам интерфейс представляет собой определённый набор средств для взаимодействия двух систем. Приборная панель автомобиля — это тоже интерфейс. А у IT-продукта это визуальные средства: кнопки, формы, кликабельные элементы.

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

Дропдаун (от англ. dropdown) выпадающее меню или выпадающий список, из которого можно что-то выбрать.

Стек (от англ. stack) — буквально «пачка» или пакет программ, которые собраны вместе, связаны и интегрированы между собой, чтобы продукт работал полноценно. Это набор технологий, которые собираются воедино, чтобы осуществлять задачи сайта или приложения. В классической разработке часто встречается вот такой стек: HTML + CSS + JavaScript +PHP + MySQL. Это набор языков программирования фронтенда, бэкенда и базы данных. А во вселенной No-code часто встречается стек из ноукод-программы + внешней базы данных (например, Airtable, Google Sheets) + интегрирующей программы (типа Make, Albato, Collabza).



Хотите всегда понимать коллег, легко пройти онбординг и быстро влиться в сферу No-code разработки? Тогда ждём на нашем флагманском курсе «No-code разработчик». Начинаем учиться уже 23 ноября (в четверг)!

👨‍💻 Хочу на курс: codebreakers.tech/profession
🖥 Птичий язык разработки: сленг и непонятные слова [часть 4]

В нескольких предыдущих постах мы уже начали рассказывать о специфических терминах и непонятных словах из сферы No-code разработки. Если вы вдруг пропустили их, — ищите тексты по хештегу: #code_breakers_птичий_язык_разработки.

А сегодня мы остановимся на нескольких терминах из области цифрового дизайна.

Шрифты и выравнивание текста

Гарнитура — комплект одного шрифта разных размеров и начертаний. Например, Open Sans — это шрифт. А Open Sans Light, Open Sans Regular, Open Sans Semibold, Open Sans Bold — это уже гарнитура, комплект разных начертаний.

Кегль — размер шрифта.

Интерлиньяж — межстрочное расстояние. Работают с настройками интерлиньяжа, чтобы порядить текст, добавить в него «воздуха» и сделать более читабельным.

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

Выключка — выравнивание текста относительно вертикальной линии по правой стороне, по левой стороне либо по центру.  

Сетка или модульная сетка — дополнительный слой, каркас или схема, по которой выравниваются элементы цифрового продукта. Самая распространённая, например, 12-колоночная сетка — когда у каркаса 12 колонок с заданными отступами и интервалами. В мобильной вёрстке как правило клетчатая сетка.



Хотите всегда понимать коллег, легко пройти онбординг и быстро влиться в сферу No-code разработки? Тогда ждём на нашем флагманском курсе «No-code разработчик». Начинаем учиться на следующей неделе, — 21 декабря!

🤩 ХОЧУ ЗАПИСАТЬСЯ НА КУРС: codebreakers.tech/profession
🖥 Птичий язык разработки: сленг и непонятные слова [часть 5]

В четырёх предыдущих постах мы рассказывали о специфических терминах и непонятных словах из сферы No-code разработки. Если вы пропустили их, — ищите их по хештегу: #code_breakers_птичий_язык_разработки.

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

Дизайн и анимация
Референс (от англ. reference — справка, сноска) пример цифрового проекта, который вам понравился и на который вы хотите ориентироваться при разработке. Например, референс лендинга — это значит, что вы нашли понравившееся вам решение в создании лендинга.

Дизайн-система — он же гайдлайн. Библиотека из цветов, гарнитур, сетки, компонентов, вроде кнопок, карточек, форм ввода и выбора, хедера и футера. Это правила, которые определяют, как выглядит цифровой продукт или для начала его макет. Он определяет базовые принципы того, как всё будет.

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

Изинги (от англ. easing — смягчение, сглаживание) сглаживание происходящей анимации, её замедление или ускорение. Это свойство помогает анимациям выглядеть естественно, как в природе, где перемещение объектов заметно и понятно. Например, внимание изингам уделяют при переходах с экрана на экран или при появлении элемента, — как всплывающий поп-ап или клавиатура.

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



Хотите всегда понимать коллег, легко пройти онбординг и быстро влиться в сферу No-code разработки? Тогда ждём на нашем флагманском курсе «No-code разработчик». Начинаем учиться сразу после новогодних каникул, 11 января!

🎁 ХОЧУ НА КУРС В НОВОМ ГОДУ: codebreakers.tech/profession