Дэвид Дэвис из Ext не просто клёво зовётся, но и делает клёвые штуки :) Последняя его блогозапись демонстрирует и объясняет слияние HTML5-элемента <video> с поддержкою холста (<canvas>) по мере того, как он создаёт всплывающую подсказку с живым видео.

В этом примере используется рабочий web-стол Ext JS, и созданный код поставляет специальную панель, способную доставлять видео, а затем попросту захватывается видеокадр, и размер его уменьшается до размеров всплывающей подсказки:

win.ctx.drawImage(win.videoEl, 0, 0, win.tip.width, win.tip.height);

Весьма мило устроено.

Я хочу дать исчерпывающее описание замечательному фреймворку для построения модульных сеток 960gs. Недавно где-то в комментариях сказали, что 960gs сложнее в понимании, чем blueprint, что меня удивило. Я не хочу заниматься сравнением этих фреймворком, хотя бы потому, что они выступают в разных весовых категориях, однако, для построения модульной сетки ничего легче и проще в понимании, чем 960gs я не видела.

Быть фрилансером, означает ли это, что вы больше не будете иметь дел с трудными людьми на работе?

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

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

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

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

Задача: Для того чтобы перейти к следующему шагу заполнения формы в software-программе, человеку необходимо ввести число.

Так как я преимущественно занимался интерфейсами в вебе, а в software новичёк, решил посоветоваться с вами и предлагаю два варианта решения задачи. Пожалуйста, напишите какое из них верно, почему так считаете или предложите свой вариант.

 

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

Первым в этом списке я выбрал http://www.textureking.com/ — красивый и понятный дизайн сайта, а также хороший выбор текстур которые разделены на 14 категорий.

Следущим будет http://www.cgtextures.com/ — огромное количество текстур и их категорий (вожможно он и получше textureking :), вам решать.

Знаете, я всегда верю в то, что грамотный интерфейс — залог отличного приложения. Это доказано неоднократно. Но когда я вижу вот такое — меня бьет дрожь. Это — приложение, которое предназначено для работы с электронной отчетностью. То, что на дворе 2008 год, значения не имеет.

Крик души, простите.

Три наших персонажа: программист, дизайнер и клиент.

Яркие, свежие и интересные идеи по дизайну форм на сайт.

Перевод части:

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

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

Ниже мы представляем более 40 (очень) красивых примеров веб-форм, а также современные решения и творческих идей, связанных с веб-формами. Некоторые из примеров Flash-основе, однако, в большинстве случаев вы можете легко создать аналогичные проекты с чистого CSS и (X)HTML.

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

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

 



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

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

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

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

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

На тему эффективного дизайна можно привести несколько ссылок:

10 принципов эффективного веб-дизайна
Пять дизайнерских правил применяемых в Web

Это из того что вспомнилось. Рекомендуется почитать блог Дизайн пользовательских интерфейсов и юзабилити.

Это, скажем так преамбула, которую можно отнести к любому направлению дизайна. В этой статье мы поговорим о Web-дизайне и о применении Золотого Сечения и Правила Третей.

Одной из главных задач эффективного дизайна в Web – это ясность и интуитивность. А также концентрация внимания пользователя на нужных местах страницы. Как этого добиваются?

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

Но в любом случае, Вы должны быть уверены, что у пользователей присутствует ощущение баланса, порядка, гармонии и комфорта. Как раз в этом случае, применение золотого сечения становится важным этапом при разработке дизайна web-страницы.

Якоб Нильсен, гуру юзабилити, назвал десятку лучших пользовательских интерфейсов 2008 года

Итак:

1. Campaign Monitor by Eyeblaster (Израиль)

Система мониторинга и управления рекламными компаниями в интернете в реальном времени.

Сайт: www.eyeblaster.com
Демо: www.eyeblaster.com/Demo/Dashboard_demo/EditedDemo.html

2. CMSBox by CMSBox (Швейцария)

CMS

Сайт, видео: www.cmsbox.com

Привет. Сегодня я хочу вам рассказать о том, как можно изменить внешний вид файлового инпута.

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

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

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

От меня: поскольку сейчас передо мной стоит задача, непосредственно освещаемая в данной статье, то решил помимо изучения и перевести статью, поскольку считаю её полезной и грамотной. Хотелось заодно и получить Ваши замечания по переводу, язык тоже надо совершенствовать. Пожелания принимаются.

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

Таблицы тарифов должны помочь пользователю выбрать оптимальный для него тарифный план. Компания должна тщательно проанализировать свою продукцию и показать главные особенности и отличия своих тарифных планов. Посетители должны получить только ту информацию, которая действительно им нужна: возможности тарифа, особенности и стоимость. Главное правило — каждая ненужная ячейка нашей таблицы увеличивает вероятность потери потенциального клиента. Чем больше информации — тем сложнее сравнить различные тарифы и выбрать среди них лучший.

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

Сейчас я на простом примере продемонстрирую одну их наших «микроинтерфейсных» находок.

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

Перевод свеженького поста «Questions to ask clients before designing their website» Брайана Хоффа, автора блога «The Design Cubicle».

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

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

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

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

Students Calculator — это мое первое серьезное приложение, идея доведенная до конечной реализации. Это то, что определило мою текущую профессию. Смешно вспомнить, начинал я писать его в блокноте, в функциональном стиле, не зная о существовании Javadoc и даже java.util, пользуясь только исходниками других j2me приложений. (Конечно, в дальнейшем, с ростом моих навыков программа пережила 2 рефакторинга)

Программа оказалась достаточно популярной среди школьников и студентов. Ей даже была посвящена колонка в одном журнале ). Но вершиной славы было письмо из китайского представительства Моторолы с предложением включить Students Calculator в набор стандартных приложений их мобильных телефонов (Чему, к сожалению, не суждено было сбыться)

Для чего этот пост: Я уже достаточно долгое время забросил работы над программой. Для меня это достигнутая цель и сложно мотивировать себя и далее выполнять пожелания пользователей. Также я думал, что с приходом touch-телефонов придет и волна хороших тач-калькуляторов. Однако, я по-прежнему получаю письма с вопросами и предложениями, просьбой предоставить исходники… (простят меня их авторы — отвечаю я на них редко). Так вот сегодня я решил побороть лень, найти в глубине бакапов исходники и выложить их во всеобщий доступ. Теперь каждый желающий сможет продлить жизнь этому проекту.

Оффсайт: calc.motofan.ru (тут последняя версия 1.5.0 PR от 26.03.2006)
Реальная последняя версия:1.9.2 альфа от 2.4.2008
Sourceforge: sourceforge.net/projects/stdcalc/develop — исходники тут