🥩 FARSH — конфа для техспецов
Уже скоро, 15 февраля пройдет конференция для техспецов. В отличие от GETC, FARSH будет посвящен обзору технических новинок в рамках платформы GetCourse
Моя тема выступления — Как правильно доработать UI платформы GetCourse и упростить жизнь технического специалиста, сопровождающего проект: демонстрация проверенных способов.
Рассказывать буду об админках, о том, что у них под капотом и какие они бывают.
Таким образом, будут рассказаны механики:
1. Блоков по типу блока таймкодов, которые умеют сами себя перезаписывать, сохраняя ваши настройки
2. Блоков по типу "последний просмотренный\последние просмотренные\лайкнутые"
3. Админки для разделов, какие есть только в шаблоне One Way
4. Механику, с помощью которой можно добавить любую новую сущность для любого контента в гк. Например, добавить для тренингов и уроков возможность устанавливать любые картинки с делением на "пк-картинка" и "мобильная картинка", а также сделать это более надежным способом, чем тем, которым сейчас пользуются все
Помимо обзора технических новинок будут инсайды по гк, дебагу популярных ошибок и советы по тому, как учиться писать подобное самому. При покупке по ссылке вы получите 10% скидки 👇👇👇
Онлайн конференция FARSH
Помимо моего выступления эфир будет заполнен достойнейшими из спецов по GC, каждая тема которого также рекомендуется к просмотру 🤌 Добро пожаловать!
Уже скоро, 15 февраля пройдет конференция для техспецов. В отличие от GETC, FARSH будет посвящен обзору технических новинок в рамках платформы GetCourse
Моя тема выступления — Как правильно доработать UI платформы GetCourse и упростить жизнь технического специалиста, сопровождающего проект: демонстрация проверенных способов.
Рассказывать буду об админках, о том, что у них под капотом и какие они бывают.
Таким образом, будут рассказаны механики:
1. Блоков по типу блока таймкодов, которые умеют сами себя перезаписывать, сохраняя ваши настройки
2. Блоков по типу "последний просмотренный\последние просмотренные\лайкнутые"
3. Админки для разделов, какие есть только в шаблоне One Way
4. Механику, с помощью которой можно добавить любую новую сущность для любого контента в гк. Например, добавить для тренингов и уроков возможность устанавливать любые картинки с делением на "пк-картинка" и "мобильная картинка", а также сделать это более надежным способом, чем тем, которым сейчас пользуются все
Помимо обзора технических новинок будут инсайды по гк, дебагу популярных ошибок и советы по тому, как учиться писать подобное самому. При покупке по ссылке вы получите 10% скидки 👇👇👇
Онлайн конференция FARSH
Помимо моего выступления эфир будет заполнен достойнейшими из спецов по GC, каждая тема которого также рекомендуется к просмотру 🤌 Добро пожаловать!
🔥6👍3
🥩 НаFARSHировали супер-папку!
😊 Нажимаете «Посмотреть чаты», затем "Добавить папку" и теперь вы подписаны на все Telegram-каналы топовых технарей в сфере EdTech 😎
Please open Telegram to view this post
VIEW IN TELEGRAM
Telegram
FARSH
Sergey Kharkov™ invites you to add the folder “FARSH”, which includes 16 chats.
🔥6❤4👍2
О ФОРС-МАЖОРАХ
Когда я не знаю, что сказать, я просто говорю правду.
Сейчас в 18:45 по Бангкоку был восстановлен доступ к ресурсам One Way Studio после довольно серьезной проблемы.
Что за проблема?
На прошлой неделе с моего устройства периодически возникали проблемы со всеми скриптами, загруженными на мои домены onthewaytothesun.ru и one-way.dev. Иногда браузер давал ошибку из-за таймаута, что означает, что сервер не ответил моему ноуту вовремя. Сервер для всех файлов раньше был на timeweb, известной и хорошей Российской компании. Я подумал, что проблема в Таиланде, т.к. даже поиск в хроме периодически выдает таймауты, поэтому сделал кеширование на Cloudflare (этот сервис "делает копию" моих файлов и я могу подключиться к ним не через питерский таймвеб, а через Сингапур, например, что для меня ближе)
А дальше?
Утро 20 февраля. В канале с бесплатными разработками для taplink поступает жалоба, что один из кодов не работает. Открываю onthewaytothesun.ru — не грузит. one-way.dev грузит через раз. Провожу диагностику — отныне onthewaytothesun.ru открывается только с территории России
Как исправлялось?
Был куплен второй хостинг от зарубежной компании. Все проекты (скрипты, оформления, интеграции) были дублированы на второй сервер. Был добавлен failover (система, которая подключает запасной сервер, если основной недоступен). У нового хостинга другой веб-сервер, другая админка, другое всё. Переписывание части коннекторов, перенос SSL.
В 19 часов по Бангкоку/15 часов по Москве уже все и везде работает без каких-либо ошибок.
Какие выводы?
Теперь, похоже, придется учитывать, что Россия может блокировать трафик из-за рубежа. Зарубежный сервер и домен работают из России, но нельзя точно сказать, будут их блокировать. Так или иначе, но способы решения есть уже сейчас + наверняка IT-сфера постепенно приноровилась бы и к Чебурнету в случае необходимости.
Так как я продавал и раздавал бесплатно свои скрипты, чтобы всё у вас работало за рубежом, найдите в коде onthewaytothesun.ru и замените на one-way.dev. Если живете в России, то проблем вы, скорее всего, даже не заметили 😄
Кому спасибо?
@xDemonME, спасибо за миллионы сохраненных нейронов🫡🫡
Когда я не знаю, что сказать, я просто говорю правду.
Сейчас в 18:45 по Бангкоку был восстановлен доступ к ресурсам One Way Studio после довольно серьезной проблемы.
Что за проблема?
На прошлой неделе с моего устройства периодически возникали проблемы со всеми скриптами, загруженными на мои домены onthewaytothesun.ru и one-way.dev. Иногда браузер давал ошибку из-за таймаута, что означает, что сервер не ответил моему ноуту вовремя. Сервер для всех файлов раньше был на timeweb, известной и хорошей Российской компании. Я подумал, что проблема в Таиланде, т.к. даже поиск в хроме периодически выдает таймауты, поэтому сделал кеширование на Cloudflare (этот сервис "делает копию" моих файлов и я могу подключиться к ним не через питерский таймвеб, а через Сингапур, например, что для меня ближе)
А дальше?
Утро 20 февраля. В канале с бесплатными разработками для taplink поступает жалоба, что один из кодов не работает. Открываю onthewaytothesun.ru — не грузит. one-way.dev грузит через раз. Провожу диагностику — отныне onthewaytothesun.ru открывается только с территории России
Как исправлялось?
Был куплен второй хостинг от зарубежной компании. Все проекты (скрипты, оформления, интеграции) были дублированы на второй сервер. Был добавлен failover (система, которая подключает запасной сервер, если основной недоступен). У нового хостинга другой веб-сервер, другая админка, другое всё. Переписывание части коннекторов, перенос SSL.
В 19 часов по Бангкоку/15 часов по Москве уже все и везде работает без каких-либо ошибок.
Какие выводы?
Теперь, похоже, придется учитывать, что Россия может блокировать трафик из-за рубежа. Зарубежный сервер и домен работают из России, но нельзя точно сказать, будут их блокировать. Так или иначе, но способы решения есть уже сейчас + наверняка IT-сфера постепенно приноровилась бы и к Чебурнету в случае необходимости.
Так как я продавал и раздавал бесплатно свои скрипты, чтобы всё у вас работало за рубежом, найдите в коде onthewaytothesun.ru и замените на one-way.dev. Если живете в России, то проблем вы, скорее всего, даже не заметили 😄
Кому спасибо?
@xDemonME, спасибо за миллионы сохраненных нейронов🫡🫡
❤6🤯4🤔3👍2🔥2
Как ускорить наполнение уроков и статей в GC
Столкнулся сейчас с ситуацией, когда нужно было перенести гк-статью в гк-урок, а переносить картинки не очень удобно. Казалось бы, у картинки должен показываться айди, по которому я могу быстро добавить ее в урок, ан нет
Написал скрипт, который решает эту проблему. Скрипт можно ставить в расширение userJS — https://chromewebstore.google.com/detail/user-javascript-and-css/nbhcbdghjpllgmfilhnhkllmkecfmpld
скрипт:
ксс:
Этот скрипт генерирует у всех блоков картинок кнопочку. Нажатие на кнопочку запустит процесс поиска айди картинки по ее хешу (в это время иконка будет гореть красным). Как только поиск закончится, вместо иконки появится айди, который удобно копировать. Итого вся статья была перенесена за 2 минуты благодаря скрипту, написанному за 10 минут
Столкнулся сейчас с ситуацией, когда нужно было перенести гк-статью в гк-урок, а переносить картинки не очень удобно. Казалось бы, у картинки должен показываться айди, по которому я могу быстро добавить ее в урок, ан нет
Написал скрипт, который решает эту проблему. Скрипт можно ставить в расширение userJS — https://chromewebstore.google.com/detail/user-javascript-and-css/nbhcbdghjpllgmfilhnhkllmkecfmpld
скрипт:
if (window.userInfo.isAdmin) {
$('.image-box').each(function(){
let hash = $(this).find('img').attr('data-hash');
let $getElem = $(`<span class="image-id-fetcher glyphicon glyphicon-download-alt"></span>`)
$(this).append($getElem);
$getElem.click(function(){
$(this).css('color','red')
let link = `/fileservice/control/account/storage?FileAccountStatStorageFilter%5Bfilename%5D=&FileAccountStatStorageFilter%5Bstat_type%5D=0&FileAccountStatStorageFilter%5Bpath%5D=${hash}`
$.get(link,(data)=>{
var pageDom = $('<x/>').append($.parseHTML(data));
$getElem.replaceWith(`<span class="image-id-fetcher">${pageDom.find(('.gc-file-link')).attr('data-file-id')}</span>`)
})
})
})
}ксс:
.image-box {
position:relative;
}
.image-id-fetcher {
position:absolute;
bottom:0;
left:0;
cursor:pointer;
}Этот скрипт генерирует у всех блоков картинок кнопочку. Нажатие на кнопочку запустит процесс поиска айди картинки по ее хешу (в это время иконка будет гореть красным). Как только поиск закончится, вместо иконки появится айди, который удобно копировать. Итого вся статья была перенесена за 2 минуты благодаря скрипту, написанному за 10 минут
👍11🔥2
Разбор нового дизайна страницы оплаты от GetCourse
Ни для кого не секрет, что GetCourse готовит обновление дизайна платформы. В моем аккаунте уже появилась возможность включить новый вид страницы оплаты. Не могу знать, является ли это частью глобального редизайна, но, во-первых, событие это само по себе значимое, а, во-вторых, я подготовил для вас обзор на новую страницу. Обзор текстово-графический, доступен по ссылке
P.S. Обзор сугубо комплиментарный, новости без ложек дёгтя, так что не пугайтесь и не пейте корвалол перед прочтением
Ни для кого не секрет, что GetCourse готовит обновление дизайна платформы. В моем аккаунте уже появилась возможность включить новый вид страницы оплаты. Не могу знать, является ли это частью глобального редизайна, но, во-первых, событие это само по себе значимое, а, во-вторых, я подготовил для вас обзор на новую страницу. Обзор текстово-графический, доступен по ссылке
P.S. Обзор сугубо комплиментарный, новости без ложек дёгтя, так что не пугайтесь и не пейте корвалол перед прочтением
👍8🔥6❤3
Об источниках вдохновения
Во время обсуждений задач по прокачке личных кабинетов мне периодически задавали вопрос: "можете что-то посоветовать из опыта? Виджет какой-нибудь полезный".
Обычно я всегда советовал то, что уже разрабатывал или видел в других школах. Сам я, при этом, никогда не проходил курсов, а также никогда не делал курсов, где все решения по всем вопросам принимаю только я.
Сейчас я потихоньку собираю свой курс по общей фрилансерской грамотности, в который входит, например, обучение коду. Однако на этапе курса по HTML оказалось, что я не могу писать в пунктах ответов на вопросы угловые скобочки "<". Сервер геткурса не пропускает их, потому что вставка кода в то место небезопасна и может сломать страницу. Но мне-то нужно🤷♂️
Решить эту проблему помог довольно коротенький скрипт.
Этот скрипт подменяет "<" на символы "<", когда мы сохраняем вопросы в редакторе тестирования. Таким образом, на них не ругается сервер геткурса и всё исправно сохраняется (а также это никак не сломает страницу, как ни старайся). В момент же загрузки пунктов тестирования происходит обратная подмена символов "<" на "<", благодаря чему ученики смогут видеть HTML -теги.
Во время обсуждений задач по прокачке личных кабинетов мне периодически задавали вопрос: "можете что-то посоветовать из опыта? Виджет какой-нибудь полезный".
Обычно я всегда советовал то, что уже разрабатывал или видел в других школах. Сам я, при этом, никогда не проходил курсов, а также никогда не делал курсов, где все решения по всем вопросам принимаю только я.
Сейчас я потихоньку собираю свой курс по общей фрилансерской грамотности, в который входит, например, обучение коду. Однако на этапе курса по HTML оказалось, что я не могу писать в пунктах ответов на вопросы угловые скобочки "<". Сервер геткурса не пропускает их, потому что вставка кода в то место небезопасна и может сломать страницу. Но мне-то нужно🤷♂️
Решить эту проблему помог довольно коротенький скрипт.
$(`form[action*="/pl/teach/questionary/update-testing?id="]`).submit(function(event) {
event.preventDefault();
$(this).find('textarea').each(function(){
$(this).val($(this).val().replaceAll('<','<').replaceAll('>','>'))
})
$(this).unbind('submit').submit();
})
$( document ).ajaxComplete(function( event, xhr, settings ) {
setTimeout(function() {
$('.js__btn-variant').each(function(){
let $btn = $(this)
if ($btn.html().indexOf('<')!==-1) {
$btn.text($btn.html().replaceAll('<','<').replaceAll('>','>'))
}
})
}, 10);
})Этот скрипт подменяет "<" на символы "<", когда мы сохраняем вопросы в редакторе тестирования. Таким образом, на них не ругается сервер геткурса и всё исправно сохраняется (а также это никак не сломает страницу, как ни старайся). В момент же загрузки пунктов тестирования происходит обратная подмена символов "<" на "<", благодаря чему ученики смогут видеть HTML -теги.
🔥10👍2👏2❤1
Еще виджеты, которые подошли лично моему курсу ввиду его методологии:
1. Опросник. Так как тема курса — все подряд, я даже сам не знаю, о чем рассказать в следующий раз. По этой причине я просто поставил опросник, в котором ученики смогут проголосовать. Что победит, то и выйдет раньше в качестве урока
2. Редактор кода с админкой. Я ненавижу рутину, опечатка в которой может стать фатальной, поэтому я просто сделал редактор, который на опубликованной странице сам сформирует мне красиво оформленный блок кода, а редактирование такого блока допускается простым ctrl+c ctrl+v
3. Таймкоды с админкой. Я сделал новую, третью версию этой концепции и теперь она сама подбирает за меня ссылку. Мне не нужно копировать ее со страницы, достаточно смотреть видео с компа и переписывать число минут и секунд, даже не задумываясь о пересчете
Теперь как минимум для школ по программированию есть что посоветовать😎
1. Опросник. Так как тема курса — все подряд, я даже сам не знаю, о чем рассказать в следующий раз. По этой причине я просто поставил опросник, в котором ученики смогут проголосовать. Что победит, то и выйдет раньше в качестве урока
2. Редактор кода с админкой. Я ненавижу рутину, опечатка в которой может стать фатальной, поэтому я просто сделал редактор, который на опубликованной странице сам сформирует мне красиво оформленный блок кода, а редактирование такого блока допускается простым ctrl+c ctrl+v
3. Таймкоды с админкой. Я сделал новую, третью версию этой концепции и теперь она сама подбирает за меня ссылку. Мне не нужно копировать ее со страницы, достаточно смотреть видео с компа и переписывать число минут и секунд, даже не задумываясь о пересчете
Теперь как минимум для школ по программированию есть что посоветовать
Please open Telegram to view this post
VIEW IN TELEGRAM
Please open Telegram to view this post
VIEW IN TELEGRAM
🔥9🏆3❤1
This media is not supported in your browser
VIEW IN TELEGRAM
Пятничная разработка этой недели — специальный виджет, который позволяет устанавливать пк и мобильную картинку на тренинги и уроки, а также позволяет нативно донастроить картинку по части размеров и пропорций 😎
Виджет хранит информацию с настройками в теме геткурс, благодаря чему все картинки грузятся мгновенно и не грузят дополнительно геткурс лишними запросами, а также хранит промежуточные результаты редактирования в localStorage, чтобы обойти сохранение геткурсом своих тем раз в 15 минут
Виджет хранит информацию с настройками в теме геткурс, благодаря чему все картинки грузятся мгновенно и не грузят дополнительно геткурс лишними запросами, а также хранит промежуточные результаты редактирования в localStorage, чтобы обойти сохранение геткурсом своих тем раз в 15 минут
Please open Telegram to view this post
VIEW IN TELEGRAM
👍8❤2
Потрясающая новость — теперь в приложении GetCourse работает код, вставленный в head.
Что это значит?
⚙️ Теперь не нужен костыль, который подключал из body код для head. Меньше операций = быстрее загрузка. Так как сам head всегда срабатывает раньше body, в целом загрузка в приложениях станет быстрее в среднем на десятки процентов
⚙️ Теперь разработчикам не нужно беспокоиться об областях видимости при дублировании кода на оба раздела, т.е делать оформления качественными будет проще
⚙️ Теперь во всех оформлениях можно будет починить дёрганное переключение на задания и ответы в приложении более простыми способами. Чтобы дергания не было в моем шаблоне, я подменял полностью весь раздел заданий и ответов и догружал все библиотеки, которых не доставало при замене. Теперь можно будет делать более лаконичные решения для красивого переключения
UPD: Чтобы код работал, в школе должна стоять галочка "Отключить нативный вид страницы тренингов в приложении" в настройках аккаунта
Что это значит?
⚙️ Теперь не нужен костыль, который подключал из body код для head. Меньше операций = быстрее загрузка. Так как сам head всегда срабатывает раньше body, в целом загрузка в приложениях станет быстрее в среднем на десятки процентов
⚙️ Теперь разработчикам не нужно беспокоиться об областях видимости при дублировании кода на оба раздела, т.е делать оформления качественными будет проще
⚙️ Теперь во всех оформлениях можно будет починить дёрганное переключение на задания и ответы в приложении более простыми способами. Чтобы дергания не было в моем шаблоне, я подменял полностью весь раздел заданий и ответов и догружал все библиотеки, которых не доставало при замене. Теперь можно будет делать более лаконичные решения для красивого переключения
UPD: Чтобы код работал, в школе должна стоять галочка "Отключить нативный вид страницы тренингов в приложении" в настройках аккаунта
🔥14👍5❤2
1 апреля GetCourse ввел лимиты для запросов к чатиуму, на которых работала функция автоматической установки картинок на тренинги
Ранее с помощью скриптов можно было "поискать" тренинг через функционал стандартного поиска, получить в ответе картинку и поставить ее скриптом на тренинг. В виду того, что на каждый тренинг делалось по запросу, сейчас платформа убрала эту возможность, чтобы от одного пользователя шло меньше обращений к серверам платформы
Если у вас грузятся не все картинки — к сожалению, вы среди тех, у кого тоже стоит этот способ. Однако есть и хорошая новость — в ближайшем будущем GetCourse даст на замену старому возможность ставить картинки более оптимизированным способом.
Как только эта возможность появится, в фирменное обновление OneWay оно будет установлено бесплатно, а для всех будет выложена инструкция по установке картинок с помощью нового варианта🐈⬛️
Ранее с помощью скриптов можно было "поискать" тренинг через функционал стандартного поиска, получить в ответе картинку и поставить ее скриптом на тренинг. В виду того, что на каждый тренинг делалось по запросу, сейчас платформа убрала эту возможность, чтобы от одного пользователя шло меньше обращений к серверам платформы
Если у вас грузятся не все картинки — к сожалению, вы среди тех, у кого тоже стоит этот способ. Однако есть и хорошая новость — в ближайшем будущем GetCourse даст на замену старому возможность ставить картинки более оптимизированным способом.
Как только эта возможность появится, в фирменное обновление OneWay оно будет установлено бесплатно, а для всех будет выложена инструкция по установке картинок с помощью нового варианта
Please open Telegram to view this post
VIEW IN TELEGRAM
❤4🤯1
Фикс выпустили раньше, чем обещали
Инструкция по тому, как теперь вешать картинки на тренинги:
ℹ️ https://teletype.in/@onthewaytothesun/pBTXTcrymfe
UPD: Сервис статей немного подпортил код, код обновлен
Инструкция по тому, как теперь вешать картинки на тренинги:
UPD: Сервис статей немного подпортил код, код обновлен
Please open Telegram to view this post
VIEW IN TELEGRAM
❤7🔥2
О ценах, лояльности и продуктивности
Наверняка у каждого из вас есть первые коммерческие проекты, с которыми вы заходили в нынешнюю профессию. Есть такой и у меня.
6️⃣ Первую задачу по оформлению я взял в марте 2022. Тогда мы с женой попали в аварию, в которой грузовик снес весь перед машины, однако уже на следующий день я работал над проектом, несмотря на боль от любого движения (последствия хлестовой травмы). За проект я тогда взял 35-40 тысяч рублей за страницу входа, тренингов и уроков, вид открытого урока и списка курсов, в виду отсутствия мобильной версии в макете я сделал ее сам и адаптировал тогда всё под чатиум.
2️⃣ Второе оформление под запуск для этой организации я делал уже во всеоружии: внедрил все самые передовые технологии для админок и сделал прям на максимум.
📥 Помимо оформлений я делал бесплатные фиксы и помогал переносить оформление на другой аккаунт их школы, например, когда 2 апреля в геткурсе сменили принцип вывода числа уроков на тренинге, что привело бы к некрасивому багу в этом проекте, я оперативно ввел все изменения просто так.
3️⃣ Март 2024. Ко мне приносят макет для третьего запуска. Мобильной версии нет, все слои разгруппированы, макет сделан так, будто на его создание наняли непрофессионала. Я расписал ошибки в макете, приложил ссылку на геткуровские требования к макетам (не мое самодурство — геткурсовские), получив в ответ «исправим».
Вместо исправления мне присылают ночью в прошедшую пятницу другой макет. Контент в нем другой, а ошибки — ВСЕ ТЕ ЖЕ. Макет всё также выглядит так, будто его набросал за 20-30 дизайнер баннеров, который никогда не слышал про веб-дизайн. Вежливо отвечаю, что макет опять некачественный, пишу заново правки к макету. Получаю в ответ «исправим», после чего в общем чате спецов по геткурсу появляются сообщения по поиске разработчика для работы по макету
🙃 Еще спустя 5 минут в моей личке: «если поправим ТЗ, за сколько сделаете по времени?»
📌 Мораль сей басни такова:
Если вы исполнитель — цените свой труд и не работайте бесплатно и не демпингуйте. Даже если вы всегда работали качественно, вы всегда будете восприниматься как дешевый труд, который легко заменить в случае чего. Даже если на деле это не так
Если вы предприниматель — посмотрите со стороны, как незнание специфики работы и нежелание погружения в них у ответственных лиц может отразиться на качестве результата.
Наверняка у каждого из вас есть первые коммерческие проекты, с которыми вы заходили в нынешнюю профессию. Есть такой и у меня.
Вместо исправления мне присылают ночью в прошедшую пятницу другой макет. Контент в нем другой, а ошибки — ВСЕ ТЕ ЖЕ. Макет всё также выглядит так, будто его набросал за 20-30 дизайнер баннеров, который никогда не слышал про веб-дизайн. Вежливо отвечаю, что макет опять некачественный, пишу заново правки к макету. Получаю в ответ «исправим», после чего в общем чате спецов по геткурсу появляются сообщения по поиске разработчика для работы по макету
Если вы исполнитель — цените свой труд и не работайте бесплатно и не демпингуйте. Даже если вы всегда работали качественно, вы всегда будете восприниматься как дешевый труд, который легко заменить в случае чего. Даже если на деле это не так
Если вы предприниматель — посмотрите со стороны, как незнание специфики работы и нежелание погружения в них у ответственных лиц может отразиться на качестве результата.
Please open Telegram to view this post
VIEW IN TELEGRAM
❤16🔥7👍2
Изменения на странице оплаты
У тинькофф кредита убрали атрибут айди. Если ваше оформление использовало айди для скриптов или оформлений и блок тинькофф рассрочки стал отображаться как-то проблемно, замените в коде оформления #tinkoffcredit на .tinkoffcredit-block (можно через ctrl+f найти все упоминания на странице старого обращения и заменить на новое)
У тинькофф кредита убрали атрибут айди. Если ваше оформление использовало айди для скриптов или оформлений и блок тинькофф рассрочки стал отображаться как-то проблемно, замените в коде оформления #tinkoffcredit на .tinkoffcredit-block (можно через ctrl+f найти все упоминания на странице старого обращения и заменить на новое)
❤10👍1
Первый кейс с компонентным подходом — Olga Kostyunina Hair Education
Продолжая традицию пытаться сделать каждое следующее оформление технологически более качественным, чем все предыдущие, я решил попробовать отойти от логики разделения геткурса на страницы по назначению (тренинги, вход и т.д.) и сперва вычленить из макета все конечные элементы и стилизовать их.
🐈⬛ Что это дает? Выделив в макете 4 разновидности кнопок с фирменным цветом я стилизовал эти вариации и на нужных разделах просто корректировал разновидность. Благодаря этому подходу стилизуя 6 купленных разделов геткурса я стилизовал еще 26 в качестве побочного действия. Менее очевидные плюсы:
👌 Проще задавать состояния элементов и делать интерфейс живым. Когда у вас отдельно прописана кнопка, можно разом для всей школы прописать ей Ховер-эффект на весь аккаунт
👌 Нагляднее видны возможности масштабирования. Тут уже можно и «с цветами поиграться», и даже в темную тему перейти — такой редизайн делается в разы проще, если все в компонентах
👌 Проще масштабироваться. Любая доработка оформления, сделанного компонентами, будет делаться меньшими силами
Минусы у такого подхода тоже присутствуют: в геткурсе порой встречаются просто невероятные комбинации элементов. Например, класс btn-primary, который обычно используют для стилизации кнопок, в процессах расположен у элемента input. Однако, если +- помнить наизусть, где и в каком разделе геткурса какой элемент какие состояния может принимать, этот минус нивелируется
Помимо компонентного подхода, в школе исправлены баги страницы входа (в 90% школ текст ошибок при входе вставляется в текст кнопок), разработаны системы автособирающихся баннеров с автоматически подбираемой шириной текста заголовка, автоматический прогрессбар и маркировка тренингов новым элементом, календарь автоматически адаптируется под всплывающее окно в мобильном виде, а также весь функционал полностью работоспособен в приложении гк
Продолжая традицию пытаться сделать каждое следующее оформление технологически более качественным, чем все предыдущие, я решил попробовать отойти от логики разделения геткурса на страницы по назначению (тренинги, вход и т.д.) и сперва вычленить из макета все конечные элементы и стилизовать их.
👌 Проще задавать состояния элементов и делать интерфейс живым. Когда у вас отдельно прописана кнопка, можно разом для всей школы прописать ей Ховер-эффект на весь аккаунт
👌 Нагляднее видны возможности масштабирования. Тут уже можно и «с цветами поиграться», и даже в темную тему перейти — такой редизайн делается в разы проще, если все в компонентах
👌 Проще масштабироваться. Любая доработка оформления, сделанного компонентами, будет делаться меньшими силами
Минусы у такого подхода тоже присутствуют: в геткурсе порой встречаются просто невероятные комбинации элементов. Например, класс btn-primary, который обычно используют для стилизации кнопок, в процессах расположен у элемента input. Однако, если +- помнить наизусть, где и в каком разделе геткурса какой элемент какие состояния может принимать, этот минус нивелируется
Помимо компонентного подхода, в школе исправлены баги страницы входа (в 90% школ текст ошибок при входе вставляется в текст кнопок), разработаны системы автособирающихся баннеров с автоматически подбираемой шириной текста заголовка, автоматический прогрессбар и маркировка тренингов новым элементом, календарь автоматически адаптируется под всплывающее окно в мобильном виде, а также весь функционал полностью работоспособен в приложении гк
Please open Telegram to view this post
VIEW IN TELEGRAM
Please open Telegram to view this post
VIEW IN TELEGRAM
🔥9👍6