Комментарии 55
Клон Webflow?
Клон делать не планировали, но на их опыт безусловно смотрели, много и различий, например иной подход к классам, триггерам и другим вещам. Так же много вещей заточенных под компании (ребрендинг тот же) которых у webflow вроде бы как не замечалось. Но безусловно во многих вещах он является хорошим примером
Но сходство с:
http://macaw.co
http://scarlet.macaw.co
сразу бросается в глаза :)
Вообще, проект интересный, пошёл изучать.
http://macaw.co
http://scarlet.macaw.co
сразу бросается в глаза :)
Вообще, проект интересный, пошёл изучать.
Скажите. Платформа для дизайнеров, большие возможности, прочее, — это всё хорошо. Но насколько имеет смысл использовать Пиксли или тот же Webflow для дизайна сложных интерфейсов? Простой пример сложного интерфейса — интернет-магазин. Вы бы порекомендовали ваш продукт или Webflow для этого? Только скажите честно, если проще будет себе в ногу выстрелить всё таки.
Спрашиваю не из праздного интереса. В процессе дизайна сложных интерфейсов очень часто не хватает интерактива (клиенту) и дополнительного контроля над внешним видов десятков и сотен копий какого либо компонента (копии, разумеется, не идентичные, а с разным контентом, ну те же карточки товаров например).
Спрашиваю не из праздного интереса. В процессе дизайна сложных интерфейсов очень часто не хватает интерактива (клиенту) и дополнительного контроля над внешним видов десятков и сотен копий какого либо компонента (копии, разумеется, не идентичные, а с разным контентом, ну те же карточки товаров например).
Хороший вопрос, спасибо. Для интернет магазинов думаю не подойдет не наш сервис, не вебфлоу, ни какой то другой по той причине, что в интернет магазине много технически сложного функционала и дать возможность полноценно им управлять и оформлять его, едва ли даст какой то сервис. Лучшие магазины — это всегда написанные руками. Если речь идет о каких то несложных магазинах, то можно экспериментировать, но лучше подобные сервисы подходят для корпоративных сайтов, промо страниц и других подобных проектов.
Если речь идет о проектах не требующих сложных технических решений, то сервисы, как пиксли, вебфлоу, muse, macaw и тд. хорошо решают данную задачу и позволяют создавать и интерактив и работать с мелкими деталями.
Если речь идет о проектах не требующих сложных технических решений, то сервисы, как пиксли, вебфлоу, muse, macaw и тд. хорошо решают данную задачу и позволяют создавать и интерактив и работать с мелкими деталями.
Мы решаем ваши задачи несколько по другому, но клиенты довольны.
Сначала полностью интерактивный прототип в Axure (в плоть до анимаций кнопочек, переходов, менюшек, каруселей и тд), как вариант с базовыми цветами которые желает заказчик (но чаще всего в серых тонах), после согласования прототипа, передаем в дизайн. После этого если есть большое желание и бюджет позволяет можем натянуть готовый дизайн сначала на прототип, что бы заказчик мог оценить то что придумал дизайнер и погулять уже почти по готовому сайту (по готовому с точки зрения заказчика), и уже потом отдаем в верстку и программинг. Соответственно процесс итеративный, можем вернутся на шаг прототипа или дизайна.
Но это только на сложных проектах-порталы, магазины и тд. И довольно редко.
Сначала полностью интерактивный прототип в Axure (в плоть до анимаций кнопочек, переходов, менюшек, каруселей и тд), как вариант с базовыми цветами которые желает заказчик (но чаще всего в серых тонах), после согласования прототипа, передаем в дизайн. После этого если есть большое желание и бюджет позволяет можем натянуть готовый дизайн сначала на прототип, что бы заказчик мог оценить то что придумал дизайнер и погулять уже почти по готовому сайту (по готовому с точки зрения заказчика), и уже потом отдаем в верстку и программинг. Соответственно процесс итеративный, можем вернутся на шаг прототипа или дизайна.
Но это только на сложных проектах-порталы, магазины и тд. И довольно редко.
Интерактивность настолько востребована, что я уже всерьез подумываю всё сразу в Акшуре делать. Но останавливают некоторые его недостатки. Вот кстати вопрос в тему: если вы натягиваете дизайн на прототип, то потом как отдаете результат в разработку? Вручную описываете интерфейс или придумали способ для верстальщиков извлекать всё нужное удобно и быстро прямо из интерактивного отдизайненного прототипа?
И кучи других «выделяющихся на фоне остальных» редакторов типа викс и подобных с кучей «говнокода» на свёрстанной странице.
О, ознакомился, спасибо за ссылку!
Дальше текст не вам, а автору статьи, но пусть тут лежит, возле ссылки.
Webflow — пример идеального инструмента, которым невозможно пользоваться.
Имхо, в нём есть, наверное, есть всё, а сунешься делать — и простую вещь не можешь.
Мне кажется, у создателей таких инструментов фундаментальная ошибка есть, они (вы) пытаются всё, что они умеют делать в вёрстке, переложить на мышко-тыкание. А делать так нельзя.
Ну вот смотрите, есть овердофига способов позиционировать элемент на экране, а реально достаточно только одного — flex-а. Есть дофига способов задать отступы у текста, а реально — в системе визуального проектирования никому не надо знать, что вот это называется margin, вот это padding, а вот это — text-indent.
Я не знаю ничего про создателей webflow, и про pixli ничего не знаю.
Но если сравнивать webflow и wix (да, да, сравниваю несравнимое, наверное), то wix — лучше.
Он проще, понятнее, там хоть что-то можно не только начать делать, но и завершить.
В общем, одумайтесь =)
Я вам (автор статьи) как фреймворкостроитель фреймворкостроителю пишу.
Дальше текст не вам, а автору статьи, но пусть тут лежит, возле ссылки.
Webflow — пример идеального инструмента, которым невозможно пользоваться.
Имхо, в нём есть, наверное, есть всё, а сунешься делать — и простую вещь не можешь.
Мне кажется, у создателей таких инструментов фундаментальная ошибка есть, они (вы) пытаются всё, что они умеют делать в вёрстке, переложить на мышко-тыкание. А делать так нельзя.
Ну вот смотрите, есть овердофига способов позиционировать элемент на экране, а реально достаточно только одного — flex-а. Есть дофига способов задать отступы у текста, а реально — в системе визуального проектирования никому не надо знать, что вот это называется margin, вот это padding, а вот это — text-indent.
Я не знаю ничего про создателей webflow, и про pixli ничего не знаю.
Но если сравнивать webflow и wix (да, да, сравниваю несравнимое, наверное), то wix — лучше.
Он проще, понятнее, там хоть что-то можно не только начать делать, но и завершить.
В общем, одумайтесь =)
Я вам (автор статьи) как фреймворкостроитель фреймворкостроителю пишу.
НЛО прилетело и опубликовало эту надпись здесь
Спасибо, обязательно учтем, все приходит с опытом!)
А еще хорошим тоном является указывать откуда были взяты использованные изображения)). Как то удивительно было увидеть на второй картинке, визуализацию прошлой версии дизайна главной страницы DoSites.Net, со страницы портфолио нашего дизайнера (http://fine-designer.com/portfolio/veb-dizajn/)
А чем этот сервис лучше muse, или wix, или lpgenerator?
«Здравствуйте уважаемые читатели, после почти годового периода обкатки и тестов, мы выпустили в свет первую публичную версию нашего продукта – универсальную платформу для web-дизайнеров.»
А на главной странице сервиса:
«с нами уже 11 000+ дизайнеров»
«создано 7 000+ сайтов»
Только запустились, а уже врёте.
А на главной странице сервиса:
«с нами уже 11 000+ дизайнеров»
«создано 7 000+ сайтов»
Только запустились, а уже врёте.
Ребята, я понимаю, что вы создаете технически очень сложный продукт, не хочу язвить, но немного критики всё же думаю не помешает. В описании продукта видим:
После создания сайта, вы получаете чистый, семантический кодИ там же скриншот кода, на котом я не увидел ни чистого, ни семантического кода (это, конечно же, повод для холиваров, но вступать в них я не буду, это чисто мое мнение):
Спасибо за ваше замечание, конечно до совершенства всегда далеко, но мы работаем над этим, например в след. обновлении планировали принять ряд мер, связанных с данной проблемой.
Я уделяю внимание на том, что при продаже услуги вы указываете неверную информацию. Возможно при апдейте системы всё станет соответствовать рекламным лозунгам, но пока что конкретно на этом примере не соответствует, увы. Скорее всего ваша целевая аудитория не сможет разобраться на сколько код чист или семантичен. Понимаю, что продажи нужно делать, приток денег будет способствовать развитию продукта (чего искренне желаю). Но поверя описанию на сайте клиент может выложить сайт в бой, думая что верстка семантичная, влить в него отмеренный бюджет на продвижение, но в итоге отдача будет менее ожидаемой, чем от такого же сайта с «ручной» версткой, выполненной с соблюдением семантики и с фаршировкой соответствующих схем на нужных участках.
Я бы мог порекомендовать знакомым данный продукт исключительно как расширенный инструмент дизайнера, но не как законченное frontend-решение.
Я бы мог порекомендовать знакомым данный продукт исключительно как расширенный инструмент дизайнера, но не как законченное frontend-решение.
Ваше мнение безусловно очень ценное, спасибо. Но понятие красивого кода оно и вправду очень субъективно, например, поисковые системы неплохо воспринимают сайты созданные у нас. Но с точки зрения профессионального верстальщика, конечно недочеты есть. Если у вас будет возможность и желание мы были бы вам очень благодарны за более развернутый ответ, в каком виде вы бы хотели видеть код, что бы мы это учли в будущем. Спасибо!
А чем код на скриншоте не семантичен? Потому что много классов?
Ну да, видно что БЕМ или что то похожее генерит много мусора, но разве количество классов влияет на продвижение?
Если хочется семантики — уж лучше микроразметку добавить и теги вида aside, content и др.
Классы сокращать тупняк какой то.
Например реализация кнопки.
Свёрстанную таким образом кнопку не распознают скринридеры и читалки.
Свёрстанную таким образом кнопку не распознают скринридеры и читалки.
Я не связывал семантичность и классы. Но вот чистоту кода и классы связать могу — названия классов в виде css-свойств мне кажется делать не красиво и не правильно, тем более что даже на разных устройствах эти свойства могут сильно различаться. Найдите в той же методологии БЭМ хоть что-то похожее на class=«width-100». Даже у бутстрапа с его мусором в классах такого нет.
По поводу ваших уточнений о микроразметке — соглашусь, я как раз выше и писал об этом. Сюда же можно добавить и другие схемы, например для читалок. Но автоматизировать такое достаточно сложно, система должна понимать какие схемы включать для нужных блоков. Перекладывать это на дизайнера в интерфейсе редактора — можно сильно усложнить продукт. Мне кажется, хорошим вариантом было бы дать возможность применять схемы, но как именно — это уже задача проектировщиков данного продукта.
По поводу ваших уточнений о микроразметке — соглашусь, я как раз выше и писал об этом. Сюда же можно добавить и другие схемы, например для читалок. Но автоматизировать такое достаточно сложно, система должна понимать какие схемы включать для нужных блоков. Перекладывать это на дизайнера в интерфейсе редактора — можно сильно усложнить продукт. Мне кажется, хорошим вариантом было бы дать возможность применять схемы, но как именно — это уже задача проектировщиков данного продукта.
В рот мне ноги, уж лучше тогда инлайном style="" генерировать.
Выбирая между текущим вариантом и инлайн-стилями я бы выбрал второй вариант, согласен )
Что на это скажут поисковики или им все равно? Да и воообще, поисковики как то парсят классы и делают ли какте то выводы на их основании?
Утверждать не могу, но очень сомневаюсь в том, что классы учитываются поисковиками. Возможно для лучшего понимания структуры документа считываются ключевые названия классов типа header, nav, footer, main и т.д., но здесь наверняка больший вес будут иметь атрибуты role либо полноценные схемы schema.org, правда к стилизации это уже не имеет никакого отношения.
Проблема со стилями стоит давно перед программистами у нас, на данный момент конструктивная особенность не давала их сделать по уму, ориентировочно через месяц в 4 версии редактора вероятней всего получится решить данную проблему, хотя признаться честно это не является основной задачей, но это не отменяет ее важности.
То что касается поисковых систем, со своей стороны могу добавить то, что сайты созданные в пиксли неплохо индексируются. Не хочу что бы это выглядело как чрезмерная реклама, но например, главная страница сервиса (а ей отроду полторы недели), собранная у нас в редакторе, была в топе по многим среднечастотным запросам. Предыдущая версия была в топе по высокочастотным запросам, таким как «Конструктор сайтов», хотя СЕО особо не занимались, сейчас после обновления дизайна и контента на ней немного просела.
Пользователи тоже не жаловались. В целом СЕО довольно спорная тема всегда была и методик продвижение масса.
Пробуйте, тестируйте, ценные советы всегда нужны. За это и любим хабр, всегда покажут все недочеты. Спасибо!
То что касается поисковых систем, со своей стороны могу добавить то, что сайты созданные в пиксли неплохо индексируются. Не хочу что бы это выглядело как чрезмерная реклама, но например, главная страница сервиса (а ей отроду полторы недели), собранная у нас в редакторе, была в топе по многим среднечастотным запросам. Предыдущая версия была в топе по высокочастотным запросам, таким как «Конструктор сайтов», хотя СЕО особо не занимались, сейчас после обновления дизайна и контента на ней немного просела.
Пользователи тоже не жаловались. В целом СЕО довольно спорная тема всегда была и методик продвижение масса.
Пробуйте, тестируйте, ценные советы всегда нужны. За это и любим хабр, всегда покажут все недочеты. Спасибо!
Мне правда хочется верить, что у вас возможно делать профессиональные и красивые сайты, но на первой же странице на самом видном месте у вас в слогане двойной пробел…
О, действительно!
Уже исправили, спасибо.
Уже исправили, спасибо.
Пожалуй, сперва пожелаю вам удачи и много-много клиентов!
А теперь спрошу по UX.
Положим, можно создать сколь-угодно сложную область редактора (то, что у вас по-середине).
1) Так ли уж нужна левая панель (дерево)? Есть ли у неё какая-либо особая миссия, которую нельзя сделать в области редактора?
2) Так ли уж нужна правая панель (область свойств). Я вижу там 80% свойств — одинаковы для всех компонент. Не вернее ли провести декомпозицию и сделать, скажем, компонент Box, у которого есть margin, padding,… Для компонента Box вполне решаемая задача — сделать управление границами и отступами прямо в области редактора?
3) Ввиду 2 — не жалеете, что отказались от полноценной палитры? Нет ли планов вернуть? Нет ли планов в палитру добавить стеки, доки, репитеры и т.п.?
И ещё спрошу по экономике.
Без абсолютных цифр, не могли бы вы рассказать немного по текущим и целевым показателям.
А именно:
1) Структура текущих затрат в процентах по видам расходов (без абсолютных цифр и ненужной оценки рентабельности)
2) Структура текущих доходов в процентах по сегментам покупателей (без асолютных цифр и оценок вроде «мало клиентов», «много клиентов»)
3) Структура планируемых затрат и доходов.
А теперь спрошу по UX.
Положим, можно создать сколь-угодно сложную область редактора (то, что у вас по-середине).
1) Так ли уж нужна левая панель (дерево)? Есть ли у неё какая-либо особая миссия, которую нельзя сделать в области редактора?
2) Так ли уж нужна правая панель (область свойств). Я вижу там 80% свойств — одинаковы для всех компонент. Не вернее ли провести декомпозицию и сделать, скажем, компонент Box, у которого есть margin, padding,… Для компонента Box вполне решаемая задача — сделать управление границами и отступами прямо в области редактора?
3) Ввиду 2 — не жалеете, что отказались от полноценной палитры? Нет ли планов вернуть? Нет ли планов в палитру добавить стеки, доки, репитеры и т.п.?
И ещё спрошу по экономике.
Без абсолютных цифр, не могли бы вы рассказать немного по текущим и целевым показателям.
А именно:
1) Структура текущих затрат в процентах по видам расходов (без абсолютных цифр и ненужной оценки рентабельности)
2) Структура текущих доходов в процентах по сегментам покупателей (без асолютных цифр и оценок вроде «мало клиентов», «много клиентов»)
3) Структура планируемых затрат и доходов.
1) Так ли уж нужна левая панель (дерево)? Есть ли у неё какая-либо особая миссия, которую нельзя сделать в области редактора?
Например, выделить скрытый при текущем размере экрана элемент
Спасибо. По порядку отвечу на все ваши вопросы.
1) Без дерева человек запутается в блоках и их вложенности, а так же не сможет найти некоторые из них в случае некоторых своих действий. Например, он перетащил блок за область экрана, сделал его очень маленьким и потерял его, по выставлял z-index различные и запутался в структур вложенности, захотел выбрать самый верхний элемент в редакторе «body». В общем дерево это не нечто обязательное, но то, что облегчает работу.
P.S. В первых версиях редактора действительно не было левой панели и как то люди работали, но было неудобно.
2) На правой панели располагаются все инструменты для стилизации элементов, вынести их в отдельные всплывающие окошки действительно идея хорошая и она давно рассматривается, но пока не доходили руки. Но это возможно лишь как вспомогательная функция для более быстрого управления элементом. Полностью убирать правую панель нельзя, так как, там слишком много инструментов и в дальнейшем туда будет только добавляться функционал.
3) Палитры смотрели разные, пока остановились на этой так как для большинства задач ее хватает, а еще сильнее перегружать интерфейс не хотелось. Но возможно переосмыслим данный вопрос. Спасибо.
— По экономите, на данный момент проект убыточен на 15% это связано с резко возросшими затратами, на программную часть и запуском различных рекламных процессов. До этого, пока проект работал в тестовом режиме и затрат было куда меньше, он был вполне экономически интересен. Но учитывая то, что затраты сейчас резко не возрастают, а число пользователей постоянно прибавляется, то эта цифра скоро должна измениться.
По затратам, огромная часть около 65% это разработка и постоянное развитие проекта. Если развитие остановить, то эта цифра сразу опуститься до 15% (уровня тех. обслуживания проекта). Но этого делать никто не собирается пока.
Вторая часть затрат это вспомогательный персонал, работа над обучающим контентом, тех. поддержка пользователей, копирайтер для нашего блога на сайте и других площадок, переводчик (хотим выйти на англоязычную аудиторию попытаться дополнительно) А так же другие ребята, которые здорово нам помогают. Это около 25%
и 10% это мелкие затраты в духе серверов для «боевой версии», тестовой версии и другие необходимые вещи.
Не стал расписывать рекламный бюджет, это отдельная статья затрат. По объему примерно такая же как и техническая.
1) Без дерева человек запутается в блоках и их вложенности, а так же не сможет найти некоторые из них в случае некоторых своих действий. Например, он перетащил блок за область экрана, сделал его очень маленьким и потерял его, по выставлял z-index различные и запутался в структур вложенности, захотел выбрать самый верхний элемент в редакторе «body». В общем дерево это не нечто обязательное, но то, что облегчает работу.
P.S. В первых версиях редактора действительно не было левой панели и как то люди работали, но было неудобно.
2) На правой панели располагаются все инструменты для стилизации элементов, вынести их в отдельные всплывающие окошки действительно идея хорошая и она давно рассматривается, но пока не доходили руки. Но это возможно лишь как вспомогательная функция для более быстрого управления элементом. Полностью убирать правую панель нельзя, так как, там слишком много инструментов и в дальнейшем туда будет только добавляться функционал.
3) Палитры смотрели разные, пока остановились на этой так как для большинства задач ее хватает, а еще сильнее перегружать интерфейс не хотелось. Но возможно переосмыслим данный вопрос. Спасибо.
— По экономите, на данный момент проект убыточен на 15% это связано с резко возросшими затратами, на программную часть и запуском различных рекламных процессов. До этого, пока проект работал в тестовом режиме и затрат было куда меньше, он был вполне экономически интересен. Но учитывая то, что затраты сейчас резко не возрастают, а число пользователей постоянно прибавляется, то эта цифра скоро должна измениться.
По затратам, огромная часть около 65% это разработка и постоянное развитие проекта. Если развитие остановить, то эта цифра сразу опуститься до 15% (уровня тех. обслуживания проекта). Но этого делать никто не собирается пока.
Вторая часть затрат это вспомогательный персонал, работа над обучающим контентом, тех. поддержка пользователей, копирайтер для нашего блога на сайте и других площадок, переводчик (хотим выйти на англоязычную аудиторию попытаться дополнительно) А так же другие ребята, которые здорово нам помогают. Это около 25%
и 10% это мелкие затраты в духе серверов для «боевой версии», тестовой версии и другие необходимые вещи.
Не стал расписывать рекламный бюджет, это отдельная статья затрат. По объему примерно такая же как и техническая.
Есть ли возможность создавать сайты с динамичным контентом, например, блоги или каталоги?
А можно ли купить подписку БЕЗ вашего хостинга и CMS? Например, я хочу создать дизайн и скачать его себе, чтобы добавить нужную автоматизацию, впилить нужные скрипты и навесить на уже готовый сайт?
Скажите, можно ли посмотреть примеры «живых» сайтов?
Добрый день, не очень бы хотелось афишировать сайты пользователей без их согласия, но сам сайт pixli.ru собран у нас + все шаблоны так же собраны в редакторе
http://universal.pixli.ru/
http://studio.pixli.ru/
http://half.pixli.ru/
http://singer.pixli.ru/
и тд.
http://universal.pixli.ru/
http://studio.pixli.ru/
http://half.pixli.ru/
http://singer.pixli.ru/
и тд.
На первых двух сайтах нажимаю в форме Contact Us и что-то странное происходит. Какой-то конверт показывается. Что там происходит? Делается ли что-то настоящее?
Конечно делается, попробуйте. Сообщение у вас не ушло потому что это шаблоны. Хотя только что проверил, у вас всплыло обычное окно с уведомлением об отправке сообщения. Я был бы вам очень признателен, если вы скините «настоящий» сайт по вашему мнению, что бы я мог посмотреть и сказать получится ли его у нас сделать. Спасибо.
Я, конечно, не дизайнер, но я не осилил сделать на вашем сайте сделать простейшую страницу. Всё скачет как попало, работает абы как. Как вы умудрились сделать таким инструментом эти 4 сайта — ума не приложу, но чувствую потребовалось на это гораздо больше времени, чем потратил бы верстальщик.
Равноускоренная анимация это зло))
Попробовал — выглядит очень здорово, практически все понятно интуитивно. Вы не думали о том, чтобы завести тарифный план для прототипирования интерфейсов? Не предоставляющий хостинг и CMS, однако позволяющий иметь большее количество проектов для того, чтобы можно было делать прототипы страниц для демонстрации клиентам, например?
Прилетела новостная рассылка с нерабочей ссылкой «Отписаться». Лучше поправить, а то можете под спам-фильтр угодить )
Зарегистрируйтесь на Хабре, чтобы оставить комментарий
Как мы перешли от виджетов и «кирпичиков» к интуитивной верстке с возможностью внедрения html, css и javascript