Мазмұны
Қарындаш пен қағаздан басқа, сымсыз кадрларды жасауға арналған веб-парақтың «lo-fi» орналасуының көптеген құралдары бар, бұл визуалды дизайнға қосар алдында оның құрылымын анықтауға көмектеседі. Сымсыз кадр құралы ретінде Photoshop CS6 қолданудың бір артықшылығы - сіз сымсыз кадрды нөлден бастаудың орнына, егжей-тегжейлі макетіңіздің негізі ретінде пайдалана аласыз.
Шешім
Төмендегі суретте менің жалған клиентім ұсынған «салфетка эскизі» ашылады, бұл сымсыз кадр ұсынудың бір әдісі.
Клиентіммен көбірек сөйлескен соң, мен үй бетіне қосымша талаптар жинадым:
- Клиент тақырып пен кіріспе мәтінінен кейін «көбірек білу» батырмасын алғысы келеді.
- Оның «адамдар не айтады» деген аймағында екіден көп емес дәйексөз болады.
- Клиент фондық түске немесе ақ түсті қораптың мазмұны бар суретке ие идеяны ұнатады.
Фотошопты өртеп, нақты өлшемдерді ескеретін және сәл жылтыр көріністі қамтамасыз ететін сымсыз кадр жасайтын уақыт келді.
960 тор жүйесіне негізделген құжатты құрудан бастаңыз (бұл туралы сіз бос тарау тарауларынан табылған «Фотошопта тор орнату» бөлімінен біле аласыз), ені 1100 пиксель, биіктігі 750 пиксель. Қаласаңыз, Paint Bucket құралын қолданыңыз (G) және фонның түсі немесе кескін болатындығын білдіретін фонды ашық сұр түске толтырыңыз.
Төртбұрыш құралын таңдаңыз (U) және мазмұн аймағын бейнелейтін қорапты салыңыз. Мен 960 тор жүйесін қолданып жүргендіктен, менің қораптың ені 940 пиксель. Мен алдыңғы фонды ақ түске айналдырдым, сондықтан ол сұр фонға сәйкес келеді.
Процесті жылдамырақ ету үшін теріңіз Д. алдыңғы орынды қараға, ал фонды аққа қою. Мазмұн аймақтарын бейнелеу үшін қара жәшіктер саламыз, содан кейін бұл жерде көрсетілгендей мөлдір емес етіп сұр түске айналдырамыз:
Тордан кейін логотипті бейнелеу үшін тіктөртбұрыш қосыңыз. Тіктөртбұрышты салғаннан кейін мөлдірлік мәнін («30») теру арқылы тіктөртбұрыштың мөлдірлігін төмендетіңіз. Қаласаңыз, Type Tool көмегімен мәтін қосыңыз (Т) өріске «LOGO» мәтінін қосу керек. Шарлау аймағын бейнелеу үшін тағы бір төртбұрыш қосып, сұрғылт болу үшін қайтадан мөлдірлік мәнін төмендетіңіз.
Мазмұн бағанының аймақтарын көрсетуге көмектесетін тіктөртбұрыштар қосқыңыз келуі мүмкін. Келесі суретте мен негізгі бағанның сәл үлкенірек бағанымен және басты бет кескініне кішірек бағанмен екі бағаналы орналасу туралы шешім қабылдадым. Мен бағаналар үшін бұлыңғырлықты 10% деңгейіне қойдым, сонымен қатар парақтың төменгі жағындағы колонтитулды көрсету үшін тағы төртбұрыш қостым.
Бағандар ішіндегі мазмұн аймақтарын бейнелеу үшін тіктөртбұрыштар салыңыз. Сондай-ақ, Photoshop-тың көмегімен жалған мәтін қосқыңыз келуі мүмкін Түрі > Лорем Ипсумды қойыңыз команда. Менің аяқталған сымымды мына жерден көруге болады:
Осындай өрескел сымсыз кадр жасау клиентке мазмұнның бетте қайда болатынын түсінуге мүмкіндік береді, бірақ элементтерді жылжыту қажет болса, тез және жеңіл өңдеуге мүмкіндік береді.
Қосымша мәліметтер, мысалдар және уақытты үнемдеу бойынша ұсыныстар туралы кітапты толығырақ қараңыз (немесе кітаптың PDF үлгісін жүктеп алыңыз).
Енді Creative Bloq қарындас сайтында фотошопқа арналған ақысыз щеткалардың керемет нұсқасын қарап шығыңыз