З останнього відео ми знаємо, що маємо розглянути п’ять основних моментів, починаючи розробку цього сайту. Ми будемо тримати їх у верхній частині розуму, рухаючись вперед.
Звичайно, ми починаємо “спочатку мобільний”, і ми почнемо з’ясовувати дизайн у Photoshop. Ми не будемо там затримуватися, але креативні інструменти у Photoshop чудово підходять для творчого мислення на початку дизайнерського проекту.
Ми відкриваємо симулятор iOS, який безкоштовно надається разом із XCode на Mac. Він призначений для тестування Інтернету та власних додатків на настільному / портативному комп’ютері. Ми просто хочемо, щоб це було швидко, щоб ми могли зробити його знімок екрана, щоб отримати контекстне полотно у Photoshop.
Для протоколу, ми не запускаємо “iPhone” спочатку, це лише маленький екран, який нам зручно розробити. Ми не будемо розробляти нічого, що занадто специфічно залежить від розміру або можливостей iPhone.
Щоб дати нам працювати з більш високого полотна (не потрібно обмежувати сайт вище “згину”), ми відрізали нижню частину телефону і перетягнули його нижче. Потім беремо тонкий зріз країв iPhone і перетягуємо їх вниз, отже, по суті, у нас є цей надзвичайно високий (але цілісний) iPhone.
Ми залишаємо путівник там, де закінчувався оригінальний екран, щоб нагадати нам, який він був великий. Так, усі прокручують. Особливо на мобільному. Але все одно приємно знати, як виглядає цей перший екран.
Файли
- # 004 - Телефон Canvas.psd.zip
- # 004 - RAW Photos.zip