avatar

Скины и шаблоны - принципы, концепции, стандарты

Подробнее ↓

Интерфейс загрузки изображений (концепт)


В продолжение темы https://altocms.ru/1029.html , которая вызвала живую дискуссию участников сообщества, хочу предложить свое видение интерфейса загрузки изображений. Концепция за исключением мелочей отталкивается от идей aVadim в большей степени, а так же предложений Klaus и inliquid

Концепт не предлагает «изобретение велосипедов», а является продолжением существующего функционала. Загрузка изображений выносится под редактор bbcodes и объединяется с фотосетом. Т.о. все управление и загрузкой изображений осуществляется из единого интерфейса.

Подробности под катом.

Читать дальше →

Experience Simple

Задача стояла упростить, убрать тени, поправить некоторые стили и сделать светлую тему. В процессе работы было около десятка различных вариантов, некоторые из них здесь. Нужно было объединить все пожелания пользователей и в тоже время упростить настолько, что при создании проекта потребовалось бы минимум времени на выпиливание лишней «красоты».

Читать дальше →

Список страниц для разработки дизайна типового скина

Решил составить список страниц, которые необходимо разработать при создании нового дизайна для движка. Перечень получился, доложу я вам, неслабый, аж сам удивился. Делал я этот список не с нуля, когда-то давно LeX подобный списочек выкладывал. И я, опираясь на него, подготовил свой, с учетом всех изменений и дополнений, прошедших с того времени, ну и с учетом своего опыта, конечно.

Разумеется, для конкретных проектов, создаваемых на нашем движке, список может быть иным. И, к тому же, это вовсе не значит, что каждая страница с нуля рисуется, на них будут использоваться общие элементы. Поэтому данный список нужно использовать не как догму, а, скорее, как некое руководство или шпаргалку, чтобы не забыть о каких-то вещах, которые вылезут потом на этапе верстки.

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

Читать дальше →

Модальные окна – общаемся с пользователем красиво (часть 2)

В первой части я рассказал про «шаблонные» модальные окна. Т.е. такие, для которых создаются отдельные файлы-шаблоны. И сложность и навороченность этих окон может быть безграничной.

Но нередко для общения с пользователем нужны совсем простые диалоговые окна – просто вывести какое-то сообщение с единственной кнопкой «Ок», которое он не сможет не заметить, или запросить у него подтверждение какого-либо действия.

Часто на сайтах для таких целей используют системные функции alert(), confirm() и prompt(). Примерно вот так:
<a href="site.com/delete/all/" onclick="return confirm('Вы уверены?');">Удалить все!</a>

Это работает в любом браузере, но окна, которые выводятся такими функциями, выглядят некрасиво, примитивно и ломают всю красоту, которую мы наводим на своем сайте.

Читать дальше →

Модальные окна – общаемся с пользователем красиво (часть 1)

Статья рассчитана на тех, кто знает, что такое «модальные окна» и зачем они нужны, и занимается разработкой шаблонов или просто проектирует интерфейс и придумывает дизайн для сайта на Alto CMS.

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

Читать дальше →

Experience универсальный дизайн для Alto CMS (UPD)



Дизайн Experience для адаптивного многофункционального шаблона на основе Startkit и соотв. Bootstrap 3. Было принято решение сделать его бесплатным и заменить дизайн, который должен был идти в дистрибутиве (Sky), на Experience.

Это связанно с некоторыми особенностями интерфейса – Experience. Более функциональный и универсальный, чем Sky, он так же обладает большими возможностями по кастомизации, к тому же его легче сверстать , если использовать за основу Startkit. По предварительной договоренности Вадим согласился включить Experience в стандартный дистрибутив Alto CMS. Но пока это только дизайн и релиз шаблона на его основе станет возможным только при поддержке Alto сообщества.

Прежде всего хочу рассказать о реализации портального вывода постов по категориям на основе дизайна Experience . Подробности под катом.

Читать дальше →

Start-kit - выход на публику

Кто еще не в курсе, что такое start-kit, могут почитать предыдущие статьи об этом тынц и тынц.

Кто не любит читать, а хочет сразу потрогать руками, тот может сделать это здесь: http://demo.altocms.ru/start-kit/index/newall/

А кому интересны подробности, пожалуйте под кат

Читать дальше →

Типовая структура шаблонов для Alto CMS

Эта статья написана в продолжение статьи Базовый скин (шаблон) для Alto CMS, рассчитана на тех, кто проектирует и верстает шаблоны для Alto CMS.

Работа над скином start-kit движется, и уже забрезжил на горизонте финальный огонек. Что сделано за это время:
1) Более-менее «устаканилась» структура папок и именование файлов (об этом и пойдет, в основном, речь в этой статье).
2) Удалось избавится от множества лишних файлов и js-скриптов.
3) Чуть больше стало настроек самого скина: верхний баннер стал виджетом, логотип и главное меню можно менять в настройках, не трогая шаблоны.

Кого интересует то, что в итоге получается, скин можно скачать здесь. Кому интересны детали, ход разработки и/или если есть желание обсудить, тех прошу под кат.

Читать дальше →

Start-Kit - дизайн для базового шаблона



Дизайн для дефолтного шаблона Start-Kit. Как мне кажется шаблон должен иметь собственный узнаваемый дизайн. В макете я постаралась сохранить линию дизайна сайта altocms.ru и простоту github для Start-Kit experience. В то же время отличия от оригинала минимальны, что позволит выполнить дизайн в качестве темы — сохранены все основные положения блоков.

Читать дальше →

Кастомизация шаблона "Developer Kit"

Это кросспост статьи автора шаблона http://voffka.the-hut.by/blog/developer-kit/11.html

Не знаю на сколько это справедливо для StartKit, в любом случае на alto есть и developer-kit. Далее текст автора

«Я все чаще убеждаюсь, что большая часть пользователей шаблона не до конца понимает все прелести его кастомизации…

Ребята, этот шаблон можно очень просто стилизировать не имея при этом обширных знаний css и html! Да, чтобы менять структуру шаблона, надо что-то знать, но изменить цвета шаблона, шрифты, формы и прочее проще некуда!

Я не просто так оставляю ссылку на кастомизированную страницу Бустрапа в теме шаблона (файл README.md). Перейдя по ней Вы попадете на страницу где сохранены текущие настройки для дефолтной темы шаблона, изменяя их Вы можете изменить Ваш шаблон как угодно и получить на выходе что-то свое, индивидуальное!

Читать дальше →