Александр Комаров о мобильном дизайне
Post on 16-Jun-2015
821 Views
Preview:
DESCRIPTION
TRANSCRIPT
Принципы дизайна для мобильных устройств на примере АйфонаАлександр Комаров, Москва, 2009
Сегодня – только о самом важном
Как угнаться за новыми технологиями?
Как сделать хороший мобильный интерфейс?
Какие ограничения у мобильных пользователей и как их учесть?
Примеры хорошего и плохого дизайна приложений для Айфона
Cегодня вы не получите
Готовых решений (придется думать самим)
Подробной технической информации.
Супер-секретов (их нет ;-)
Советов по регистрации приложения в AppStore
Описания рабочего процесса (подходите позже, расскажу лично)
Как угнаться за новыми технологиями?
Частоты процессоров каждый год удваиваются.
Мозг человека не очень сильно изменился со времен Аристотеля.
Сфокусируйтесь на пользователях, а не на технологиях
Как сделать хороший мобильный интерфейс?
Забудьте на минутку об интерфейсах
Перестаньте ненадолго думать о мобильных телефонах...
Вспомните о пользователях.
1 2 30Придумать
само приложение
Адаптировать интерфейс под ограниченияпользователя
Учестьконтекст и окружение
Вспомнить окультуре
Как сделать хороший мобильный интерфейс? (по шагам)
0: Вы находитесь здесь
1 2 30Придумать
само приложение
Адаптировать интерфейс под ограниченияпользователя
Учестьконтекст и окружение
Вспомнить окультуре
Как сделать хороший мобильный интерфейс?
1: Ограничения пользователя
1 2 30Придумать
само приложение
Адаптировать интерфейс под ограниченияпользователя
Учестьконтекст и окружение
Вспомнить окультуре
Как сделать хороший мобильный интерфейс?
Пальцы это не курсор1: Ограничения пользователя
Сложно нажимать на маленькие объекты
iFitness App
1: Ограничения пользователя
Ограничения зрения1: Ограничения пользователя
Слишком мелкий текст1: Ограничения пользователя
Linked In -VS- Facebook1: Ограничения пользователя
Мелкий текст
Трудно нажимать на меню
Слишком много всего
Крупные иконки и надписи
Пальцем не промахнешься
Простые варианты выбора
Facebook 1.0 -VS- Facebook 3.01: Ограничения пользователя
Какой из вариантов вам кажется проще?
На мониторе все выглядит крупнее1: Ограничения пользователя
2: Контекст и окружение
1 2 3Адаптировать интерфейс под ограниченияпользователя
Учестьконтекст и окружение
Вспомнить окультуре
Как сделать хороший мобильный интерфейс?
0Придумать
само приложение
2: Контекст и окружение
Ваше приложение
Мобильное приложение — лишь капля в море
Пример приложения: диктофон2: Контекст и окружение
Apple -VS- iTalk
Кнопку записи трудно найти и нажать не попав в аварию
Кнопка записи занимающая пол-экрана очень удобная
2: Контекст и окружение
Apple -VS- iTalk
По маленькой красной полоске вверху трудно понять, что запись началась
После нажатия на кнопку записи весь интерфейс меняет цвет.
2: Контекст и окружение
Портирование приложений
Fish Tycoon на экране компьютера
Fish Tycoon на Айфоне
2: Контекст и окружение
Большой
Нельзя просто уменьшить десктопное приложение...
Микроскопический
2: Контекст и окружение
...Нужно в добавок убрать все лишнее...
Фотошоп на компьютере Фотошоп на айфоне
2: Контекст и окружение
...И оставить самое необходимое
Редактор видео на компьютере Редактор видео на айфоне
2: Контекст и окружение
2: Контекст и окружение
Нас окружают люди и у них тоже есть мобильники
Ping -VS- WhatsApp
Требуется придумать имя пользователя
Номер телефона в качестве идентефикатора пользователя
2: Контекст и окружение
2: Контекст и окружение
Новые технологии — новые способы общения
2: Контекст и окружение
Новые способы обмена данными
Mover
2: Контекст и окружение
Новые способы найти друзей
Loopt
3: Культурные различия
1 2 3Адаптировать интерфейс под ограниченияпользователя
Учестьконтекст и окружение
Вспомнить окультуре
Как сделать хороший мобильный интерфейс?
0Придумать
само приложение
3: Культурные различия
Дизайн должен учитывать культурные особенности
Спасибо!
1 2 3Адаптировать интерфейс под ограниченияпользователя
Учестьконтекст и окружение
Вспомнить окультуре
Как сделать хороший мобильный интерфейс?
0Придумать
само приложение
Меня зовут............Саша Комаров
Моя компания.......www.akomarov.com
E-mail.....................akomarov@akomarov.com
Twitter (in English)...akomarov
ЖЖ (по-русски)....lopanism.livejournal.com
Визитки на столе вот тут
top related