Онлайн редактор для Bootstrap— LayoutIt

    Twitter Bootstrap становится всё популярнее и популярнее, многие используют его в своих проектах, думаю еще больше людей используют для прототипирования интерфейсов. Я не исключение. И вот сегодня утром наткнулся на интересный сервис — LayoutIt. По сути LayoutIt — это онлайн редактор для создания интерфейсов с использованием Bootstrap. Редактор представляет собой Drag & Drop интерфейс.


    Давайте рассмотрим его подробнее. Сразу хочется сказать, что проект еще находится в бете и не все компоненты и возможности Bootstrap можно использовать. Так например на вкладке JavaScript красуется Cooming soon… Так же в кнопочках нельзя проставить иконки.
    Интерфейс редактора выглядит так

    Справа мы видим вкладки с компонентами Bootstrap. Grid System — выбор одна колонка, две или три. Base CSS — основные элементы такие как кнопочки, списки, таблицы, формы и прочее. Components — различного рода дополнительные компоненты.
    Дальше все, что вам это перетаскивать элементы, и выбирать их свойства. Выглядит это примерно так

    После того, как вы закончите, вы можете с помощью верхнего меню посмотреть превью или же скачать в формате zip или html ваш код.
    Редактор пока далек от идеала, не хватает многих компонентов, есть еще над чем работать. Но для быстрого наброска он подходит почти идеально.

    Сайт: LayoutIt
    Share post

    Similar posts

    AdBlock has stolen the banner, but banners are not teeth — they will be back

    More
    Ads

    Comments 33

      +3
      Пока сырой. Использую Bootstrap Lib для Axure.
        +1
        Поделитесь пожалуйста ссылкой, гугл несколько вариантов выдал.
      +7
      Есть еще Divshot. Правда тоже пока в бете. Но помимо Bootstrap поддерживает еще Foundation и Ratchet.
        +3
        Я использую jetstrap.com + скоро выйдет webflow.com/ но он не для Bootstrap.
          0
          Надо попробовать, спасибо за информацию
            0
            Попробовал jetstrap — очень хорош, жаль что бесплатно можно только 1 проект создать
              +5
                0
                Тоже его использую. Лучший из всех, имхо.
              +1
              Очень кстати, спасибо
              • UFO just landed and posted this here
                  +5
                  > Ни тебе автодополнения, ни автокоррекции разметки.

                  Человечество уже придумало vim ;)
                    +2
                    Вы бы ещё перфокарты вспомнили.
                    • UFO just landed and posted this here
                    0
                    Народ, а для чего вы вообще используете Bootstrap? Правильно ли я понимаю, что это в большей степени подходит для создания админок сайтов, каки[-либо сервисов для внутреннего использования и т.д.?
                      0
                      я именно так и использую. хотелось бы и правда услышать мнения других людей.
                        +1
                        Для всего подходит, просто в админках не надо заморачиваться с изменением внешнего вида.
                          0
                          Для админок, для сервисов притом не обязательно для внутреннего пользования. Очень удобно бывать создать быстрый прототип чего либо
                            0
                            А адаптивную сетку, если я правильно понимаю, можно и вовсе для любого проекта использовать как каркас? Т.е. и для клиентской части сайтов, т.к. «фирменный» стиль бутстрапа в данном случае никак не проявляется.
                              0
                              Да, именно так.
                              • UFO just landed and posted this here
                              +1
                              Где угодно, builtwithbootstrap.com/
                                0
                                Тоже делаем админки и сервисы для внутреннего использования.
                                  0
                                  Для быстрого прототипирования (слово-то какое!).
                                  Очень быстро можно сделать набросок типичного и простого сайта («сделайте мне страничку чтобы слева было меню, вверху лого, и табличка с ценами»). Для чего-то а-ля корпоративного сайта естественно всё пишется/подбирается с нуля под конкретные задачи.
                                • UFO just landed and posted this here
                                    0
                                    Спасибо огромное, странно, что никто раньше не заметил;)
                                    +1
                                    Как то перемудрено слишком у них, использую www.layzilla.com
                                      0
                                      Приятный сервис
                                        +1
                                        Еще несколько лет, и появятся он-лайн редакторы интерфейсов, не хуже чем редакторы десктопных интерфейсов 90-х годов! Прогресс не дремлет!

                                        Но при всем моем сарказме, сервис полезный
                                          0
                                          Давно жду чего-то такого. Для визуальной RAD-разработки (в стиле Delphi/VB) приложений класса «rich client application», запускаемых в браузере. Есть ряд задач (типа тех же админок и бизнес-приложений), которые было бы удобно запихнуть в браузер (для кроссплатформенности и удобства деплоймента) и где не нужно SEO (а следовательно можно пренебречь страничной парадигмой и представлением данных в HTML-коде — сделать практически монолитное (с точки зрения пользователя) приложение на одной HTML-странице без перезагрузок). Но действительно удобных и лёгких в освоении для дэсктопщика (привыкшего к тем же VB/Delphi/C++Builder/WinForms) инструментов я так и не увидел.
                                          0
                                          Недавно на Хабре о схожем сервисе — app.divshot.com/. А за этот спасибо.
                                          habrahabr.ru/post/162783/
                                            0
                                            Я правильно понял, что это что-то типа Delphi/VB для web получается?
                                            (если что, я знаю, что визуальные RAD-среды есть и для других языков, но именно Delphi и VB напрашиваются как классические примеры)

                                            Only users with full accounts can post comments. Log in, please.