JS Charts является бесплатным JavaScript-генератором графиков и схем, который требует минимум знаний программирования. С JS Charts рисование диаграмм становится простой и легкой задачей. Он не требует никаких дополнительных плагинов и серверных модулей. Просто подключите скрипты, подготовьте данные для схемы в XML или массиве JavaScript и ваша таблица готова.

Перевод статьи "Distinguishing decorative from meaningful elements in UI design".

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

Я настоящий фанат типографики, и трачу много времени на поиск и экспериментирование со всеми видами различных типов шрифтов и стилей.

В этом смысле, я также пытался создать собственные шрифты, и должен сказать, что любой человек, обладая небольшим опытом, может это сделать.
Далее освещены несколько наиболее известные (и бесплатных) инструментов для самостоятельного создания шрифтов.

В этой статье я рассмотрю метод создания блоков с одноцветным полупрозрачным фоном.
Например, таких:


Сразу оговорюсь, что я не буду использовать opacity и абсолютное позиционирование, чтобы разместить контент поверх полупрозрачного блока.

Вторая версия статьи, расширенная и дополненая.

Большая часть готовилась для моего выступления на «РИТ: Клиентские технологии», куда я, к сожалению, не доехал.

 



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

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

Джоно Ди-Карло, сооснователь Humanized, сформулировал свой опыт дизайнера в сподвигающем на размышления, и даже провоцирующем, манифесте (который он назвал «То, во что я верю» These things I believe, — прим. пер.).

Здравствуйте, хочу написать цикл статей про юзабилити веб-интерфейсов, и начну, как не странно, с корзины покупок.

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

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

Итак, начнем!

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

Наткнулся тут рядом на обширную статью про то, как придумывать пароли с введением, кучей абзацев, картинкой, чуть ли не эпиграфом — как тут это сейчас модно :)

Хотелось бы на этом примере показать, чем гуманистический подход отличается от гиковского, технократического.

Давайте вспомним, каковы требования к паролю (не слишком формализованные):

1. Быстро создать
2. Легко запомнить владельцу
3. Легко воспроизвести
4. Трудно запомнить случайно подглядевшему
5. Трудно подобрать перебором

Мне известно следующее решение, уж не знаю, кто его автор, но подсказал его urbansheep.

Из психологии известно, что человек легко запоминает абсурдные фразы. Абсурдные фразы кажутся человеку абсурдными именно потому, что представляют собой нетипичное, необычное и бессмысленное сочетание слов. Amazon.com использует редкочастотные сочетания слов (Statistically Improbable Phrases) для идентификации текстов.

Тогда, взяв словарь русских прилагательных и существительных (допустим, в каждом из них по 10 тыс. слов), можно выбирать оттуда случайным образом 2 прилагательных и 1 существительное, порождая в результате абсурдную, но запоминающуюся фразу.

Пример:

неистовый волшебный катализатор

Итак, число вариантов для такой фразы — 10¹², т.е. 1 триллион.

Осталось выполнить требование 4 — «трудно запомнить подглядевшему». Ну что же, набираем фразу в английской раскладке без пробелов:

ytbcnjdsqdjkit,ysqrfnfkbpfnjh

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

Важное уточнение — если у вашего сервиса много мобильных пользователей, то операцию преобразования делать не стоит! (могут быть трудности при наборе + на мобильном устройстве риск 4 не так актуален).

Кто напишет онлайновую программку-генератор? :)

P.S. Представьте, как такой подход упростил бы задачу запоминания автоматически сгенерированных веб-сервисами паролей для «обычных пользователей» — секретарш, бухгалтеров и т.д.

Конкурс научно-познавательных видео, бурно обсуждавшийся в этой ветке Хабра завершен!



Результаты:

1 место — “Левитация в условиях сверхпроводимости” (Kleo) (29%, 213 голосов). Получает 100$, Инвайт на Хабр, много плюсов к карме.
2 место -“Как сделать самый простой электродвигатель” (Анна К.) (27%, 205 голосов). Получает 60$, Инвайт на Хабр, много плюсов к карме.
3 место -“Как повернуть время назад” (Forall) (15%, 112 голосов). Получает 40$, Инвайт на Хабр, много плюсов к карме.

Итак, наши призеры теперь на Хабре:

1. KLE0
2. ajour из студии веб-дизайна Perevaga
3. forall

Пожалуйста, давайте поплюсуем им обещанную карму! :)

Спасибо всем участникам и зрителям!

Сейчас мы с вами поговорим о веб-формах. Я с высоты собственного невысокого полета успел накопить кое-какой опыт и жажду непременно им поделится. Все о чем пойдет речь ниже не является черепахой на которой стоят слоны. Речь пойдет о скотче на котором держится черепаха.

Итак…

Первое – Откуда ноги?

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

• Для кого делается форма?
• Какая информация нужна, что бы понять и заполнить форму?
• Каков результат заполнения формы?
• Какие у нас есть возможности?

Сервис userfly даёт возможность визуально посмотреть, что и как делал пользователь на вашей странице.
Пока все это в разработке и видимо еще много чего нужно сделать, но основу уже можно попробывать

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

Дабы сразу определить целевую аудиторию этого цикла заметок-статей-поучений пару слов о себе. Бывший школьник, будущий студент, в программинге толком ничего не смыслю, хотя есть пара сайтиков на готовых движках. В php-скриптах могу чего-нить лишнее удалить, изменить, но написать что-то с чистого листа — это не ко мне. Неоднократно пытался научится мастерству создания программ, но обычно тормозил как только дело доходило до ООП (видел в коде эти многочисленные классы, в пособиях всякие «объекты», «инкапсуляции» и т.п. и зависал...)

Собственно точно такое же желание появилось и сейчас. Порыскав по сети в поисках «чего-бы такого интересного выучить» наткнулся именно на Ruby с его рельсами. По словам спецов разного качества Руби сейчас актуален, программировать на нем быстро, это полный ООП (что перспективно в дальнейшем покорении олимпа программирования), синтаксис несложен… В то же время язык — тормоз, нагружает систему, twitter в нем барахтается, пытаясь удержаться на плаву, постоянные проблемы с хостингом. Но я вроде как стартапить в многомиллионную аудиторию не собираюсь, а для общего образования всегда подойдет.

Так что стоит признаться, что и Ruby я знаю совсем каплю, но уверен, что и мои «капли» будут интересны некоторым индивидам, подобным мне. Я могу (и буду) часто ошибаться в каких-то понятиях, методах, но мы ведь готовы помогать друг другу? Вроде бы как Хабр — это элита ИТ, но я думаю, что местные спецы не будут против, если мы тут с начинающими ребятами немного «потусим» :)

Собственно в этой серии статей мы будем капля за каплей наполнять стаканчик знаниями о Руби, наполнять будем вместе — для меня это также станет дополнительным стимулом не бросать занятия. Надеюсь, что и вам будет интересно! Начнем?

Бывает у вас так, что дизайн разработан отличный, всю эту красоту технично собрали и заанимировали, а вот прелоадер как то остался на последнюю очередь и силы уже иссякли… А если учесть, что это первый элемент который встречает посетителя, то положение приобретает серо-тоскливые оттенки.

Специально для попавших в такую ситуацию, ресурс для вдохновения (подчеркиваю!) prettyloaded.com

Человек и Машина: Взаимодействие

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

Прочитав несколько статей на UX Booth удивился, как буржуям всё же удаётся заставить посетителей своих сайтов (и не только) почувствовать некий человеческий фактор. Моим любимым стал Tom Anderson из команды MySpace.

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

На написание этого текста меня натолкнули постоянные споры, возникающие за время моей практики как веб-дизайнера. Собственно, первый раз мне пришлось столкнуться с «резиновыми сайтами» благодаря прихоти заказчика. Когда дизайн проекта был полностью готов, а сам сайт сверстан и подключен, заказчик спросил: «А почему он не растягивается?». Было это достаточно давно, но этот вопрос я слышу примерно раз в 4-5 месяцев. О «резиновой» верстке сайтов говорили и писали много. Говорили что она обязательна, и наоборот, что использование ее ошибка. Однозначно, были причины возникновения резиновости. И утверждать, что использование этой технологии на 99% ошибочно, однозначно нельзя. Любую технологию нужно применить, если она нужна. Я хочу очертить примерную границу применения резиновой верстки.

Kohana — довольно молодой PHP фреймворк, форк CI, всецело завязанный на ООП. К достоинствам Kohana можно отнести использование всех возможностей PHP5 на 100%, высокую скорость работы, «легковесность» и простоту как использования, так и изучения. Из минусов отчетливо выделяется небольшое комьюнити, как следствие, не шибко качественная документация и небольшое количество модулей и библиотек.

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

Под катом пример доски объявлений, написанный с помощью Kohana, возможно местами он не претендует на рациональность и здравый смысл, но всё-же я надеюсь услышать конструктивную критику.

Статья рассчитана на людей, имеющих понятие об MVC и ООП, но не имевших, либо мало имевших, дело с фреймворками.

Не так давно Яндекс.Карты опубликовали самую подробную в рунете русскоязычную карту мира. Чтобы рассказать о ней нашим пользователям, мы сделали баннеры, которые показывают, сколько интересных и удивительных мест можно найти на карте. Поиск необычных названий оказался делом настолько увлекательным, что коллекция баннеров получилась довольно большой.

Безусловным лидером хит-парада наших, а потом и зрительских симпатий стало озеро на острове, который в озере на острове. Не все, кстати, знают, что на озере на острове есть еще один остров, но он слишком маленький – два метра в диаметре — и поэтому практически не виден на спутниковом снимке. А находится он на Филиппинах. Будете проезжать мимо – обязательно загляните посмотреть.



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

Анна Герасимова, географ-энтузиаст

2008 год для Рунета — это точно год стартапов. Год расцвета этой культуры в России. И пока пузырь ещё не лопнул публикую декабрьский рейтинг лучших стартапов месяца. Под Хабракатом 10 лучших стартапов Декабря с комментариями разработчиков и как бонус ещё семь стартапов, которые вышли в Декабре и заслуживают вашего внимания.

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

Уже сейчас работает уведомление по e-mail, icq.
Но как быть, если администратор в дороге, и не имеет доступа к почте и мессенджеру? Нужно сделать уведомление SMSкой. Это будет полезно как админу, так и пользователю, т.к. последний сможет уведомиться об обработке его проблемы/заявки.