Π‘ΠΎΠ΄Π΅Ρ€ΠΆΠ°Π½ΠΈΠ΅

Как быстро ΡΠΎΠ·Π΄Π°Ρ‚ΡŒ ΠΌΠ°ΠΊΠ΅Ρ‚ сайта

Π›ΡŽΠ±ΠΎΠΉ сайт начинаСтся с макСта: Π½ΡƒΠΆΠ½ΠΎΒ ΠΆΠ΅ ΠΊΠ°ΠΊ-Ρ‚ΠΎ Π²ΠΈΠ·ΡƒΠ°Π»ΡŒΠ½ΠΎ ΠΏΡ€Π΅Π΄ΡΡ‚Π°Π²ΠΈΡ‚ΡŒ сСбС Π΅Π³ΠΎ Π±ΡƒΠ΄ΡƒΡ‰ΡƒΡŽ структуру. ΠΠ°Β ΠΏΠ΅Ρ€Π²ΠΎΠ½Π°Ρ‡Π°Π»ΡŒΠ½ΠΎΠΌ этапС ΡΠΏΠ΅Ρ†ΠΈΠ°Π»ΡŒΠ½Ρ‹Π΅ инструмСнты Π½Π΅Β Π½ΡƒΠΆΠ½Ρ‹. Достаточно ΠΏΠΎΠ»ΠΎΠΆΠΈΡ‚ΡŒ ΠΏΠ΅Ρ€Π΅Π΄ собой лист Π±ΡƒΠΌΠ°Π³ΠΈ ΠΈΠ»ΠΈ Π²ΠΎΡΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚ΡŒΡΡ ΠΌΠΎΠ΄Π½Ρ‹ΠΌΠΈ ΠΈΠ½Ρ‚Π΅Π»Π»Π΅ΠΊΡ‚ΡƒΠ°Π»ΡŒΠ½Ρ‹ΠΌΠΈ ΠΊΠ°Ρ€Ρ‚Π°ΠΌΠΈ, Ρ‡Ρ‚ΠΎΠ±Ρ‹ Π²ΠΈΠ·ΡƒΠ°Π»ΠΈΠ·ΠΈΡ€ΠΎΠ²Π°Ρ‚ΡŒ, Ρ‡Ρ‚ΠΎ ΠΈΒ ΠΊΡƒΠ΄Π° Π±ΡƒΠ΄Π΅Ρ‚ вСсти. В этой ΡΡ‚Π°Ρ‚ΡŒΠ΅ мы расскаТСм Π²Π°ΠΌ ΠΏΡ€ΠΎ сСрвисы для создания ΠΌΠ°ΠΊΠ΅Ρ‚ΠΎΠ² сайтов, ΠΊΠΎΡ‚ΠΎΡ€Ρ‹Π΅ Π·Π΄ΠΎΡ€ΠΎΠ²ΠΎ ΠΎΠ±Π»Π΅Π³Ρ‡Π°ΡŽΡ‚ Тизнь.

Π‘Π°ΠΉΡ‚ начинаСтся с прототипа

Π˜Ρ‚Π°ΠΊ, Π½Π°ΠΌ Π½ΡƒΠΆΠ½ΠΎ ΡΠΎΠ·Π΄Π°Ρ‚ΡŒ ΠΌΠ°ΠΊΠ΅Ρ‚ сайта. Π‘ΡƒΠΌΠ°Π³Π° ΠΈΒ Ρ€ΡƒΡ‡ΠΊΠ°Β β€” это, ΠΊΠΎΠ½Π΅Ρ‡Π½ΠΎ, Π·Π΄ΠΎΡ€ΠΎΠ²ΠΎ, Π½ΠΎΒ Ρ…ΠΎΡ‚Π΅Π»ΠΎΡΡŒΒ Π±Ρ‹ ΠΊΠ°ΠΊ-Ρ‚ΠΎ побыстрСС ΠΏΠΎΠ»ΡƒΡ‡ΠΈΡ‚ΡŒ Π³ΠΎΡ‚ΠΎΠ²Ρ‹ΠΉ Ρ€Π΅Π·ΡƒΠ»ΡŒΡ‚Π°Ρ‚. ΠšΒ Ρ‚ΠΎΠΌΡƒΒ ΠΆΠ΅, Π½Π°Β Π±ΡƒΠΌΠ°Π³Π΅ нСльзя ΠΏΡ€ΠΎΡ‡ΡƒΠ²ΡΡ‚Π²ΠΎΠ²Π°Ρ‚ΡŒ ΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚Π΅Π»ΡŒΡΠΊΠΈΠΉ ΠΎΠΏΡ‹Ρ‚, Ρ‚Π°ΠΊ Π½Π°Π·Ρ‹Π²Π°Π΅ΠΌΡ‹ΠΉ UI/UX. Π­Ρ‚ΠΎ ΠΊΠΎΠ³Π΄Π° понятно, понравится ли ΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚Π΅Π»ΡΠΌ сайт, ΡƒΠ΄ΠΎΠ±Π½ΠΎΒ Π»ΠΈ ΠΈΠΌΒ ΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚ΡŒΡΡ, всС ли элСмСнты ΠΏΠΎΠ΄ Ρ€ΡƒΠΊΠΎΠΉ и всС Π²Β Ρ‚Π°ΠΊΠΎΠΌ Π΄ΡƒΡ…Π΅. Π§Π΅ΠΌ Π΅Ρ‰Π΅ Ρ…ΠΎΡ€ΠΎΡˆ ΠΏΡ€ΠΎΡ‚ΠΎΡ‚ΠΈΠΏ сайта:

  • Π›Π΅Π³ΠΊΠΎ Π²ΠΈΠ·ΡƒΠ°Π»ΡŒΠ½ΠΎ ΡƒΠΏΡ€ΠΎΡΡ‚ΠΈΡ‚ΡŒ ΠΏΡ€ΠΎΠ΄ΡƒΠΊΡ‚, ΡƒΠ²ΠΈΠ΄Π΅Ρ‚ΡŒ всю ΠΊΠ°Ρ€Ρ‚ΠΈΠ½Ρƒ Ρ†Π΅Π»ΠΈΠΊΠΎΠΌ и сразу ΡƒΠ±Ρ€Π°Ρ‚ΡŒ лишнСС, Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΡƒΠ±Π΅Π΄ΠΈΡ‚ΡŒΡΡ в стопроцСнтной работоспособности ΠΎΡΡ‚Π°Π²ΡˆΠ΅Π³ΠΎΡΡ. Π‘Π΅Π· ΠΏΡ€ΠΎΡ‚ΠΎΡ‚ΠΈΠΏΠ° ΠΏΡ€ΠΈΡˆΠ»ΠΎΡΡŒΒ Π±Ρ‹ ΠΎΠΏΠΈΡΡ‹Π²Π°Ρ‚ΡŒ всС ΠΈΠ΄Π΅ΠΈ словами ΠΈΠ»ΠΈ Ρ‡Π΅Ρ€Ρ‚ΠΈΡ‚ΡŒ ΠΈΡ…Β Π½Π°Β Π±ΡƒΠΌΠ°Π³Π΅.
  • Π’Ρ‹Β ΠΊΠΎΠ½Ρ†Π΅Π½Ρ‚Ρ€ΠΈΡ€ΡƒΠ΅Ρ‚Π΅ΡΡŒ Ρ‚ΠΎΠ»ΡŒΠΊΠΎ на сути сайта, Π½Π΅Β ΠΎΡ‚Π²Π»Π΅ΠΊΠ°ΡΡΡŒ Π½Π°Β ΠΌΠ΅Π»ΠΊΠΈΠ΅ Π΄Π΅Ρ‚Π°Π»ΠΈ.
  • Π‘Β Ρ…ΠΎΡ€ΠΎΡˆΠΈΠΌ ΠΏΡ€ΠΎΡ‚ΠΎΡ‚ΠΈΠΏΠΎΠΌ ΠΌΠΎΠΆΠ΅Ρ‚ Ρ€Π°Π±ΠΎΡ‚Π°Ρ‚ΡŒ Π΄Π°ΠΆΠ΅ Π΄Π°Π»Π΅ΠΊΠΈΠΉ ΠΎΡ‚Β Π΄ΠΈΠ·Π°ΠΉΠ½Π° Ρ‡Π΅Π»ΠΎΠ²Π΅ΠΊ.
  • МоТно ΡΠ»Π΅ΠΏΠΈΡ‚ΡŒ ΠΏΡ€ΠΎΡ‚ΠΎΡ‚ΠΈΠΏ из кусков, позаимствованных с других сайтов.

Б пользой прототипирования ΠΎΠΏΡ€Π΅Π΄Π΅Π»ΠΈΠ»ΠΈΡΡŒ, двигаСмся дальшС, к инструмСнтам, ΠΆΠ΅Π»Π°Ρ‚Π΅Π»ΡŒΠ½ΠΎ бСсплатным.

БСсплатныС инструмСнты для создания ΠΏΡ€ΠΎΡ‚ΠΎΡ‚ΠΈΠΏΠΎΠ²

ΠœΡ‹Β Π²Π½ΠΈΠΌΠ°Ρ‚Π΅Π»ΡŒΠ½ΠΎ ΠΈΠ·ΡƒΡ‡ΠΈΠ»ΠΈ ΡΠ΅Ρ‚ΡŒ ΠΈΒ Π²ΠΎΡ‚ ΠΊΒ ΠΊΠ°ΠΊΠΎΠΌΡƒ Π²Ρ‹Π²ΠΎΠ΄Ρƒ ΠΏΡ€ΠΈΡˆΠ»ΠΈ: бСсплатныС инструмСнты Π΅ΡΡ‚ΡŒ, Ρ‡Ρ‚ΠΎ Π½Π΅Β ΠΌΠΎΠΆΠ΅Ρ‚ Π½Π΅Β Ρ€Π°Π΄ΠΎΠ²Π°Ρ‚ΡŒ, но большая ΠΈΡ…Β Ρ‡Π°ΡΡ‚ΡŒΒ β€” на английском языкС. Если вы с ним Π½Π΅Β Π΄Ρ€ΡƒΠΆΠΈΡ‚Π΅, Π±ΡƒΠ΄Π΅Ρ‚ довольно Ρ‚Ρ€ΡƒΠ΄Π½ΠΎ ΠΏΠΎΠ³Ρ€ΡƒΠ·ΠΈΡ‚ΡŒΡΡ Π²Β ΠΏΡ€Π΅Π΄ΠΌΠ΅Ρ‚. Если инструмСнты на нашСм Ρ€ΠΎΠ΄Π½ΠΎΠΌ языкС Π΅ΡΡ‚ΡŒ в сСти, Π±ΡƒΠ΄ΡŒΡ‚Π΅ Π»ΡŽΠ±Π΅Π·Π½Ρ‹, Π΄Π°ΠΉΡ‚Π΅ Π½Π°ΠΌ Π·Π½Π°Ρ‚ΡŒ в коммСнтариях. Π›ΡŽΠ±ΠΎΠΏΡ‹Ρ‚Π½ΠΎΒ ΠΆΠ΅.

Π‘ΠΎΠ·Π΄Π°Ρ‚ΡŒ ΠΌΠ°ΠΊΠ΅Ρ‚ сайта бСсплатно ΠΏΠΎΠΌΠΎΠΆΠ΅Ρ‚, Π½Π°ΠΏΡ€ΠΈΠΌΠ΅Ρ€, wireframe.cc. ΠžΠ½Β ΠΌΠΈΠ½ΠΈΠΌΠ°Π»ΠΈΡΡ‚ΠΈΡ‡Π΅Π½ и прост в использовании: ΠΊΠ»ΠΈΠΊΠ°Π΅Ρ‚Π΅ ΠΌΡ‹ΡˆΠΊΠΎΠΉ, тянСтС ΠΏΡ€ΡΠΌΠΎΡƒΠ³ΠΎΠ»ΡŒΠ½ΠΈΠΊΒ β€” и создаСтС Π½ΡƒΠΆΠ½Ρ‹ΠΉ элСмСнт. На бСсплатном Ρ‚Π°Ρ€ΠΈΡ„Π΅ шаблонов ΠΌΠ°Π»ΠΎ, ΠΌΠΎΠΆΠ½ΠΎ на сСмь Π΄Π½Π΅ΠΉ Π²ΠΎΡΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚ΡŒΡΡ прСимущСствами ΠΏΠ»Π°Ρ‚Π½ΠΎΠ³ΠΎ Ρ‚Π°Ρ€ΠΈΡ„Π°.

БСрвис Wires Π΅Ρ‰Π΅ ΠΏΡ€ΠΎΡ‰Π΅Β β€” ΠΏΡ€Π°Π²Π΄Π°, сначала придСтся Π·Π°Ρ€Π΅Π³ΠΈΡΡ‚Ρ€ΠΈΡ€ΠΎΠ²Π°Ρ‚ΡŒΡΡ. В бСсплатном Ρ€Π΅ΠΆΠΈΠΌΠ΅ ΠΌΠΎΠΆΠ½ΠΎ ΡΠΎΠ·Π΄Π°Ρ‚ΡŒ Ρ‚Ρ€ΠΈ ΠΏΡ€ΠΎΠ΅ΠΊΡ‚Π°Β β€” это ΠΎΡ‡Π΅Π½ΡŒ ΠΌΠ½ΠΎΠ³ΠΎ ΠΏΠΎΒ ΡΡ€Π°Π²Π½Π΅Π½ΠΈΡŽ со всСми Π΄Ρ€ΡƒΠ³ΠΈΠΌΠΈ инструмСнтами. БСсплатная Π±ΠΈΠ±Π»ΠΈΠΎΡ‚Π΅ΠΊΠ°, Π²ΠΏΠΎΠ»Π½Π΅ ΠΎΠΆΠΈΠ΄Π°Π΅ΠΌΠΎ, минимальна.

БСрвис InVision App, судя ΠΏΠΎΒ ΠΎΡ‚Π·Ρ‹Π²Π°ΠΌ, довольно ΠΌΠΎΡ‰Π½Ρ‹ΠΉΒ β€” ΠΏΠΈΡˆΡƒΡ‚, Ρ‡Ρ‚ΠΎ Π³ΠΎΡ‚ΠΎΠ²Ρ‹ΠΉ ΠΏΡ€ΠΎΡ‚ΠΎΡ‚ΠΈΠΏ получаСтся Π½Π°ΡΡ‚ΠΎΠ»ΡŒΠΊΠΎ Ρ…ΠΎΡ€ΠΎΡˆΠΈΠΌ, Ρ‡Ρ‚ΠΎ Π³ΠΎΡ‚ΠΎΠ² к вСрсткС. ΠžΠ±Π»Π°Ρ‡Π½Ρ‹ΠΉ сСрвис в основном ΠΎΡ€ΠΈΠ΅Π½Ρ‚ΠΈΡ€ΠΎΠ²Π°Π½ на созданиС ΠΌΠΎΠ±ΠΈΠ»ΡŒΠ½Ρ‹Ρ… ΠΏΡ€ΠΈΠ»ΠΎΠΆΠ΅Π½ΠΈΠΉ, Ρ‡Ρ‚ΠΎ, Π²Β ΠΎΠ±Ρ‰Π΅ΠΌ-Ρ‚ΠΎ, Ρ‚ΠΎΠΆΠ΅ Π°ΠΊΡ‚ΡƒΠ°Π»ΡŒΠ½ΠΎ.

БСрвис Moqups ΠΏΡ€Π΅Π΄Π»Π°Π³Π°Π΅Ρ‚ ΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚Π΅Π»ΡΠΌ бСсплатный Ρ‚Π°Ρ€ΠΈΡ„, ΠΏΠΎΒ ΠΊΠΎΡ‚ΠΎΡ€ΠΎΠΌΡƒ ΠΌΠΎΠΆΠ½ΠΎ Ρ€Π°Π±ΠΎΡ‚Π°Ρ‚ΡŒ Ρ‚ΠΎΠ»ΡŒΠΊΠΎ с одним ΠΏΡ€ΠΎΠ΅ΠΊΡ‚ΠΎΠΌ ΠΈΒ ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚ΡŒ Π΄ΠΎΒ 300 элСмСнтов. Если Π²Ρ‹Β Π½Π΅Β ΠΏΠ»Π°Π½ΠΈΡ€ΡƒΠ΅Ρ‚Π΅ ΠΎΠ±ΠΎΠΉΡ‚ΠΈ по популярности Apple, этого количСства Π²ΠΏΠΎΠ»Π½Π΅ ΠΌΠΎΠΆΠ΅Ρ‚ Ρ…Π²Π°Ρ‚ΠΈΡ‚ΡŒ.

РСзюмС: к плюсам сСрвисов ΠΌΠΎΠΆΠ½ΠΎ отнСсти простоту ΠΈΡ…Β ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Π½ΠΈΡΒ β€” Π½Π΅Β Π½ΡƒΠΆΠ½ΠΎ ΠΎΠ±Π»Π°Π΄Π°Ρ‚ΡŒ Π½Π°Π²Ρ‹ΠΊΠ°ΠΌΠΈ Π΄ΠΈΠ·Π°ΠΉΠ½Π΅Ρ€Π°, Ρ‡Ρ‚ΠΎΠ±Ρ‹ во всСм Ρ€Π°Π·ΠΎΠ±Ρ€Π°Ρ‚ΡŒΡΡ. ΠœΠΈΠ½ΡƒΡΡ‹Β β€” Π½ΡƒΠΆΠ΅Π½ язык Π½Π°Β Π±ΠΎΠ»Π΅Π΅-ΠΌΠ΅Π½Π΅Π΅ ΠΏΡ€ΠΈΠ»ΠΈΡ‡Π½ΠΎΠΌ ΡƒΡ€ΠΎΠ²Π½Π΅ ΠΈΠ»ΠΈ ΠΈΠ½Ρ‚ΡƒΠΈΡ‚ΠΈΠ²Π½ΠΎΠ΅ ΠΏΠΎΠ½ΠΈΠΌΠ°Π½ΠΈΠ΅ вопроса (Ρ‚Π°ΠΊΠΎΠ΅ Ρ‚ΠΎΠΆΠ΅ Π²ΠΎΠ·ΠΌΠΎΠΆΠ½ΠΎ). БСсплатныС Ρ‚Π°Ρ€ΠΈΡ„Ρ‹ ΠΏΡ€Π΅Π΄Π»Π°Π³Π°ΡŽΡ‚ усСчСнный Ρ„ΡƒΠ½ΠΊΡ†ΠΈΠΎΠ½Π°Π», Π½ΠΎΒ Π½Π°Β ΠΏΠ΅Ρ€Π²Ρ‹Ρ… ΠΏΠΎΡ€Π°Ρ…, в качСствС Β«ΠΏΡ€ΠΎΠ±Ρ‹ ΠΏΠ΅Ρ€Π°Β» этого Π²ΠΏΠΎΠ»Π½Π΅ Ρ…Π²Π°Ρ‚ΠΈΡ‚. Π”Π΅Ρ€Π·Π°ΠΉΡ‚Π΅, ΠΏΡ€ΠΎΠ±ΡƒΠΉΡ‚Π΅ свои силы!

Π¨Π°Π±Π»ΠΎΠ½ сайта Π²Β Photoshop

Π¨Π°Π±Π»ΠΎΠ½ сайта ΠΌΠΎΠΆΠ½ΠΎ Π½Π°Ρ€ΠΈΡΠΎΠ²Π°Ρ‚ΡŒ и в популярной дизайнСрской ΠΏΡ€ΠΎΠ³Ρ€Π°ΠΌΠΌΠ΅. ΠŸΡ€Π°Π²Π΄Π°, Π»ΡŽΠ±ΠΈΠΌΡ‹ΠΉ всСми Π΄ΠΈΠ·Π°ΠΉΠ½Π΅Ρ€Π°ΠΌΠΈ ΠΏΡ€ΠΎΠ΄ΡƒΠΊΡ‚ в России нС распространяСтся for freeΒ β€” придСтся ΠΊΡƒΠΏΠΈΡ‚ΡŒ ΠΏΠ°ΠΊΠ΅Ρ‚. И, чСстно говоря, Ρ‚Ρ€ΡƒΠ΄Π½ΠΎ ΡΠΊΠ°Π·Π°Ρ‚ΡŒ, Ρ‡Ρ‚ΠΎ Π»Π΅Π³Ρ‡Π΅Β β€” Ρ€Π°Π·ΠΎΠ±Ρ€Π°Ρ‚ΡŒΡΡ Π²Β Β«Ρ„ΠΎΡ‚ΠΎΡˆΠΎΠΏΠ΅Β» ΠΈΠ»ΠΈ Π²Ρ‹ΡƒΡ‡ΠΈΡ‚ΡŒ английский, Ρ‡Ρ‚ΠΎΠ±Ρ‹ Ρ€Π°Π±ΠΎΡ‚Π°Ρ‚ΡŒ с заграничными сСрвисами. ВсС эти Β«Π²Ρ‹Ρ€Π΅Π·Π°Ρ‚ΡŒΒ», Β«Π²ΡΡ‚Π°Π²ΠΈΡ‚ΡŒΒ», Β«Π½Π°Π»ΠΎΠΆΠΈΡ‚ΡŒ слой» ΠΈΒ ΠΏΡ€ΠΎΡ‡Π΅Π΅Β β€” для ΠΊΠΎΠ³ΠΎ-Ρ‚ΠΎ ΠΌΠΎΠ³ΡƒΡ‚ ΠΎΠΊΠ°Π·Π°Ρ‚ΡŒΡΡ слишком слоТными.

Π¨Π°Π±Π»ΠΎΠ½ на сайтС-конструкторС

Если Π²Ρ‹ΡˆΠ΅ΠΎΠΏΠΈΡΠ°Π½Π½Ρ‹Π΅ Π²Π°Ρ€ΠΈΠ°Π½Ρ‚Ρ‹ использования сСрвисов ΠΈΒ Ρ€Π΅Π΄Π°ΠΊΡ‚ΠΎΡ€ΠΎΠ² каТутся Π²Π°ΠΌ слишком слоТным, всСгда ΠΌΠΎΠΆΠ½ΠΎ ΠΏΠΎΠΉΡ‚ΠΈ по простому ΠΏΡƒΡ‚ΠΈ ΠΈΒ ΡΠΎΠ·Π΄Π°Ρ‚ΡŒ шаблон сайта ΡΒ ΠΏΠΎΠΌΠΎΡ‰ΡŒΡŽ конструктора. НапримСр, ΡƒΒ 1C-UMIΒ Π½Π΅ просто ΠΌΠ½ΠΎΠ³ΠΎ, Π°Β ΠΎΡ‡Π΅Π½ΡŒ ΠΌΠ½ΠΎΠ³ΠΎ Π³ΠΎΡ‚ΠΎΠ²Ρ‹Ρ… шаблонов сайтов. ВсС ΡƒΠΆΠ΅ ΠΏΡ€ΠΈΠ΄ΡƒΠΌΠ°Π½ΠΎ за вас нашими Π΄ΠΈΠ·Π°ΠΉΠ½Π΅Ρ€Π°ΠΌΠΈ, спСциалистами ΠΏΠΎΒ ΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚Π΅Π»ΡŒΡΠΊΠΎΠΌΡƒ ΠΎΠΏΡ‹Ρ‚Ρƒ ΠΈΒ ΠΏΡ€ΠΎΡ‡ΠΈΠΌ ΡƒΠΌΠ½Ρ‹ΠΌ Π½Π°Ρ€ΠΎΠ΄ΠΎΠΌ. Π’Π°ΠΌ остаСтся ΠΏΡ€ΠΈΠ΄ΡƒΠΌΠ°Ρ‚ΡŒ ΠΊΠΎΠ½Ρ‚Π΅Π½Ρ‚ ΠΈΒ Π½Π°ΠΏΠΎΠ»Π½ΠΈΡ‚ΡŒ им сайт. Π¨Π°Π±Π»ΠΎΠ½Ρ‹ ΠΌΠΎΠΆΠ½ΠΎ ΠΏΠΎΡΠΌΠΎΡ‚Ρ€Π΅Ρ‚ΡŒ Π±Π΅Π· рСгистрации: сначала ΠΈΠ·ΡƒΡ‡Π°Π΅Ρ‚Π΅ наши ΡˆΠ°Π±Π»ΠΎΠ½Ρ‹, ΠΏΠΎΡ‚ΠΎΠΌ ΠΏΡ€ΠΈΠ½ΠΈΠΌΠ°Π΅Ρ‚Π΅ Ρ€Π΅ΡˆΠ΅Π½ΠΈΠ΅, с нами Π²Ρ‹Β ΠΈΠ»ΠΈ Π½Π΅Ρ‚.

Волько Π²Π°ΠΌ Ρ€Π΅ΡˆΠ°Ρ‚ΡŒ, Π½Π°Β Ρ‡Π΅ΠΌ ΠΎΡΡ‚Π°Π½ΠΎΠ²ΠΈΡ‚ΡŒ Π²Ρ‹Π±ΠΎΡ€ ΠΈΒ ΠΊΠ°ΠΊ ΡΠ΄Π΅Π»Π°Ρ‚ΡŒ ΠΌΠ°ΠΊΠ΅Ρ‚ сайта: быстро ΡΒ ΠΏΠΎΠΌΠΎΡ‰ΡŒΡŽ Π³ΠΎΡ‚ΠΎΠ²Ρ‹Ρ… шаблонов конструктора ΠΈΠ»ΠΈ Π΄ΠΎΠ»Π³ΠΎ и с пСрспСктивой Π³Π»ΡƒΠ±ΠΎΠΊΠΎΠ³ΠΎ погруТСния в английский ΠΈΒ Π½ΡŽΠ°Π½ΡΡ‹ прототипирования. Π’Β Π»ΡŽΠ±ΠΎΠΌ случаС ΠΆΠ΅Π»Π°Π΅ΠΌ Π²Π°ΠΌ успСхов на этом ΠΏΠΎΠΏΡ€ΠΈΡ‰Π΅, ΠΈΒ ΠΏΠΎΠΌΠ½ΠΈΡ‚Π΅, вы всСгда ΠΌΠΎΠΆΠ΅Ρ‚Π΅ ΠΎΠ±Ρ€Π°Ρ‚ΠΈΡ‚ΡŒΡΡ к профСссионалам ΠΈΒ ΠΏΠΎΠ»ΡƒΡ‡ΠΈΡ‚ΡŒ Π±Ρ‹ΡΡ‚Ρ€ΡƒΡŽ ΠΏΠΎΠΌΠΎΡ‰ΡŒ.

Как ΡΠ΄Π΅Π»Π°Ρ‚ΡŒ Π΄ΠΈΠ·Π°ΠΉΠ½ сайта Π² Ρ„ΠΎΡ‚ΠΎΡˆΠΎΠΏΠ΅ с нуля – Π‘Π»ΠΎΠ³ opengs.ru

Π”ΠΈΠ·Π°ΠΉΠ½ это ΠΎΠ΄ΠΈΠ½ ΠΈΠ· этапов Π² процСссС создания сайта. ΠžΡ‚ Ρ‚ΠΎΠ³ΠΎ ΠΊΠ°ΠΊ Π±ΡƒΠ΄Π΅Ρ‚ Π²Ρ‹Π³Π»ΡΠ΄Π΅Ρ‚ΡŒ сайт зависит ΠΏΠ΅Ρ€Π²ΠΎΠ΅ Π²ΠΏΠ΅Ρ‡Π°Ρ‚Π»Π΅Π½ΠΈΠ΅ посСтитСля, ΠΊΠΎΠΌΡ„ΠΎΡ€Ρ‚ прСбывания ΠΈ удобство пользования сайтом. Π‘Ρ‚Π°Ρ‚ΡŒΡ Π½Π΅ описываСт основы Π΄ΠΈΠ·Π°ΠΉΠ½Π°, ΠΈΡ… ΠΌΠΎΠΆΠ½ΠΎ ΠΏΠΎΡ‡Π΅Ρ€ΠΏΠ½ΡƒΡ‚ΡŒ ΠΈΠ· ΡΠΎΠΎΡ‚Π²Π΅Ρ‚ΡΡ‚Π²ΡƒΡŽΡ‰Π΅ΠΉ Π»ΠΈΡ‚Π΅Ρ€Π°Ρ‚ΡƒΡ€Ρ‹. Π‘Ρ‚Π°Ρ‚ΡŒΡ описываСт сам процСсс ΠΈ Π½Π΅ΠΊΠΎΡ‚ΠΎΡ€Ρ‹Π΅ Π΅Π³ΠΎ тонкости. ΠšΠΎΠ½Π΅Ρ‡Π½Ρ‹ΠΉ Ρ€Π΅Π·ΡƒΠ»ΡŒΡ‚Π°Ρ‚ ΠΊΠΎΡ‚ΠΎΡ€ΠΎΠ³ΠΎ ΠΌΠΎΠΆΠ½ΠΎ Π½Π°ΠΉΡ‚ΠΈ Π² ΠΊΠΎΠ½Ρ†Π΅ страницы.

БущСствуСт ΠΌΠ½ΠΎΠ³ΠΎ ΠΏΡ€ΠΎΠ³Ρ€Π°ΠΌΠΌ для создания Π΄ΠΈΠ·Π°ΠΉΠ½Π°, Π² Ρ‚ΠΎΠΌ числС ΠΈ для сайта. Однако Π² Π΄Π°Π½Π½ΠΎΠΉ ΡΡ‚Π°Ρ‚ΡŒΠ΅ я Ρ€Π°ΡΡΠΌΠΎΡ‚Ρ€ΡŽ, ΠΊΠ°ΠΊ ΡΠ΄Π΅Π»Π°Ρ‚ΡŒ Π΄ΠΈΠ·Π°ΠΉΠ½ сайта Π² Ρ„ΠΎΡ‚ΠΎΡˆΠΎΠΏΠ΅ с нуля своими Ρ€ΡƒΠΊΠ°ΠΌΠΈ. Π’Π°ΠΊ ΠΊΠ°ΠΊ ΡΡ‡ΠΈΡ‚Π°ΡŽ, Ρ‡Ρ‚ΠΎ ΠΈΠΌΠ΅Π½Π½ΠΎ эта ΠΏΡ€ΠΎΠ³Ρ€Π°ΠΌΠΌΠ° Π½Π°ΠΈΠ±ΠΎΠ»Π΅Π΅ ΡƒΠ΄ΠΎΠ±Π½Π° для этой Ρ†Π΅Π»ΠΈ.

Π’ ΡΡ‚Π°Ρ‚ΡŒΠ΅ ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΡŽΡ‚ΡΡ названия инструмСнтов ΠΈ Ρ‚Π΅Ρ€ΠΌΠΈΠ½Ρ‹ описаниС, ΠΊΠΎΡ‚ΠΎΡ€Ρ‹Ρ… Π½Π΅ Ρ€Π΅Π°Π»ΡŒΠ½ΠΎ Π²ΠΊΠ»ΡŽΡ‡ΠΈΡ‚ΡŒ Π² Π΄Π°Π½Π½Ρ‹ΠΉ ΠΌΠ°Ρ‚Π΅Ρ€ΠΈΠ°Π» ΠΈΠ· Π·Π° объСма. ΠŸΠΎΡΡ‚ΠΎΠΌΡƒ Ссли Ρ‚Ρ‹ Π²ΠΏΠ΅Ρ€Π²Ρ‹Π΅ ΠΎΡ‚ΠΊΡ€Ρ‹Π»(Π°) эту ΠΏΡ€ΠΎΠ³Ρ€Π°ΠΌΠΌΡƒ, Ρ‚ΠΎ Π½ΡƒΠΆΠ½ΠΎ сначала ΠΈΠ·ΡƒΡ‡ΠΈΡ‚ΡŒ Π°Π·Ρ‹ Ρ€Π°Π±ΠΎΡ‚Ρ‹ с Π½Π΅ΠΉ.Β Π•Ρ‰Π΅ Ρ€Π΅ΠΊΠΎΠΌΠ΅Π½Π΄ΡƒΡŽ ознакомится с ΠΌΠ°Ρ‚Π΅Ρ€ΠΈΠ°Π»Π°ΠΌΠΈ Ρ€Π°Π·Π΄Π΅Π»Π° β€œPhotoshopβ€œ.

Π‘ΠΎΠ·Π΄Π°Π½ΠΈΠ΅ ΠΈ ΠΏΠΎΠ΄Π³ΠΎΡ‚ΠΎΠ²ΠΊΠ° Ρ„Π°ΠΉΠ»Π° ΠΏΡ€ΠΎΠ΅ΠΊΡ‚Π°

Для Π½Π°Ρ‡Π°Π»Π° Π½ΡƒΠΆΠ½ΠΎ ΠΎΡ‚ΠΊΡ€Ρ‹Ρ‚ΡŒ Ρ„ΠΎΡ‚ΠΎΡˆΠΎΠΏ, ΠΊΠ»ΠΈΠΊΠ½ΡƒΡ‚ΡŒ Π² Π»Π΅Π²ΠΎΠΌ Π²Π΅Ρ€Ρ…Π½Π΅ΠΌ мСню ΠΏΡ€ΠΎΠ³Ρ€Π°ΠΌΠΌΡ‹ β€œΠ€Π°ΠΉΠ» > Π‘ΠΎΠ·Π΄Π°Ρ‚ΡŒβ€. И Π½Π°ΡΡ‚Ρ€ΠΎΠΈΡ‚ΡŒ Π½ΠΎΠ²Ρ‹ΠΉ Ρ„Π°ΠΉΠ» ΡΠ»Π΅Π΄ΡƒΡŽΡ‰ΠΈΠΌ ΠΎΠ±Ρ€Π°Π·ΠΎΠΌ:

  1. Π”Π°Ρ‚ΡŒ имя своСму ΠΌΠ°ΠΊΠ΅Ρ‚Ρƒ, Ρƒ мСня Π½Π° ΠΏΡ€ΠΈΠΌΠ΅Ρ€Π΅ β€œmysiteβ€œ
  2. Π¨ΠΈΡ€ΠΈΠ½Ρƒ Ρ€Π΅ΠΊΠΎΠΌΠ΅Π½Π΄ΡƒΡŽ Π²Ρ‹Π±Ρ€Π°Ρ‚ΡŒ Π² зависимости ΠΎΡ‚ Ρ€Π°Π·Ρ€Π΅ΡˆΠ΅Π½ΠΈΡ ΠΌΠΎΠ½ΠΈΡ‚ΠΎΡ€Π° минус 20px. Π£ мСня Ρ€Π°Π·Ρ€Π΅ΡˆΠ΅Π½ΠΈΠ΅ 1440Ρ…900px. А высоту ΡΠ΄Π΅Π»Π°Ρ‚ΡŒ 1200px, ΠΏΡ€ΠΈ нСобходимости Π² Π±ΡƒΠ΄ΡƒΡ‰Π΅ΠΌ ΠΌΠΎΠΆΠ½ΠΎ Π±ΡƒΠ΄Π΅Ρ‚ Π΅Π΅ ΡƒΠ²Π΅Π»ΠΈΡ‡ΠΈΡ‚ΡŒ.
  3. Π•Π΄ΠΈΠ½ΠΈΡ†Ρ‹ измСрСния установи Π² β€œΠŸΠΈΠΊΡΠ΅Π»ΡΡ…β€œ. Π Π°Π·Ρ€Π΅ΡˆΠ΅Π½ΠΈΠ΅ β€œ72” ПиксСли/дюйм.
  4. Π–ΠΌΠΈ β€œOK”. И сохраняй Π΅Π³ΠΎ ΠΊΠ°ΠΊ psd β€œΠ€Π°ΠΉΠ» > Π‘ΠΎΡ…Ρ€Π°Π½ΠΈΡ‚ΡŒ как…” Π² Π½ΡƒΠΆΠ½ΠΎΠΉ ΠΏΠ°ΠΏΠΊΠ΅.

Π‘ΠΎΠ·Π΄Π°ΠΉ Π½ΠΎΠ²Ρ‹ΠΉ слой ΠΈ сдСлай Π΅Π³ΠΎ Π°ΠΊΡ‚ΠΈΠ²Π½Ρ‹ΠΌ. Π’Ρ‹Π±Π΅Ρ€ΠΈ инструмСнт β€œΠŸΡ€ΡΠΌΠΎΡƒΠ³ΠΎΠ»ΡŒΠ½ΠΈΠΊβ€œ,  установи Π² ΠΏΠ°Ρ€Π°ΠΌΠ΅Ρ‚Ρ€Π°Ρ… инструмСнта Π·Π½Π°Ρ‡Π΅Π½ΠΈΠ΅ β€œΠŸΠΈΠΊΡΠ΅Π»ΠΈβ€ Β ΠΈ создайтС ΠΏΡ€ΡΠΌΠΎΡƒΠ³ΠΎΠ»ΡŒΠ½ΠΈΠΊ Ρ€Π°Π·ΠΌΠ΅Ρ€ΠΎΠΌ 1000Ρ…1200px (Π΅Π³ΠΎ Π·Π°Π»ΠΈΠ²ΠΊΠ° Π±ΡƒΠ΄Π΅Ρ‚ Π·Π°Π²ΠΈΡΠ΅Ρ‚ΡŒ ΠΎΡ‚ Ρ‚ΠΎΠ³ΠΎ, ΠΊΠ°ΠΊΠΎΠΉ Ρ†Π²Π΅Ρ‚ Ρ„ΠΎΠ½Π° Π²Ρ‹Π±Ρ€Π°Π½ основным).

Π’Π΅ΠΏΠ΅Ρ€ΡŒ слой с ΠΏΡ€ΡΠΌΠΎΡƒΠ³ΠΎΠ»ΡŒΠ½ΠΈΠΊΠΎΠΌ Π½ΡƒΠΆΠ½ΠΎ Ρ€Π°Π·ΠΌΠ΅ΡΡ‚ΠΈΡ‚ΡŒ ΠΏΠΎ Ρ†Π΅Π½Ρ‚Ρ€Ρƒ холста. ΠΈ ΡƒΡΡ‚Π°Π½ΠΎΠ²ΠΈΡ‚ΡŒ Π½Π°ΠΏΡ€Π°Π²Π»ΡΡŽΡ‰ΠΈΠ΅ ΠΏΠΎ краям. ΠΠ°ΠΏΡ€Π°Π²Π»ΡΡŽΡ‰ΠΈΠ΅ ΠΈΠΌΠ΅ΡŽΡ‚ ΠΏΠΎΠ»Π΅Π·Π½ΠΎΠ΅ свойство ΠΏΡ€ΠΈΠ»ΠΈΠΏΠ°Ρ‚ΡŒ ΠΊ Π³Ρ€Π°Π½ΠΈΡ†Π°ΠΌ Π°ΠΊΡ‚ΠΈΠ²Π½ΠΎΠ³ΠΎ слоя.

Π’Π΅ΠΏΠ΅Ρ€ΡŒ Π½ΡƒΠΆΠ½ΠΎ ΡƒΡΡ‚Π°Π½ΠΎΠ²ΠΈΡ‚ΡŒ отступы Π²Π½ΡƒΡ‚Ρ€ΠΈ ΠΏΡ€ΡΠΌΠΎΡƒΠ³ΠΎΠ»ΡŒΠ½ΠΈΠΊΠ° ΠΈ ΠΏΠΎΡΡ‚Π°Π²ΠΈΡ‚ΡŒ Π½Π°ΠΏΡ€Π°Π²Π»ΡΡŽΡ‰ΠΈΠ΅. Для этого я ΠΏΠΎΠ»ΡŒΠ·ΡƒΡŽΡΡŒ инструмСнтом для выдСлСния β€œΠŸΡ€ΡΠΌΠΎΡƒΠ³ΠΎΠ»ΡŒΠ½Π°Ρ ΠΎΠ±Π»Π°ΡΡ‚ΡŒβ€œ. А ΠΈΠΌΠ΅Π½Π½ΠΎ создаю Π²Ρ‹Π΄Π΅Π»Π΅Π½Π½ΡƒΡŽ ΠΎΠ±Π»Π°ΡΡ‚ΡŒ Π½ΡƒΠΆΠ½ΠΎΠ³ΠΎ Ρ€Π°Π·ΠΌΠ΅Ρ€Π°, ΠΏΠ΅Ρ€Π΅Ρ‚Π°ΡΠΊΠΈΠ²Π°ΡŽ Π΅Π΅ Π² Π½ΡƒΠΆΠ½ΠΎΠ΅ ΠΌΠ½Π΅ мСсто ΠΈ тяну Π½Π°ΠΏΡ€Π°Π²Π»ΡΡŽΡ‰ΡƒΡŽ ΠΏΠΎΠΊΠ° ΠΎΠ½Π° Π½ΠΈ ΠΏΡ€ΠΈΠ»ΠΈΠΏΠ°Π΅Ρ‚ ΠΊ ΠΊΡ€Π°ΡŽ Π²Ρ‹Π΄Π΅Π»Π΅Π½Π½ΠΎΠΉ области. ΠžΠ±Ρ‹Ρ‡Π½ΠΎ я ΡƒΡΡ‚Π°Π½Π°Π²Π»ΠΈΠ²Π°ΡŽ отступы 15-20px.

ΠŸΠΎΠ»ΡƒΡ‡ΠΈΡ‚ΡΡ Π²ΠΎΡ‚ Ρ‚Π°ΠΊ:

ВсС ΠΏΠ΅Ρ€Π²ΠΎΠ½Π°Ρ‡Π°Π»ΡŒΠ½Π°Ρ настройка ΠΌΠ°ΠΊΠ΅Ρ‚Π° ΠΎΠΊΠΎΠ½Ρ‡Π΅Π½Π°.

Π Π΅ΠΊΠΎΠΌΠ΅Π½Π΄ΡƒΡŽ ΡΠΎΡ…Ρ€Π°Π½ΠΈΡ‚ΡŒ Π΅Π³ΠΎ ΠΊΠ°ΠΊ шаблон ΠΈ ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚ΡŒ ΠΊΠ°ΠΆΠ΄Ρ‹ΠΉ Ρ€Π°Π· ΠΊΠΎΠ³Π΄Π° потрСбуСтся ΠΌΠ°ΠΊΠ΅Ρ‚ Ρ‚Π°ΠΊΠΎΠ³ΠΎ Ρ‚ΠΈΠΏΠ°.

Π‘ΠΎΡ…Ρ€Π°Π½ΠΈ, Ρ‚ΠΎ Ρ‡Ρ‚ΠΎ ΠΏΠΎΠ»ΡƒΡ‡ΠΈΠ»ΠΎΡΡŒ β€œΠ€Π°ΠΉΠ» -> Π‘ΠΎΡ…Ρ€Π°Π½ΠΈΡ‚ΡŒ для Web -> PNG-24”

Π’Π΅ΠΏΠ΅Ρ€ΡŒ ΠΎΡ‚ΠΊΡ€ΠΎΠΉ Π² ΠΏΡ€ΠΎΠ²ΠΎΠ΄Π½ΠΈΠΊΠ΅ ΠΈΠ»ΠΈ Ρ„Π°ΠΉΠ»ΠΎΠ²ΠΎΠΌ ΠΌΠ΅Π½Π΅Π΄ΠΆΠ΅Ρ€Π΅ ΠΏΠ°ΠΏΠΊΡƒ с сохранСнным Ρ„Π°ΠΉΠ»ΠΎΠΌ:

  1. ΠŸΡ€Π°Π²Ρ‹ΠΉ ΠΊΠ»ΠΈΠΊ Π½Π° Ρ„Π°ΠΉΠ»Π΅
  2. Π’ контСкстном мСню β€œΠžΡ‚ΠΊΡ€Ρ‹Ρ‚ΡŒ с ΠΏΠΎΠΌΠΎΡ‰ΡŒΡŽβ€
  3. Π’Ρ‹Π±Π΅Ρ€ΠΈ Π±Ρ€Π°ΡƒΠ·Π΅Ρ€ ΠΊΠΎΡ‚ΠΎΡ€Ρ‹ΠΌ ΠΏΠΎΠ»ΡŒΠ·ΡƒΠ΅Ρ‚Π΅ΡΡŒ (Ρƒ мСня hrome).
  4. ПослС Ρ‚ΠΎΠ³ΠΎ ΠΊΠ°ΠΊ ΠΈΠ·ΠΎΠ±Ρ€Π°ΠΆΠ΅Π½ΠΈΠ΅ откроСтся Π½Π°Π²Π΅Π΄ΠΈ Π½Π° Π½Π΅Π³ΠΎ курсор, ΠΎΠ½ смСнится Π½Π° Π»ΡƒΠΏΡƒ с плюсиком
  5. Кликни ΠΎΠ΄ΠΈΠ½ Ρ€Π°Π· для отобраТСния изобраТСния Π² ΠΏΠΎΠ»Π½Ρ‹ΠΉ Ρ€Π°Π·ΠΌΠ΅Ρ€.

Π’Π΅ΠΏΠ΅Ρ€ΡŒ ΠΌΠΎΠΆΠ½ΠΎ Π²ΠΈΠ΄Π΅Ρ‚ΡŒ ΠΊΠ°ΠΊ выглядит ΠΌΠ°ΠΊΠ΅Ρ‚ Π² Ρ€Π΅Π°Π»ΡŒΠ½ΠΎΠΌ Ρ€Π°Π·ΠΌΠ΅Ρ€Π΅. Когда ΠΏΡ€ΠΎΠΈΠ·Π²ΠΎΠ΄ΠΈΡˆΡŒ измСнСния Ρ„Π°ΠΉΠ»Π΅ повторяй ΠΏΡ€ΠΎΡ†Π΅Π΄ΡƒΡ€Ρƒ, Π½ΠΎ вмСсто Ρ‚ΠΎΠ³ΠΎ Ρ‡Ρ‚ΠΎ Π±Ρ‹ ΠΊΠ°ΠΆΠ΄Ρ‹ΠΉ Ρ€Π°Π· ΠΎΡ‚ΠΊΡ€Ρ‹Π²Π°Ρ‚ΡŒ Ρ„Π°ΠΉΠ» Ρ‡Π΅Ρ€Π΅Π· контСкстноС мСню просто Π½Π°ΠΆΠΈΠΌΠ°ΠΉ F5 Π² Π±Ρ€Π°ΡƒΠ·Π΅Ρ€Π΅ ΠΈ ΠΎΠ½ΠΎ Π±ΡƒΠ΄Π΅Ρ‚ ΠΎΠ±Π½ΠΎΠ²Π»ΡΡ‚ΡŒΡΡ.

Π‘ΠΎΠ·Π΄Π°Π½ΠΈΠ΅ шапки сайта

Π’Π΅ΠΏΠ΅Ρ€ΡŒ Π·Π°Π»Π΅ΠΉ слой, ΠΊΠΎΡ‚ΠΎΡ€Ρ‹ΠΉ ΠΌΡ‹ использовали для установки Π½Π°ΠΏΡ€Π°Π²Π»ΡΡŽΡ‰ΠΈΡ…, Π±Π΅Π»Ρ‹ΠΌ Ρ†Π²Π΅Ρ‚ΠΎΠΌ. И приступим ΠΊ созданию шапки сайта. Для этого создай Π½ΠΎΠ²ΡƒΡŽ Π³Ρ€ΡƒΠΏΠΏΡƒ слоСв ΠΈ Π½Π°Π·ΠΎΠ²ΠΈ Π΅Π΅ β€œΠ¨Π°ΠΏΠΊΠ° сайта”

РазмСстим Π»ΠΎΠ³ΠΎΡ‚ΠΈΠΏ ΠΊΠΎΠΌΠΏΠ°Π½ΠΈΠΈ. Π― Π΅Π³ΠΎ ΠΏΠΎΡΡ‚Π°Π²Π»ΡŽ Ρ‚Ρ€Π°Π΄ΠΈΡ†ΠΈΠΎΠ½Π½ΠΎ с Π»Π΅Π²ΠΎΠΉ стороны. Π­Ρ‚ΠΎ являСтся Π½Π΅ ΠΎΠ±ΡΠ·Π°Ρ‚Π΅Π»ΡŒΠ½Ρ‹ΠΌ мСстополоТСниСм, Π½ΠΎ принято Ρ€Π°Π·ΠΌΠ΅Ρ‰Π°Ρ‚ΡŒ Π»ΠΎΠ³ΠΎΡ‚ΠΈΠΏ ΠΈΠΌΠ΅Π½Π½ΠΎ слСва ΠΈΠ»ΠΈ ΠΏΠΎ Ρ†Π΅Π½Ρ‚Ρ€Ρƒ ΠΌΠ°ΠΊΠ΅Ρ‚Π°.

Π­Ρ‚ΠΎ связанно с Ρ‚Π΅ΠΌ, Ρ‡Ρ‚ΠΎ ΠΏΠΎΠΏΠ°Π² Π½Π° сайт ΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚Π΅Π»ΡŒ сразу ΠΎΠΏΡ€Π΅Π΄Π΅Π»ΠΈΡ‚ ΠΊ ΠΊΠ°ΠΊΠΎΠΉ ΠΈΠΌΠ΅Π½Π½ΠΎ ΠΎΡ€Π³Π°Π½ΠΈΠ·Π°Ρ†ΠΈΠΈ ΠΏΡ€ΠΈΠ½Π°Π΄Π»Π΅ΠΆΠΈΡ‚ сайт, ΠΊ Ρ‚ΠΎΠΌΡƒ ΠΆΠ΅ Π±ΠΎΠ»ΡŒΡˆΠΈΠ½ΡΡ‚Π²ΠΎ ΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚Π΅Π»Π΅ΠΉ Π²ΠΈΠ·ΡƒΠ°Π»ΡŒΠ½ΠΎ ΠΈΠ·ΡƒΡ‡Π°ΡŽΡ‚ страницу начиная с Π²Π΅Ρ€Ρ…Ρƒ, слСва Π½Π° ΠΏΡ€Π°Π²ΠΎ. Если Π½Π°Ρ€ΠΈΡΠΎΠ²Π°Ρ‚ΡŒ линию, Ρ‚ΠΎ получится Π½Π΅Ρ‡Ρ‚ΠΎ ΠΏΠΎΡ…ΠΎΠΆΠ΅Π΅ Π½Π° Π±ΡƒΠΊΠ²Ρƒ Z.

Π§Ρ‚ΠΎ Π±Ρ‹ Π΄ΠΎΠ±Π°Π²ΠΈΡ‚ΡŒ свой Π»ΠΎΠ³ΠΎΡ‚ΠΈΠΏ (Ссли Π΅Π³ΠΎ Π½Π΅Ρ‚, Ρ‚ΠΎ Ρ‡ΠΈΡ‚Π°ΠΉ Как ΡΠ΄Π΅Π»Π°Ρ‚ΡŒ Π»ΠΎΠ³ΠΎΡ‚ΠΈΠΏ ΠΎΠ½Π»Π°ΠΉΠ½) Π½ΡƒΠΆΠ½ΠΎ:

  1. ΠžΡ‚ΠΊΡ€Ρ‹Ρ‚ΡŒ Π΅Π³ΠΎ Π² Photoshop. Π–Π΅Π»Π°Ρ‚Π΅Π»ΡŒΠ½ΠΎ, Ρ‡Ρ‚ΠΎ Π±Ρ‹ ΠΎΠ½ Π±Ρ‹Π» Ρ…ΠΎΡ€ΠΎΡˆΠ΅Π³ΠΎ качСства ΠΈ ΠΈΠΌΠ΅Π» Ρ„ΠΎΡ€ΠΌΠ°Ρ‚ png с ΠΏΡ€ΠΎΠ·Ρ€Π°Ρ‡Π½Ρ‹ΠΌ Ρ„ΠΎΠ½ΠΎΠΌ.
  2. Π’Ρ‹Π±Ρ€Π°Ρ‚ΡŒ инструмСнт β€œΠŸΠ΅Ρ€Π΅ΠΌΠ΅Ρ‰Π΅Π½ΠΈΠ΅β€ (это стрСлочка Π½Π°ΠΏΠΎΠΌΠΈΠ½Π°ΡŽΡ‰Π°Ρ курсор)
  3. ΠžΡ‚ΠΊΡ€ΠΎΠΉ Π²ΠΊΠ»Π°Π΄ΠΊΡƒ с Π»ΠΎΠ³ΠΎΡ‚ΠΈΠΏΠΎΠΌ
  4. НавСди курсор Π½Π° ΠΈΠ·ΠΎΠ±Ρ€Π°ΠΆΠ΅Π½ΠΈΠ΅ Π»ΠΎΠ³ΠΎΡ‚ΠΈΠΏΠ°
  5. НаТми ΠΈ Π½Π΅ отпускай Π»Π΅Π²ΡƒΡŽ ΠΊΠ½ΠΎΠΏΠΊΡƒ ΠΌΡ‹ΡˆΠΈ
  6. Π’Π°Ρ‰ΠΈ ΠΈΠ·ΠΎΠ±Ρ€Π°ΠΆΠ΅Π½ΠΈΠ΅ Π½Π° Π²ΠΊΠ»Π°Π΄ΠΊΡƒ с ΠΌΠ°ΠΊΠ΅Ρ‚ΠΎΠΌ
  7. НС отпуская ΠΊΠ½ΠΎΠΏΠΊΠΈ Π·Π°Π΄Π΅Ρ€ΠΆΠΈ Π±Π΅Π· двиТСния курсор Π½Π° Π½ΡƒΠΆΠ½ΠΎΠΉ Π²ΠΊΠ»Π°Π΄ΠΊΠ΅ Π΄ΠΎ Ρ‚Π΅Ρ… ΠΏΠΎΡ€ ΠΏΠΎΠΊΠ° ΠΎΠ½Π° Π½Π΅ станСт Π°ΠΊΡ‚ΠΈΠ²Π½ΠΎΠΉ ΠΈ Π½Π΅ появится Ρ‚Π²ΠΎΠΉ ΠΌΠ°ΠΊΠ΅Ρ‚
  8. Π’Π΅ΠΏΠ΅Ρ€ΡŒ тяни курсор Π½Π° холст с ΠΌΠ°ΠΊΠ΅Ρ‚ΠΎΠΌ ΠΈ отпусти Π»Π΅Π²ΡƒΡŽ ΠΊΠ½ΠΎΠΏΠΊΡƒ ΠΌΡ‹ΡˆΠΈ.

Если всС ΠΏΡ€Π°Π²ΠΈΠ»ΡŒΠ½ΠΎ Π»ΠΎΠ³ΠΎΡ‚ΠΈΠΏ скопируСтся Π½ΠΎΠ²Ρ‹ΠΌ слоСм Π½Π° холст с ΠΌΠ°ΠΊΠ΅Ρ‚ΠΎΠΌ.

Π’Π΅ΠΏΠ΅Ρ€ΡŒ Π½ΡƒΠΆΠ½ΠΎ ΠΏΠΎΠ΄ΠΎΠ³Π½Π°Ρ‚ΡŒ Ρ€Π°Π·ΠΌΠ΅Ρ€ Π»ΠΎΠ³ΠΎΡ‚ΠΈΠΏΠ° (комбинация клавиш ctrl+t) Ρ‚Π°ΠΊΠΈΠΌ ΠΎΠ±Ρ€Π°Π·ΠΎΠΌ, Ρ‡Ρ‚ΠΎ Π±Ρ‹ ΠΎΠ½ Π±Ρ‹Π» Π½Π΅ сильно большим, Π½ΠΎ ΠΈ Π½Π΅ Π±Ρ‹Π» ΠΌΠ΅Π»ΠΊΠΈΠΌ ΠΈ выровняй Π΅Π³ΠΎ Π»Π΅Π²Ρ‹ΠΉ ΠΊΡ€Π°ΠΉ ΠΏΠΎ Π½Π°ΠΏΡ€Π°Π²Π»ΡΡŽΡ‰Π΅ΠΉ. Π§Ρ‚ΠΎ Π±Ρ‹ ΠΏΡ€ΠΎΠ²Π΅Ρ€ΠΈΡ‚ΡŒ ΠΏΡ€Π°Π²ΠΈΠ»ΡŒΠ½ΠΎ Π»ΠΈ ΠΏΠΎΠ΄ΠΎΠ±Ρ€Π°Π½ Ρ€Π°Π·ΠΌΠ΅Ρ€ сохрани свой ΠΌΠ°ΠΊΠ΅Ρ‚ Π² Ρ„ΠΎΡ€ΠΌΠ°Ρ‚Π΅ png-24 ΠΈ ΠΎΡ‚ΠΊΡ€ΠΎΠΉ Π² Π±Ρ€Π°ΡƒΠ·Π΅Ρ€Π΅.

Π’Π΅ΠΏΠ΅Ρ€ΡŒ я создаю Π½ΠΎΠ²ΡƒΡŽ Π³Ρ€ΡƒΠΏΠΏΡƒ слоСв ΠΈ Π½Π°Π·Ρ‹Π²Π°ΡŽ Π΅Π΅ Ρ‚Π΅Π»Π΅Ρ„ΠΎΠ½Ρ‹. ΠŸΡ€ΠΈ ΠΏΠΎΠΌΠΎΡ‰ΠΈ инструмСнта β€œΠ’Π΅ΠΊΡΡ‚β€ ΠΏΠΈΡˆΡƒ β€œΠ“ΠΎΡ€ΡΡ‡Π°Ρ линия” ΠΈ Π½ΠΎΠΌΠ΅Ρ€ Ρ‚Π΅Π»Π΅Ρ„ΠΎΠ½Π° ΠΎΡ€Π³Π°Π½ΠΈΠ·Π°Ρ†ΠΈΠΈ β€œ+7 (3435) 25-60-60”. Π― размСстил Ρ‚Π΅Π»Π΅Ρ„ΠΎΠ½ Π² шапкС ΠΏΠΎ Π΄Π²ΡƒΠΌ ΠΏΡ€ΠΈΡ‡ΠΈΠ½Π°ΠΌ. ΠŸΠ΅Ρ€Π²Π°Ρ это Π½Π°Π»ΠΈΡ‡ΠΈΠ΅ Ρ‚Π΅Π»Π΅Ρ„ΠΎΠ½Π° с ΠΏΡ€Π°Π²ΠΎΠΉ стороны Π² шапкС ΡƒΠΆΠ΅ ΠΏΡ€ΠΈΠ²Ρ‹Ρ‡Π½ΠΎ ΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚Π΅Π»ΡΠΌ, Ρ‚Π°ΠΊ сдСлано Π½Π° Π±ΠΎΠ»ΡŒΡˆΠΈΠ½ΡΡ‚Π²Π΅ сайтов ΠΊΠΎΠΌΠΏΠ°Π½ΠΈΠΉ. Вторая, Ссли это сайт ΠΊΠΎΠΌΠΏΠ°Π½ΠΈΠΈ, Ρ‚ΠΎ ΠΌΠ½ΠΎΠ³ΠΈΠ΅ посСтитСли ΠΏΠΎΡ‡ΠΈΡ‚Π°Π², Ρ‚ΠΎ Ρ‡Ρ‚ΠΎ ΠΈΡ… ΠΈΠ½Ρ‚Π΅Ρ€Π΅ΡΡƒΡŽΡ‚ навСрняка захотят ΠΏΠΎΠ·Π²ΠΎΠ½ΠΈΡ‚ΡŒ ΠΈ ΠΈΠΌ Π½Π΅ придСтся ΠΎΡ‚ΠΊΡ€Ρ‹Π²Π°Ρ‚ΡŒ страницу ΠΊΠΎΠ½Ρ‚Π°ΠΊΡ‚Ρ‹. Π― Ρ‚Π°ΠΊ ΠΆΠ΅ ΠΏΠΎΠ΄ΠΎΠ±Ρ€Π°Π» подходящий Π½Π° ΠΌΠΎΠΉ взгляд ΡˆΡ€ΠΈΡ„Ρ‚, Ρ€Π°Π·ΠΌΠ΅Ρ€ ΠΈ выровнял Ρ‚Π΅Π»Π΅Ρ„ΠΎΠ½ ΠΏΠΎ ΠΏΡ€Π°Π²ΠΎΠΉ Π²Π½ΡƒΡ‚Ρ€Π΅Π½Π½Π΅ΠΉ Π½Π°ΠΏΡ€Π°Π²Π»ΡΡŽΡ‰Π΅ΠΉ.

Располагая элСмСнты Π½Π° страницС ΠΏΠΎΠΌΠ½ΠΈ ΠΎ ΡΠΎΠΎΡ‚Π½ΠΎΡˆΠ΅Π½ΠΈΠΈ Ρ€Π°Π·ΠΌΠ΅Ρ€ΠΎΠ² ΠΈ Ρ†Π²Π΅Ρ‚ΠΎΠ². Π‘Ρ‚Ρ€Π°Π½ΠΈΡ†Π° Π΄ΠΎΠ»ΠΆΠ½Π° Π±Ρ‹Ρ‚ΡŒ сбалансирована. Если элСмСнты находятся Π½Π° ΠΎΠ΄Π½ΠΎΠΉ Π»ΠΈΠ½ΠΈΠΈ Π²Ρ‹Ρ€Π°Π²Π½ΠΈΠ²Π°ΠΉ ΠΈΡ… с ΠΏΠΎΠΌΠΎΡ‰ΡŒΡŽ Π½Π°ΠΏΡ€Π°Π²Π»ΡΡŽΡ‰ΠΈΡ… (ΠΏΠΎ Π½ΠΈΠΆΠ½Π΅ΠΌΡƒ ΠΊΡ€Π°ΡŽ, Π²Π΅Ρ€Ρ…Π½Π΅ΠΌΡƒ ΠΈΠ»ΠΈ Ρ†Π΅Π½Ρ‚Ρ€Ρƒ всСх элСмСнтов Π½Π° Π»ΠΈΠ½ΠΈΠΈ)

Π‘ΠΎΠ·Π΄Π°Π½ΠΈΠ΅ Π΄ΠΈΠ·Π°ΠΉΠ½Π° Π³Π»Π°Π²Π½ΠΎΠ³ΠΎ мСню сайта

Для Ρ‚ΠΎΠ³ΠΎ Ρ‡Ρ‚ΠΎ Π±Ρ‹ ΡΠ΄Π΅Π»Π°Ρ‚ΡŒ мСню я Π²Ρ‹Π±Ρ€Π°Π» инструмСнт β€œΠŸΡ€ΡΠΌΠΎΡƒΠ³ΠΎΠ»ΡŒΠ½Π°Ρ ΠΎΠ±Π»Π°ΡΡ‚ΡŒβ€œ, создал 2 ΠΏΡ€ΡΠΌΠΎΡƒΠ³ΠΎΠ»ΡŒΠ½ΠΈΠΊΠ° Ρ€Π°Π·Π½ΠΎΠ³ΠΎ Ρ€Π°Π·ΠΌΠ΅Ρ€Π° ΠΈ с Ρ€Π°Π·Π½Ρ‹ΠΌ Ρ†Π²Π΅Ρ‚ΠΎΠΌ ΠΈ помСстил больший свСрху Π° мСньший снизу. На Π²Π΅Ρ€Ρ…Π½ΠΈΠΉ Π½Π°Π»ΠΎΠΆΠΈΠ» эффСкт Π³Ρ€Π°Π΄ΠΈΠ΅Π½Ρ‚Π°. Π’ΠΎΡ‚ Ρ‡Ρ‚ΠΎ ΠΏΠΎΠ»ΡƒΡ‡ΠΈΠ»ΠΎΡΡŒ:

Π’Π΅ΠΏΠ΅Ρ€ΡŒ Π½ΡƒΠΆΠ½ΠΎ Π΄ΠΎΠ±Π°Π²ΠΈΡ‚ΡŒ ΠΏΡƒΠ½ΠΊΡ‚Ρ‹ мСню ΠΈ ΠΏΠΎΠ΄ΠΎΠ±Ρ€Π°Ρ‚ΡŒ для Π½ΠΈΡ… подходящий Ρ†Π²Π΅Ρ‚ (ΠΎΠ΄ΠΈΠ½ ΠΏΡƒΠ½ΠΊΡ‚ мСню я оставил Π±Π΅Π»Ρ‹ΠΌ – это Π½ΡƒΠΆΠ½ΠΎ для Ρ‚ΠΎΠ³ΠΎ Ρ‡Ρ‚ΠΎ Π±Ρ‹ ΠΏΠΎΠΊΠ°Π·Π°Ρ‚ΡŒ ΠΊΠ°ΠΊ Π±ΡƒΠ΄Π΅Ρ‚ Π²Ρ‹Π³Π»ΡΠ΄Π΅Ρ‚ΡŒ ΠΏΡƒΠ½ΠΊΡ‚ мСню ΠΏΡ€ΠΈ Π½Π°Π²Π΅Π΄Π΅Π½ΠΈΠΈ курсора ΠΌΡ‹ΡˆΠΈ)

Π’Π΅ΠΏΠ΅Ρ€ΡŒ, Ρ‡Ρ‚ΠΎ Π±Ρ‹ мСнюшка Π»ΡƒΡ‡ΡˆΠ΅ ΡΠΌΠΎΡ‚Ρ€Π΅Π»Π°ΡΡŒ, Π° ΠΏΡƒΠ½ΠΊΡ‚Ρ‹ мСню ΠΈΠΌΠ΅Π»ΠΈ Π²ΠΈΠ·ΡƒΠ°Π»ΡŒΠ½Ρ‹Π΅ Ρ€Π°Π·Π΄Π΅Π»ΠΈΡ‚Π΅Π»ΠΈ я Π΄ΠΎΠ±Π°Π²ΠΈΠ» полоски ΠΏΠΎ 2 пиксСля Π² ΡˆΠΈΡ€ΠΈΠ½Ρƒ. Один пиксСль сдСлал Ρ‡ΡƒΡ‚ΡŒ Ρ‚Π΅ΠΌΠ½Π΅Π΅, Π° Π΄Ρ€ΡƒΠ³ΠΎΠΉ Ρ‡ΡƒΡ‚ΡŒ свСтлСС основных Ρ†Π²Π΅Ρ‚ΠΎΠ² Π³Ρ€Π°Π΄ΠΈΠ΅Π½Ρ‚Π° ΠΏΡ€ΡΠΌΠΎΡƒΠ³ΠΎΠ»ΡŒΠ½ΠΈΠΊΠ°. ΠŸΠΎΡ‚ΠΎΠΌ Ρ€Π°Π·ΠΌΠ½ΠΎΠΆΠΈΠ» ΠΈ распрСдСлил ΠΈΡ… ΠΌΠ΅ΠΆΠ΄Ρƒ ΠΏΡƒΠ½ΠΊΡ‚Π°ΠΌΠΈ мСню.

И Π½Π° послСднСм шагС я Π΄ΠΎΠ±Π°Π²ΠΈΠ» hover эффСкт (эффСкт ΠΏΡ€ΠΈ Π½Π°Π²Π΅Π΄Π΅Π½ΠΈΠΈ курсора ΠΌΡ‹ΡˆΠΈ) для ΠΎΠ΄Π½ΠΎΠ³ΠΎ ΠΈΠ· ΠΏΡƒΠ½ΠΊΡ‚ΠΎΠ² мСню.

Π‘ΠΎΠ·Π΄Π°Π½ΠΈΠ΅ Π΄ΠΈΠ·Π°ΠΉΠ½Π° Π»Π΅Π²ΠΎΠ³ΠΎ мСню сайта

ЧСстно говоря это мСню сдСлано Π² Ρ‚ΠΎΠΌ ΠΆΠ΅ стилС ΠΈ ΠΌΠ°Π»ΠΎ отличаСтся ΠΎΡ‚ ΠΏΡ€Π΅Π΄Ρ‹Π΄ΡƒΡ‰Π΅Π³ΠΎ ΠΏΠΎ ΠΌΠ΅Ρ‚ΠΎΠ΄Ρƒ Π΅Π³ΠΎ создания поэтому вСсь процСсс ΠΎΠΏΠΈΡΡ‹Π²Π°Ρ‚ΡŒ Π½Π΅ Π±ΡƒΠ΄Ρƒ. Однако Ρ…ΠΎΡ‡Ρƒ Π·Π°ΠΎΡΡ‚Ρ€ΠΈΡ‚ΡŒ Π²Π½ΠΈΠΌΠ°Π½ΠΈΠ΅ Π½Π° ΡΠ»Π΅Π΄ΡƒΡŽΡ‰ΠΈΡ… ΠΌΠΎΠΌΠ΅Π½Ρ‚Π°Ρ…:

  1. Π Π°Π·Π΄Π΅Π»Π΅Π½ΠΈΠ΅ мСста ΠΏΡ€ΠΈ создании Π΄ΠΈΠ·Π°ΠΉΠ½Π° вопрос больной ΠΈ Ρ‚Ρ€Π΅Π±ΡƒΠ΅Ρ‚ особого внимания. Π― для сСбя Ρ€Π΅ΡˆΠΈΠ», Ρ‡Ρ‚ΠΎ Π»Π΅Π²ΠΎΠ΅ мСню Π½Π΅ Π΄ΠΎΠ»ΠΆΠ½ΠΎ Π±Ρ‹Ρ‚ΡŒ большС 250 px Ρ‚Π°ΠΊ ΠΊΠ°ΠΊ большая ΡˆΠΈΡ€ΠΈΠ½Π° ΡΡŠΠ΅Π΄Π°Π΅Ρ‚ мСсто Ρƒ ΠΊΠΎΠ½Ρ‚Π΅Π½Ρ‚Π°. Однако всС зависит ΠΎΡ‚ ΠΊΠΎΠ½ΠΊΡ€Π΅Ρ‚Π½ΠΎΠ³ΠΎ ΠΌΠ°ΠΊΠ΅Ρ‚Π°
  2. ΠžΡ‚ΡΡ‚ΡƒΠΏΡ‹ ΠΌΠ΅ΠΆΠ΄Ρƒ Π±Π»ΠΎΠΊΠ°ΠΌΠΈ Π½Π΅ слСдуСт Π΄Π΅Π»Π°Ρ‚ΡŒ мСньшС 10 px. На ΠΌΠΎΠΉ взгляд ΠΎΠΏΡ‚ΠΈΠΌΠ°Π»ΡŒΠ½Ρ‹ΠΌΠΈ значСниями ΡΠ²Π»ΡΡŽΡ‚ΡΡ 10px, 15px, 20px
  3. Π§Ρ‚ΠΎ Π±Ρ‹ ΡΠ΄Π΅Π»Π°Ρ‚ΡŒ ΠΏΡƒΠ½ΠΊΡ‚ΠΈΡ€Π½ΡƒΡŽ линию Π² Ρ„ΠΎΡ‚ΠΎΡˆΠΎΠΏΠ΅ ΠΏΡ€ΠΎΡ‡ΠΈΡ‚Π°ΠΉΡ‚Π΅ ΡΠΎΠΎΡ‚Π²Π΅Ρ‚ΡΡ‚Π²ΡƒΡŽΡ‰ΡƒΡŽ ΡΡ‚Π°Ρ‚ΡŒΡŽ
  4. Боздавая ΠΏΡƒΠ½ΠΊΡ‚Ρ‹ мСню я Π½Π΅ Π΄Π΅Π»Π°Π» для ΠΊΠ°ΠΆΠ΄ΠΎΠ³ΠΎ ΠΏΡƒΠ½ΠΊΡ‚Π° ΠΎΡ‚Π΄Π΅Π»ΡŒΠ½Ρ‹ΠΉ тСкстовый слой. МоТно это ΡΠ΄Π΅Π»Π°Ρ‚ΡŒ Π² ΠΎΠ΄Π½ΠΎΠΌ слоС начиная ΠΊΠ°ΠΆΠ΄Ρ‹ΠΉ ΠΏΡƒΠ½ΠΊΡ‚ с Π½ΠΎΠ²ΠΎΠΉ строки (Ρ‡Π΅Ρ€Π΅Π· Π΅Π½Ρ‚Π΅Ρ€), Π° ΠΏΠΎΡ‚ΠΎΠΌ просто ΠΎΡ‚Ρ€Π΅Π³ΡƒΠ»ΠΈΡ€ΠΎΠ²Π°Ρ‚ΡŒ ΠΌΠ΅ΠΆ строчный ΠΈΠ½Ρ‚Π΅Ρ€Π²Π°Π» Π² ΠΎΠΊΠ½Π΅ β€œΠ‘ΠΈΠΌΠ²ΠΎΠ»β€

Π― использовал 14 Ρ€Π°Π·ΠΌΠ΅Ρ€ ΠΈ стандартный для Windows ΡˆΡ€ΠΈΡ„Ρ‚ β€œVerdana”

Бтарайся ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚ΡŒ стандартныС ΡˆΡ€ΠΈΡ„Ρ‚Ρ‹ ΠΏΠΎ максимуму. Π’Π°ΠΊ ΠΊΠ°ΠΊ ΠΏΡ€ΠΈ просмотрС сайта ΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚Π΅Π»ΡŒ ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠ΅Ρ‚ΡΡ ΡˆΡ€ΠΈΡ„Ρ‚Ρ‹ своСй систСмы.

ΠŸΠΎΠ»ΡƒΡ‡ΠΈΠ»ΠΎΡΡŒ Π²ΠΎΡ‚ Ρ‚Π°ΠΊΠΎΠ΅ мСню:

Π”ΠΈΠ·Π°ΠΉΠ½ содСрТимого сайта

Π’Π΅ΠΏΠ΅Ρ€ΡŒ ΠΏΡ€ΠΈΡˆΠ»ΠΎ врСмя ΠΈΠ·ΠΎΠ±Ρ€Π°Π·ΠΈΡ‚ΡŒ ΠΊΠ°ΠΊ Π±ΡƒΠ΄Π΅Ρ‚ Π²Ρ‹Π³Π»ΡΠ΄Π΅Ρ‚ΡŒ содСрТимого сайта. По ΠΈΠ΄Π΅Π΅ Π½ΡƒΠΆΠ½ΠΎ ΠΎΡ‚Ρ€ΠΈΡΠΎΠ²Ρ‹Π²Π°Ρ‚ΡŒ всС Ρ‚ΠΈΠΏΡ‹ содСрТимого сайта. А ΠΈΠΌΠ΅Π½Π½ΠΎ главная страница,Β Ρ„ΠΎΡ€ΠΌΡ‹, Ρ€Π°Π·Π΄Π΅Π» новости ΠΈ Ρ‚.Π΄., я ΠΆΠ΅ ΠΎΠ³Ρ€Π°Π½ΠΈΡ‡ΡƒΡΡŒ простой тСкстовой страницСй сайта.

Π£ любой страницы Π΄ΠΎΠ»ΠΆΠ΅Π½ Π±Ρ‹Ρ‚ΡŒ Π·Π°Π³ΠΎΠ»ΠΎΠ²ΠΎΠΊ ΠΈ собствСнно сам ΠΊΠΎΠ½Ρ‚Π΅Π½Ρ‚. Для Π½Π°Ρ‡Π°Π»Π° я ΡƒΡΡ‚Π°Π½ΠΎΠ²Π»ΡŽ Π΄Π²Π΅ Π½Π°ΠΏΡ€Π°Π²Π»ΡΡŽΡ‰ΠΈΠ΅. ΠŸΠ΅Ρ€Π²ΡƒΡŽ Π³ΠΎΡ€ΠΈΠ·ΠΎΠ½Ρ‚Π°Π»ΡŒΠ½ΡƒΡŽ ΠΏΠΎ Π²Π΅Ρ€Ρ…Π½Π΅ΠΌΡƒ ΠΊΡ€Π°ΡŽ мСню. Π’Ρ‚ΠΎΡ€ΡƒΡŽ Π²Π΅Ρ€Ρ‚ΠΈΠΊΠ°Π»ΡŒΠ½ΡƒΡŽ Π½Π° расстоянии 20px ΠΎΡ‚ Π»Π΅Π²ΠΎΠ³ΠΎ края Π»Π΅Π²ΠΎΠ³ΠΎ мСню.

Π”Π°Π»Π΅Π΅ создаю слой с Π·Π°Π³ΠΎΠ»ΠΎΠ²ΠΊΠΎΠΌ, слой с тСкстом ΠΈ ΠΏΠ΅Ρ€Π΅Ρ‚Π°ΡΠΊΠΈΠ²Π°ΡŽ Π·Π°Ρ€Π°Π½Π΅Π΅ ΠΏΠΎΠ΄Π³ΠΎΡ‚ΠΎΠ²Π»Π΅Π½Π½Ρ‹Π΅ изобраТСния ΠΊΠΎΡ„Π΅. Π§Ρ‚ΠΎ Π±Ρ‹ тСкстом Π±Ρ‹Π»ΠΎ ΡƒΠΏΡ€Π°Π²Π»ΡΡ‚ΡŒ Π»Π΅Π³Ρ‡Π΅ возьми инструмСнт β€œΠ’Π΅ΠΊΡΡ‚β€ ΠΈ Π½Π°ΠΆΠΌΠΈ Π»Π΅Π²ΡƒΡŽ ΠΊΠ½ΠΎΠΏΠΊΡƒ ΠΌΡ‹ΡˆΠΈ ΠΈ потяни ΠΏΠΎ Π΄ΠΈΠ°Π³ΠΎΠ½Π°Π»ΠΈ. ΠŸΠΎΠ»ΡƒΡ‡ΠΈΡ‚ΡΡ ΠΏΡ€ΡΠΌΠΎΡƒΠ³ΠΎΠ»ΡŒΠ½ΠΈΠΊ ΠΎΠΏΡ€Π΅Π΄Π΅Π»Π΅Π½Π½ΠΎΠ³ΠΎ Ρ€Π°Π·ΠΌΠ΅Ρ€Π°. Π’Π΅ΠΏΠ΅Ρ€ΡŒ ΠΌΠΎΠΆΠ½ΠΎ ΡΠΊΠΎΠΏΠΈΡ€ΠΎΠ²Π°Ρ‚ΡŒ Ρ‚ΡƒΠ΄Π° тСкст, Ρ„ΠΎΡ€ΠΌΠ°Ρ‚ΠΈΡ€ΠΎΠ²Π°Ρ‚ΡŒ Π΅Π³ΠΎ ΠΈ ΠΌΠ΅Π½ΡΡ‚ΡŒ Ρ€Π°Π·ΠΌΠ΅Ρ€ Π±Π»ΠΎΠΊΠ° тСста ΠΏΡ€ΠΈ нСобходимости.

ΠŸΠΎΠ»ΡƒΡ‡ΠΈΠ»ΠΎΡΡŒ Π²ΠΎΡ‚ Ρ‡Ρ‚ΠΎ:

Π”ΠΈΠ·Π°ΠΉΠ½ ΠΏΠΎΠ΄Π²Π°Π»Π° сайта

Π’ ΠΏΠΎΠ΄Π²Π°Π» сайта ΠΎΠ±Ρ‹Ρ‡Π½ΠΎ ΠΏΠΎΠΌΠ΅Ρ‰Π°ΡŽΡ‚ счСтчики, Π΄ΠΎΠΏΠΎΠ»Π½ΠΈΡ‚Π΅Π»ΡŒΠ½Ρ‹Π΅ Π΄ΡƒΠ±Π»ΠΈΡ€ΡƒΡŽΡ‰ΠΈΠ΅ мСню, ΠΊΠΎΠΏΠΈΡ€Π°ΠΉΡ‚ ΠΈ Ρ‚.Π΄. Π― Ρ‚Π°ΠΊ ΠΈ сдСлал, Ρ€Π°Π·Π²Π΅ Ρ‡Ρ‚ΠΎ мСню Π½Π΅ размСстил.

Π‘ΠΎΠ·Π΄Π°Π΅ΠΌ Π΄Π²Π° ΠΏΡ€ΡΠΌΠΎΡƒΠ³ΠΎΠ»ΡŒΠ½ΠΈΠΊΠ° ΠΏΠΎ Π°Π½Π°Π»ΠΎΠ³ΠΈΠΈ с мСню ΠΈ Ρ€Π°Π·ΠΌΠ΅Ρ‰Π°Π΅ΠΌ счСтчики ΠΈ ΠΏΡ€ΠΎΡ‡ΡƒΡŽ ΠΈΠ½Ρ„ΠΎΡ€ΠΌΠ°Ρ†ΠΈΡŽ, Ρ‡Ρ‚ΠΎ Π±Ρ‹ ΠΏΠΎΠ»ΡƒΡ‡ΠΈΠ»ΠΎΡΡŒ Π²ΠΎΡ‚ Ρ‚Π°ΠΊ:

Π Π΅Π·ΡƒΠ»ΡŒΡ‚Π°Ρ‚:

ΠœΡ‹ рассмотрСли ΠΊΠ°ΠΊ ΡΠ΄Π΅Π»Π°Ρ‚ΡŒ Π΄ΠΈΠ·Π°ΠΉΠ½ сайта Π² Ρ„ΠΎΡ‚ΠΎΡˆΠΎΠΏΠ΅ (photoshop) с нуля своими Ρ€ΡƒΠΊΠ°ΠΌΠΈ. А дальшС всС зависит ΠΎΡ‚ Π’Π°ΡˆΠΈΡ… творчСских способностСй ΠΈ владСния ΠΏΡ€ΠΎΠ³Ρ€Π°ΠΌΠΌΠΎΠΉ.

Как ΡΠΎΠ·Π΄Π°Π²Π°Ρ‚ΡŒ Π΄ΠΈΠ·Π°ΠΉΠ½ с ΠΏΠΎΠΌΠΎΡ‰ΡŒΡŽ Ρ„ΠΎΡ‚ΠΎΡˆΠΎΠΏΠ°. ΠžΠ±Ρ€Π°Ρ‰Π°ΠΉΡ‚Π΅ Π²Π½ΠΈΠΌΠ°Π½ΠΈΠ΅ Π½Π° Π΄Π΅Ρ‚Π°Π»ΠΈ. ΠŸΡ€ΠΎΡΡ‚ΠΎΠ΅ внСсСниС ΠΈΠ·ΠΌΠ΅Π½Π΅Π½ΠΈΠΉ

Если Π²Ρ‹ Ρ…ΠΎΡ‚ΠΈΡ‚Π΅ ΡΠ°ΠΌΠΎΡΡ‚ΠΎΡΡ‚Π΅Π»ΡŒΠ½ΠΎ ΡΠΎΠ·Π΄Π°Ρ‚ΡŒ Π²Π΅Π±-страницу, Ρ€Π°Π·Π±Π΅Ρ€ΠΈΡ‚Π΅ΡΡŒ, ΠΊΠ°ΠΊ ΡΠ΄Π΅Π»Π°Ρ‚ΡŒ сайт Π² Π€ΠΎΡ‚ΠΎΡˆΠΎΠΏΠ΅. — это графичСский Ρ€Π΅Π΄Π°ΠΊΡ‚ΠΎΡ€. Π’ Π½Ρ‘ΠΌ ΠΌΠΎΠΆΠ½ΠΎ Ρ€ΠΈΡΠΎΠ²Π°Ρ‚ΡŒ ΠΌΠ°ΠΊΠ΅Ρ‚Ρ‹ ΠΈ ΠΈΡ… ΠΎΡ‚Π΄Π΅Π»ΡŒΠ½Ρ‹Π΅ элСмСнты. Π­Ρ‚ΠΎ достаточно Π΄ΠΎΠ»Π³ΠΈΠΉ ΠΈ слоТный процСсс. Π’Π΅Π±-Π΄ΠΈΠ·Π°ΠΉΠ½Π΅Ρ€Ρ‹ Π³ΠΎΠ΄Π°ΠΌΠΈ учатся ΠΎΡ„ΠΎΡ€ΠΌΠ»ΡΡ‚ΡŒ ΡˆΠ°Π±Π»ΠΎΠ½Ρ‹ ΠΈ Π²Π΅Ρ€ΡΡ‚Π°Ρ‚ΡŒ ΠΏΠΎ Π½ΠΈΠΌ ΠΈΠ½Ρ‚Π΅Ρ€Π½Π΅Ρ‚-страницы. Но простой ΠΌΠ°ΠΊΠ΅Ρ‚ ΠΌΠΎΠΆΠ΅Ρ‚ ΡΠΎΠ±Ρ€Π°Ρ‚ΡŒ любой Ρ‡Π΅Π»ΠΎΠ²Π΅ΠΊ. НуТны лишь Π±Π°Π·ΠΎΠ²Ρ‹Π΅ знания Π€ΠΎΡ‚ΠΎΡˆΠΎΠΏΠ° ΠΈ фантазия.

Π’ Π€ΠΎΡ‚ΠΎΡˆΠΎΠΏΠ΅ Π½Π°Ρ€ΠΈΡΠΎΠ²Π°Ρ‚ΡŒ нСслоТный Π΄ΠΈΠ·Π°ΠΉΠ½ сайта ΠΏΠΎΠ΄ силу Π΄Π°ΠΆΠ΅ Π½ΠΎΠ²ΠΈΡ‡ΠΊΡƒ

Π‘ ΠΏΠ΅Ρ€Π²ΠΎΠ³ΠΎ Ρ€Π°Π·Π° Ρƒ вас вряд Π»ΠΈ получится ΠΎΡ„ΠΎΡ€ΠΌΠΈΡ‚ΡŒ страницу, ΠΊΠ°ΠΊ Ρƒ мастСров Π΄ΠΈΠ·Π°ΠΉΠ½Π°. Но Π½Π°Ρ€ΠΈΡΠΎΠ²Π°Ρ‚ΡŒ ΠΏΡ€ΠΈΠ²Π»Π΅ΠΊΠ°Ρ‚Π΅Π»ΡŒΠ½Ρ‹ΠΉ ΠΈ Π½Π΅Π²Ρ‹Ρ‡ΡƒΡ€Π½Ρ‹ΠΉ сСрвис Π±ΡƒΠ΄Π΅Ρ‚ Π²Π°ΠΌ ΠΏΠΎΠ΄ силу.

Π Π°ΡΡˆΠΈΡ„Ρ€ΠΎΠ²ΠΊΠ° Π½Π΅ΠΊΠΎΡ‚ΠΎΡ€Ρ‹Ρ… Ρ‚Π΅Ρ€ΠΌΠΈΠ½ΠΎΠ².

  • CSS (Cascading Style Sheets) ΠΈ HTML (HyperText Markup Language) — ΠΊΠΎΠΌΠΏΡŒΡŽΡ‚Π΅Ρ€Π½Ρ‹Π΅ языки, ΠΊΠΎΡ‚ΠΎΡ€Ρ‹Π΅ ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΡŽΡ‚ΡΡ ΠΏΡ€ΠΈ создании Π²Π΅Π±-рСсурсов. Если ΠΎΡ‚ΠΊΡ€Ρ‹Ρ‚ΡŒ исходный ΠΊΠΎΠ΄ любой страницы Π² ΠΈΠ½Ρ‚Π΅Ρ€Π½Π΅Ρ‚Π΅, Ρ‚Π°ΠΌ Π±ΡƒΠ΄ΡƒΡ‚ HTML-тэги.
  • Вёрстка — ΠΊΠΎΠΌΠΏΠΎΠ½ΠΎΠ²ΠΊΠ° ΠΈ ΠΌΠΎΠ½Ρ‚Π°ΠΆ ΠΌΠ°Ρ‚Π΅Ρ€ΠΈΠ°Π»ΠΎΠ² ΠΈΠ· ΠΌΠ°ΠΊΠ΅Ρ‚Π°, ΠΏΡ€Π΅Π²Ρ€Π°Ρ‰Π΅Π½ΠΈΠ΅ Π΅Π³ΠΎ Π² html-шаблон. ΠžΡ‚ этого зависит, ΠΊΠ°ΠΊ Ρ€Π°ΡΠΏΠΎΠ»Π°Π³Π°ΡŽΡ‚ΡΡ ΠΎΠ±ΡŠΠ΅ΠΊΡ‚Ρ‹, красиво Π»ΠΈ ΠΎΠ½ΠΈ выглядят Π² ΠΎΠ±Ρ‰Π΅ΠΉ ΠΊΠΎΠΌΠΏΠΎΠ·ΠΈΡ†ΠΈΠΈ, ΡƒΠ΄ΠΎΠ±Π½ΠΎ Π»ΠΈ Ρ‡ΠΈΡ‚Π°Ρ‚ΡŒ тСкст ΠΈ Ρ‚ΠΎΠΌΡƒ ΠΏΠΎΠ΄ΠΎΠ±Π½ΠΎΠ΅.
  • Π‘Π»ΠΎΠΈ — части ΠΌΠ°ΠΊΠ΅Ρ‚Π°. Они вмСстС ΡΠΎΡΡ‚Π°Π²Π»ΡΡŽΡ‚ ΠΎΠ±Ρ‰ΡƒΡŽ ΠΊΠ°Ρ€Ρ‚ΠΈΠ½Ρƒ. Но ΠΈΡ… ΠΌΠΎΠΆΠ½ΠΎ Ρ€Π΅Π΄Π°ΠΊΡ‚ΠΈΡ€ΠΎΠ²Π°Ρ‚ΡŒ ΠΈ ΠΏΠ΅Ρ€Π΅ΠΌΠ΅Ρ‰Π°Ρ‚ΡŒ ΠΎΡ‚Π΄Π΅Π»ΡŒΠ½ΠΎ Π΄Ρ€ΡƒΠ³ ΠΎΡ‚ Π΄Ρ€ΡƒΠ³Π°.
  • Π’Π΅Π»ΠΎ — мСсто, Π³Π΄Π΅ находится ΠΊΠΎΠ½Ρ‚Π΅Π½Ρ‚. Π’ΠΎΠΊΡ€ΡƒΠ³ Π½Π΅Π³ΠΎ ΠΌΠΎΠΆΠ΅Ρ‚ Π±Ρ‹Ρ‚ΡŒ Ρ„ΠΎΠ½.
  • Π€Ρ€Π΅ΠΉΠΌ (Frame) — элСмСнт страницы. Π‘Π»ΠΎΠΊ с ΠΊΠ°ΠΊΠΎΠΉ-Ρ‚ΠΎ ΠΈΠ½Ρ„ΠΎΡ€ΠΌΠ°Ρ†ΠΈΠ΅ΠΉ, ΠΊΠ°Ρ€Ρ‚ΠΈΠ½ΠΊΠΎΠΉ, Ρ„ΠΎΡ€ΠΌΠΎΠΉ.

Π‘Π΄Π΅Π»Π°Ρ‚ΡŒ ΠΏΠΎΡ‚Ρ€ΡΡΠ°ΡŽΡ‰ΠΈΠΉ сайт с нуля ΠΌΠΎΠΆΠ΅Ρ‚ Ρ‚ΠΎΠ»ΡŒΠΊΠΎ профСссионал. Для этого Π½ΡƒΠΆΠ½ΠΎ Ρ€Π°Π·Π±ΠΈΡ€Π°Ρ‚ΡŒΡΡ Π² Π²Π΅Π±-Π΄ΠΈΠ·Π°ΠΉΠ½Π΅ ΠΈ Π·Π½Π°Ρ‚ΡŒ HTML. Π’Π°ΠΊ ΠΊΠ°ΠΊ Π³ΠΎΡ‚ΠΎΠ²Ρ‹ΠΉ ΠΌΠ°ΠΊΠ΅Ρ‚ Π½Π°Π΄ΠΎ Π΅Ρ‰Ρ‘ Π³Ρ€Π°ΠΌΠΎΡ‚Π½ΠΎ ΡΠ²Π΅Ρ€ΡΡ‚Π°Ρ‚ΡŒ.

Но Π΅ΡΡ‚ΡŒ ΠΈ Π±ΠΎΠ»Π΅Π΅ простыС способы. Π‘ΡƒΡ‰Π΅ΡΡ‚Π²ΡƒΡŽΡ‚ ΠΎΠ½Π»Π°ΠΉΠ½-сСрвисы ΠΈ ΠΏΡ€ΠΎΠ³Ρ€Π°ΠΌΠΌΡ‹, ΠΊΠΎΡ‚ΠΎΡ€Ρ‹Π΅ автоматичСски ΠΏΡ€Π΅ΠΎΠ±Ρ€Π°Π·ΡƒΡŽΡ‚.psd (Ρ„ΠΎΡ€ΠΌΠ°Ρ‚ Ρ„Π°ΠΉΠ»ΠΎΠ² Photoshop) Π² HTML ΠΈ CSS. Π’Π°ΠΌ останСтся лишь ΠΏΡ€Π°Π²ΠΈΠ»ΡŒΠ½ΠΎ ΡΠΎΠ±Ρ€Π°Ρ‚ΡŒ шаблон.

Для использования Photoshop Π½Π΅ΠΎΠ±ΡΠ·Π°Ρ‚Π΅Π»ΡŒΠ½ΠΎ Π±Ρ‹Ρ‚ΡŒ Ρ…ΡƒΠ΄ΠΎΠΆΠ½ΠΈΠΊΠΎΠΌ ΠΈ Ρ€Π°Π·Π±ΠΈΡ€Π°Ρ‚ΡŒΡΡ Π²ΠΎ всСх опциях ΠΏΡ€ΠΎΠ³Ρ€Π°ΠΌΠΌΡ‹. Но Ссли Π²Ρ‹ Π²ΠΏΠ΅Ρ€Π²Ρ‹Π΅ запустили Π΅Ρ‘ ΠΈ Π½Π΅ Π·Π½Π°Π΅Ρ‚Π΅, ΠΊΠ°ΠΊ Π²ΡΡ‚Π°Π²ΠΈΡ‚ΡŒ тСкст, Π½Π°Ρ€ΠΈΡΠΎΠ²Π°Ρ‚ΡŒ Π³Π΅ΠΎΠΌΠ΅Ρ‚Ρ€ΠΈΡ‡Π΅ΡΠΊΡƒΡŽ Ρ„ΠΈΠ³ΡƒΡ€Ρƒ, ΠΏΡ€ΠΎΠ΄ΡƒΠ±Π»ΠΈΡ€ΠΎΠ²Π°Ρ‚ΡŒ слой, ΠΏΠΎΠΌΠ΅Π½ΡΡ‚ΡŒ Ρ†Π²Π΅Ρ‚ ΠΈΠ»ΠΈ Π²Ρ‹Π΄Π΅Π»ΠΈΡ‚ΡŒ ΠΏΡ€ΠΎΠΈΠ·Π²ΠΎΠ»ΡŒΠ½ΡƒΡŽ ΠΎΠ±Π»Π°ΡΡ‚ΡŒ, стоит Π½Π°Ρ‡Π°Ρ‚ΡŒ с Ρ‡Π΅Π³ΠΎ-Π½ΠΈΠ±ΡƒΠ΄ΡŒ ΠΏΠΎΠΏΡ€ΠΎΡ‰Π΅. Π§Ρ‚ΠΎΠ±Ρ‹ ΡΠ΄Π΅Π»Π°Ρ‚ΡŒ ΠΌΠ°ΠΊΠ΅Ρ‚ Π² Π€ΠΎΡ‚ΠΎΡˆΠΎΠΏΠ΅ , Π½ΡƒΠΆΠ½Ρ‹ хотя Π±Ρ‹ Π½Π°Ρ‡Π°Π»ΡŒΠ½Ρ‹Π΅ Π½Π°Π²Ρ‹ΠΊΠΈ Ρ€Π°Π±ΠΎΡ‚Ρ‹ с ΡƒΡ‚ΠΈΠ»ΠΈΡ‚ΠΎΠΉ ΠΈ ΠΏΠΎΠ½ΠΈΠΌΠ°Π½ΠΈΠ΅ Π±Π°Π·ΠΎΠ²Ρ‹Ρ… Ρ„ΡƒΠ½ΠΊΡ†ΠΈΠΉ (ΠΊΠ°ΠΊ Π½Π°Ρ‡Π΅Ρ€Ρ‚ΠΈΡ‚ΡŒ линию, ΠΏΠΎΡΡ‚Π°Π²ΠΈΡ‚ΡŒ Π½Π°ΠΏΡ€Π°Π²Π»ΡΡŽΡ‰ΡƒΡŽ, Π²Ρ‹Π±Ρ€Π°Ρ‚ΡŒ ΡˆΡ€ΠΈΡ„Ρ‚ ΠΈ Ρ‚ΠΎΠΌΡƒ ΠΏΠΎΠ΄ΠΎΠ±Π½ΠΎΠ΅).

ΠžΠ±Ρ‰Π°Ρ информация ΠΎ сСтСвых сСрвисах Ρ‚ΠΎΠΆΠ΅ пригодится. Π‘Π°ΠΉΡ‚ ΠΌΠΎΠΆΠ½ΠΎ ΠΎΡ…Π°Ρ€Π°ΠΊΡ‚Π΅Ρ€ΠΈΠ·ΠΎΠ²Π°Ρ‚ΡŒ ΠΏΠΎ ΡΠ»Π΅Π΄ΡƒΡŽΡ‰ΠΈΠΌ критСриям:

  • ΠžΠ΄Π½ΠΎΡΡ‚Ρ€Π°Π½ΠΈΡ‡Π½Ρ‹ΠΉ. ВсС элСмСнты, ΠΊΠΎΠ½Ρ‚Π΅Π½Ρ‚, всё Π½Π°ΠΏΠΎΠ»Π½Π΅Π½ΠΈΠ΅ рСсурса находится Π² ΠΎΠ΄Π½ΠΎΠΌ мСстС. На ΠΎΠ΄Π½ΠΎΠΉ страницС. Π§Ρ‚ΠΎΠ±Ρ‹ ΠΏΡ€ΠΎΡΠΌΠΎΡ‚Ρ€Π΅Ρ‚ΡŒ содСрТимоС сСрвиса, Π½Π΅ Π½Π°Π΄ΠΎ ΠΏΠ΅Ρ€Π΅Ρ…ΠΎΠ΄ΠΈΡ‚ΡŒ ΠΏΠΎ ссылкам ΠΈΠ»ΠΈ ΠΎΡ‚ΠΊΡ€Ρ‹Π²Π°Ρ‚ΡŒ Π½ΠΎΠ²Ρ‹Π΅ Π²ΠΊΠ»Π°Π΄ΠΊΠΈ. ΠŸΡ€ΠΈ этом сам сайт ΠΌΠΎΠΆΠ΅Ρ‚ Π±Ρ‹Ρ‚ΡŒ сколь ΡƒΠ³ΠΎΠ΄Π½ΠΎ большим. Π’ Π½Ρ‘ΠΌ помСстится ΠΈ малСнькая рСкламная Π±Ρ€ΠΎΡˆΡŽΡ€Π°, ΠΈ ΠΎΠ³Ρ€ΠΎΠΌΠ½Ρ‹ΠΉ Ρ€ΠΎΠΌΠ°Π½ Π½Π° 600 листов.
  • ΠœΠ½ΠΎΠ³ΠΎΡΡ‚Ρ€Π°Π½ΠΈΡ‡Π½Ρ‹ΠΉ. БоотвСтствСнно, Π²ΠΊΠ»ΡŽΡ‡Π°Π΅Ρ‚ ΠΌΠ½ΠΎΠ³ΠΎ страниц. Π­Ρ‚ΠΎ ΠΌΠΎΠ³ΡƒΡ‚ Π±Ρ‹Ρ‚ΡŒ, Π½Π°ΠΏΡ€ΠΈΠΌΠ΅Ρ€, «Главная», Β«Π€ΠΎΡ€ΡƒΠΌΒ», «ГостСвая ΠΊΠ½ΠΈΠ³Π°Β», Β«ΠžΡ‚Π²Π΅Ρ‚Ρ‹ Π½Π° часто Π·Π°Π΄Π°Π²Π°Π΅ΠΌΡ‹Π΅ вопросы», Β«ΠšΠΎΠ½Ρ‚Π°ΠΊΡ‚Ρ‹Β». Для ΠΊΠ°ΠΆΠ΄ΠΎΠΉ ΠΈΠ· Π½ΠΈΡ… Π½ΡƒΠΆΠ½ΠΎ Π΄Π΅Π»Π°Ρ‚ΡŒ ΠΌΠ°ΠΊΠ΅Ρ‚. Π•Ρ‰Ρ‘ ΠΏΠΎΡ‚Ρ€Π΅Π±ΡƒΡŽΡ‚ΡΡ навигация ΠΈ ΠΊΠ°Ρ€Ρ‚Π° сайта: ΠΎΡ‚Π΄Π΅Π»ΡŒΠ½Ρ‹ΠΉ Ρ€Π°Π·Π΄Π΅Π» со ссылками Π½Π° всС части сСрвиса. Π§Ρ‚ΠΎΠ±Ρ‹ ΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚Π΅Π»ΡŒ ΠΌΠΎΠ³ быстро Π½Π°ΠΉΡ‚ΠΈ Π½ΡƒΠΆΠ½ΡƒΡŽ Π΅ΠΌΡƒ Π·Π°ΠΊΠ»Π°Π΄ΠΊΡƒ.
  • Β«Π Π΅Π·ΠΈΠ½ΠΎΠ²Ρ‹ΠΉΒ». ΠœΠ΅Π½ΡΠ΅Ρ‚ Ρ€Π°Π·ΠΌΠ΅Ρ€ Π² зависимости ΠΎΡ‚ Ρ€Π°Π·Ρ€Π΅ΡˆΠ΅Π½ΠΈΡ экрана. РастягиваСтся вмСстС с ΠΎΠΊΠ½ΠΎΠΌ обозрСватСля. Надо Π·Π°Ρ€Π°Π½Π΅Π΅ Ρ€Π°ΡΡΡ‡ΠΈΡ‚Ρ‹Π²Π°Ρ‚ΡŒ, ΠΊΠ°ΠΊ Π±ΡƒΠ΄Π΅Ρ‚ Π²Ρ‹Π³Π»ΡΠ΄Π΅Ρ‚ΡŒ сайт. Если ΠΏΡ€ΠΈ ΡˆΠΈΡ€ΠΈΠ½Π΅ 1300 всё отобраТаСтся Π½ΠΎΡ€ΠΌΠ°Π»ΡŒΠ½ΠΎ, Ρ‚ΠΎ Π² 900 пиксСлях Ρ‡Π°ΡΡ‚ΡŒ ΡΡ‚Π°Ρ‚ΡŒΠΈ ΠΌΠΎΠΆΠ΅Ρ‚ Β«ΡƒΠ΅Ρ…Π°Ρ‚ΡŒΒ» Π·Π° Π³Ρ€Π°Π½ΠΈΡ†Ρ‹ Ρ„Ρ€Π΅ΠΉΠΌΠ°, изобраТСния встанут Π½Π΅ Ρ‚Π°ΠΊ, ΠΊΠ°ΠΊ Π½Π°Π΄ΠΎ, Π° flash-анимация Π·Π°ΠΊΡ€ΠΎΠ΅Ρ‚ Ρ„ΠΎΡ€ΠΌΡƒ для Π²Π²ΠΎΠ΄Π°.
  • Ѐиксированный. Π’Π΅Π»ΠΎ сайта Π½Π΅ мСняСт Ρ€Π°Π·ΠΌΠ΅Ρ€. Π‘Π°ΠΌΡ‹ΠΉ Π»Ρ‘Π³ΠΊΠΈΠΉ ΠΈ ΠΏΡ€Π°ΠΊΡ‚ΠΈΡ‡Π½Ρ‹ΠΉ Π²Π°Ρ€ΠΈΠ°Π½Ρ‚. Π§Ρ‚ΠΎΠ±Ρ‹ страница выглядСла Ρ†Π΅Π»ΡŒΠ½ΠΎΠΉ, ΠΈ ΠΏΡ€ΠΈ Ρ€Π°ΡΡˆΠΈΡ€Π΅Π½ΠΈΠΈ ΠΎΠΊΠ½Π° Π½Π΅ Π±Ρ‹Π»ΠΎ «пустого» мСста ΠΏΠΎ краям, ΠΌΠΎΠΆΠ½ΠΎ ΡΠ΄Π΅Π»Π°Ρ‚ΡŒ Ρ€Π΅Π·ΠΈΠ½ΠΎΠ²Ρ‹ΠΌ Ρ„ΠΎΠ½.

ΠœΠ°ΠΊΠ΅Ρ‚

Для Π½Π°Ρ‡Π°Π»Π° Ρ€Π΅ΡˆΠΈΡ‚Π΅, ΠΊΠ°ΠΊΠΎΠΉ Π΄ΠΈΠ·Π°ΠΉΠ½ Π²Π°ΠΌ Π½ΡƒΠΆΠ΅Π½. НСдостаточно Π΅Π³ΠΎ просто Β«Π²ΠΎΠΎΠ±Ρ€Π°Π·ΠΈΡ‚ΡŒΒ», Π° ΠΏΠΎΡ‚ΠΎΠΌ ΠΎΡ„ΠΎΡ€ΠΌΠΈΡ‚ΡŒ Π² Π€ΠΎΡ‚ΠΎΡˆΠΎΠΏΠ΅. Π”ΠΎΠ»ΠΆΠ½ΠΎ Π±Ρ‹Ρ‚ΡŒ Ρ‡Ρ‘Ρ‚ΠΊΠΎΠ΅ прСдставлСниС. НачСртитС шаблон Π½Π° ΠΎΠ±Ρ‹Ρ‡Π½ΠΎΠΉ Π±ΡƒΠΌΠ°Π³Π΅. НС Π½ΡƒΠΆΠ½ΠΎ ΠΏΠ΅Ρ€Π΅Ρ€ΠΈΡΠΎΠ²Ρ‹Π²Π°Ρ‚ΡŒ ΠΊΠ°ΠΆΠ΄ΡƒΡŽ ΠΊΠ°Ρ€Ρ‚ΠΈΠ½ΠΊΡƒ. Достаточно схСмы: нСсколько ΠΏΡ€ΡΠΌΠΎΡƒΠ³ΠΎΠ»ΡŒΠ½ΠΈΠΊΠΎΠ² ΠΈ ΠΊΡ€ΡƒΠΆΠΊΠΎΠ², ΠΊΠΎΡ‚ΠΎΡ€Ρ‹Π΅ условно ΠΎΠ±ΠΎΠ·Π½Π°Ρ‡Π°ΡŽΡ‚ элСмСнты Π²Π΅Π±-страницы . ΠŸΡ€ΠΈΠΊΠΈΠ½ΡŒΡ‚Π΅, ΠΊΠ°ΠΊ Π±ΡƒΠ΄ΡƒΡ‚ Ρ€Π°ΡΠΏΠΎΠ»Π°Π³Π°Ρ‚ΡŒΡΡ Ρ„Ρ€Π΅ΠΉΠΌΡ‹, Π³Π΄Π΅ Π»ΡƒΡ‡ΡˆΠ΅ ΠΏΠΎΡΡ‚Π°Π²ΠΈΡ‚ΡŒ Π»ΠΎΠ³ΠΎΡ‚ΠΈΠΏ, ΠΊΡƒΠ΄Π° ΠΏΠΎΠΌΠ΅ΡΡ‚ΠΈΡ‚ΡŒ ΠΈΠ½Ρ„ΠΎΡ€ΠΌΠ°Ρ†ΠΈΡŽ для посСтитСлСй.

ΠŸΠΎΡΠΌΠΎΡ‚Ρ€ΠΈΡ‚Π΅ ΠΏΡ€ΠΈΠΌΠ΅Ρ€Ρ‹ страниц Π² ΠΈΠ½Ρ‚Π΅Ρ€Π½Π΅Ρ‚Π΅. ΠŸΠΎΠ΄ΡƒΠΌΠ°ΠΉΡ‚Π΅, ΠΊΠ°ΠΊΠΈΠ΅ ΠΈΠ· Π½ΠΈΡ… Π²Π°ΠΌ нравятся ΠΈ ΠΏΠΎΡ‡Π΅ΠΌΡƒ. Π£Π΄ΠΎΠ±Π½ΠΎΠ΅ Π»ΠΈ это располоТСниС Ρ„Ρ€Π΅ΠΉΠΌΠΎΠ², приятныС Ρ†Π²Π΅Ρ‚Π° ΠΈΠ»ΠΈ интСрСсный ΠΏΠΎΠ΄Ρ…ΠΎΠ΄ ΠΊ ΠΎΡ„ΠΎΡ€ΠΌΠ»Π΅Π½ΠΈΡŽ. ΠšΠΎΠΏΠΈΡ€ΠΎΠ²Π°Ρ‚ΡŒ Ρ‡ΡƒΠΆΠΎΠΉ Π΄ΠΈΠ·Π°ΠΉΠ½ Π½Π΅ стоит. Достаточно ΠΏΠΎΠ΄Ρ‡Π΅Ρ€ΠΏΠ½ΡƒΡ‚ΡŒ ΠΈΠ· Π½Π΅Π³ΠΎ Β«Π²Π΄ΠΎΡ…Π½ΠΎΠ²Π΅Π½ΠΈΠ΅Β». ПослС этого ΠΌΠΎΠΆΠ½ΠΎ Ρ€Π°Π·ΠΎΠ±Ρ€Π°Ρ‚ΡŒΡΡ, ΠΊΠ°ΠΊ Π½Π°Ρ€ΠΈΡΠΎΠ²Π°Ρ‚ΡŒ сайт Π² Π€ΠΎΡ‚ΠΎΡˆΠΎΠΏΠ΅.

  • Π‘ΠΎΠ·Π΄Π°ΠΉΡ‚Π΅ Π½ΠΎΠ²Ρ‹ΠΉ Π΄ΠΎΠΊΡƒΠΌΠ΅Π½Ρ‚ (Π€Π°ΠΉΠ» — Π‘ΠΎΠ·Π΄Π°Ρ‚ΡŒ). Π Π°Π·ΠΌΠ΅Ρ€Ρ‹ ΠΏΠΎΠ΄Π±ΠΈΡ€Π°ΡŽΡ‚ΡΡ с расчётом Π½Π° малСнькиС ΠΌΠΎΠ½ΠΈΡ‚ΠΎΡ€Ρ‹ ΠΈΠ»ΠΈ Π½ΠΈΠ·ΠΊΠΎΠ΅ Ρ€Π°Π·Ρ€Π΅ΡˆΠ΅Π½ΠΈΠ΅: 1024Γ—720 пиксСлСй. Π­Ρ‚ΠΎ ΡˆΠΈΡ€ΠΈΠ½Π° Β«ΠΈΠ½Ρ„ΠΎΡ€ΠΌΠ°Ρ†ΠΈΠΎΠ½Π½ΠΎΠΉΒ» части, Π° Π½Π΅ всСго рисунка. Если Π²Ρ‹ Ρ…ΠΎΡ‚ΠΈΡ‚Π΅ страницу Π² 1100 пиксСлСй, Ρ‚ΠΎ Π½Π°Π΄ΠΎ Π΄Π΅Π»Π°Ρ‚ΡŒ Π΄ΠΎΠΊΡƒΠΌΠ΅Π½Ρ‚ ΡˆΠΈΡ€ΠΈΠ½ΠΎΠΉ ΠΎΡ‚ 1300 пиксСлСй. Π”Π»ΠΈΠ½Π°, ΠΏΠΎ сути, Π½Π΅ фиксирована — ΠΎΠ½Π° зависит ΠΎΡ‚ Ρ‚ΠΎΠ³ΠΎ, сколько ΠΊΠΎΠ½Ρ‚Π΅Π½Ρ‚Π° Π²Ρ‹ Ρ…ΠΎΡ‚ΠΈΡ‚Π΅ Ρ€Π°Π·ΠΌΠ΅ΡΡ‚ΠΈΡ‚ΡŒ Π½Π° рСсурсС. Π­Ρ‚ΠΎ Ρ€Π΅ΠΊΠΎΠΌΠ΅Π½Π΄Π°Ρ†ΠΈΠΈ, Π° Π½Π΅ ΠΏΡ€Π°Π²ΠΈΠ»Π°. ΠœΠΎΠΆΠ΅Ρ‚Π΅ ΡΠΎΠ±Ρ€Π°Ρ‚ΡŒ большой ΠΌΠ°ΠΊΠ΅Ρ‚, Ссли Ρ…ΠΎΡ‚ΠΈΡ‚Π΅.
  • Π’ΠΊΠ»ΡŽΡ‡ΠΈΡ‚Π΅ Π»ΠΈΠ½Π΅ΠΉΠΊΠΈ. НаТмитС Ctrl+R ΠΈΠ»ΠΈ ΠΏΠ΅Ρ€Π΅ΠΉΠ΄ΠΈΡ‚Π΅ Π² мСню ΠŸΡ€ΠΎΡΠΌΠΎΡ‚Ρ€ — Π›ΠΈΠ½Π΅ΠΉΠΊΠΈ. Π­Ρ‚ΠΎ ΠΈΠ·ΠΌΠ΅Ρ€ΠΈΡ‚Π΅Π»ΡŒΠ½Π°Ρ шкала. Она появляСтся снаруТи рисунка. Π‘Π΅Π· Π½Π΅Ρ‘ придётся ΠΏΡ€ΠΈΠΊΠΈΠ΄Ρ‹Π²Π°Ρ‚ΡŒ Ρ€Π°Π·ΠΌΠ΅Ρ€Ρ‹ ΠΈ расстояния Β«Π½Π° Π³Π»Π°Π·Β», Ρ‡Ρ‚ΠΎ Π½Π΅ ΠΎΡ‡Π΅Π½ΡŒ Ρ…ΠΎΡ€ΠΎΡˆΠΎ скаТСтся Π½Π° ΠΊΠΎΠ½Π΅Ρ‡Π½ΠΎΠΌ Ρ€Π΅Π·ΡƒΠ»ΡŒΡ‚Π°Ρ‚Π΅. ΠΠ°ΡΡ‚Ρ€ΠΎΠΈΡ‚ΡŒ эту Ρ„ΡƒΠ½ΠΊΡ†ΠΈΡŽ ΠΌΠΎΠΆΠ½ΠΎ Π² мСню Π Π΅Π΄Π°ΠΊΡ‚ΠΈΡ€ΠΎΠ²Π°Π½ΠΈΠ΅ — Установки — Π•Π΄ΠΈΠ½ΠΈΡ†Ρ‹ измСрСния ΠΈ Π»ΠΈΠ½Π΅ΠΉΠΊΠΈ. Π’Π°ΠΌ Π»ΡƒΡ‡ΡˆΠ΅ ΠΏΠΎΠΌΠ΅Π½ΡΡ‚ΡŒ сантимСтры Π½Π° пиксСли, Ρ‡Ρ‚ΠΎΠ±Ρ‹ Ρ€Π°Π±ΠΎΡ‚Π°Ρ‚ΡŒ с ΠΎΠ΄Π½ΠΈΠΌ ΠΏΠ°Ρ€Π°ΠΌΠ΅Ρ‚Ρ€ΠΎΠΌ, Π° Π½Π΅ Π²Ρ‹ΡΡ‡ΠΈΡ‚Ρ‹Π²Π°Ρ‚ΡŒ, сколько Ρ‚ΠΎΡ‡Π΅ΠΊ Π² ΠΎΠ΄Π½ΠΎΠΌ дюймС.
  • Π’Π°ΠΊΠΆΠ΅ слСдуСт Π°ΠΊΡ‚ΠΈΠ²ΠΈΡ€ΠΎΠ²Π°Ρ‚ΡŒ сСтку. ΠŸΡ€ΠΎΡΠΌΠΎΡ‚Ρ€ — ΠŸΠΎΠΊΠ°Π·Π°Ρ‚ΡŒ — Π‘Π΅Ρ‚ΠΊΠ° ΠΈΠ»ΠΈ Ctrl+Π­ (ΠΎΡ‚ΠΊΠ»ΡŽΡ‡ΠΈΡ‚ΡŒ Π΅Ρ‘ ΠΌΠΎΠΆΠ½ΠΎ Ρ‚Π°ΠΊΠΆΠ΅). Π­Ρ‚ΠΎ Π½Π΅ΠΊΠΈΠΉ Π°Π½Π°Π»ΠΎΠ³ Ρ‚Π΅Ρ‚Ρ€Π°Π΄ΠΈ Π² ΠΊΠ»Π΅Ρ‚ΠΊΡƒ. Π’ Π€ΠΎΡ‚ΠΎΡˆΠΎΠΏΠ΅ Π±ΡƒΠ΄ΡƒΡ‚ ΠΎΡ‚ΠΎΠ±Ρ€Π°ΠΆΠ°Ρ‚ΡŒΡΡ Π²Π΅Ρ€Ρ‚ΠΈΠΊΠ°Π»ΡŒΠ½Ρ‹Π΅ ΠΈ Π³ΠΎΡ€ΠΈΠ·ΠΎΠ½Ρ‚Π°Π»ΡŒΠ½Ρ‹Π΅ Π»ΠΈΠ½ΠΈΠΈ. На самом рисункС ΠΎΠ½ΠΈ Π½Π΅ появятся. Π˜Ρ… ΠΌΠΎΠΆΠ½ΠΎ ΡƒΠ²ΠΈΠ΄Π΅Ρ‚ΡŒ Ρ‚ΠΎΠ»ΡŒΠΊΠΎ ΠΏΡ€ΠΈ Ρ€Π΅Π΄Π°ΠΊΡ‚ΠΈΡ€ΠΎΠ²Π°Π½ΠΈΠΈ. Π­Ρ‚Π° функция Π½ΡƒΠΆΠ½Π°, Ρ‡Ρ‚ΠΎΠ±Ρ‹ Ρ€ΠΎΠ²Π½ΠΎ Ρ€Π°ΡΡΡ‚Π°Π²Π»ΡΡ‚ΡŒ элСмСнты шаблона. ΠšΠΎΠΌΡƒ-Ρ‚ΠΎ ΡƒΠ΄ΠΎΠ±Π½Π΅Π΅ Ρ€Π°Π±ΠΎΡ‚Π°Ρ‚ΡŒ с сСткой, ΠΊΠΎΠΌΡƒ-Ρ‚ΠΎ Π±Π΅Π· Π½Π΅Ρ‘. Π›ΡƒΡ‡ΡˆΠ΅Π΅ Π΅Ρ‘ Π²ΠΊΠ»ΡŽΡ‡ΠΈΡ‚ΡŒ, Ссли Π²Ρ‹ Π²ΠΏΠ΅Ρ€Π²Ρ‹Π΅ Π΄Π΅Π»Π°Π΅Ρ‚Π΅ сайт.
  • Π§Ρ‚ΠΎΠ±Ρ‹ Π΅Ρ‘ Π½Π°ΡΡ‚Ρ€ΠΎΠΈΡ‚ΡŒ, ΠΏΠ΅Ρ€Π΅ΠΉΠ΄ΠΈΡ‚Π΅ Π² Π Π΅Π΄Π°ΠΊΡ‚ΠΈΡ€ΠΎΠ²Π°Π½ΠΈΠ΅ — Установки — ΠΠ°ΠΏΡ€Π°Π²Π»ΡΡŽΡ‰ΠΈΠ΅, сСтка ΠΈ Ρ„Ρ€Π°Π³ΠΌΠ΅Π½Ρ‚Ρ‹. Π’Π°ΠΌ ΠΌΠΎΠΆΠ½ΠΎ Π²Ρ‹Π±Ρ€Π°Ρ‚ΡŒ Ρ€Π°Π·ΠΌΠ΅Ρ€ ΠΊΠ»Π΅Ρ‚ΠΎΠΊ, Π° Ρ‚Π°ΠΊΠΆΠ΅ Ρ†Π²Π΅Ρ‚ ΠΈ Ρ‚ΠΈΠΏ Π»ΠΈΠ½ΠΈΠΉ (сплошная, пунктирная, ΠΈΠ· Ρ‚ΠΎΡ‡Π΅ΠΊ).

  • УстановитС Π½Π°ΠΏΡ€Π°Π²Π»ΡΡŽΡ‰ΠΈΠ΅. ΠœΠ΅ΠΆΠ΄Ρƒ Π½ΠΈΠΌΠΈ Π±ΡƒΠ΄Π΅Ρ‚ Π½Π°Ρ…ΠΎΠ΄ΠΈΡ‚ΡŒΡΡ основной ΠΊΠΎΠ½Ρ‚Π΅Π½Ρ‚-рСсурса — фиксированноС Ρ‚Π΅Π»ΠΎ сайта. А Π·Π° Π½ΠΈΠΌΠΈ — Ρ€Π΅Π·ΠΈΠ½ΠΎΠ²Ρ‹ΠΉ Ρ„ΠΎΠ½. Π§Ρ‚ΠΎΠ±Ρ‹ это ΡΠ΄Π΅Π»Π°Ρ‚ΡŒ, Π½Π°ΠΆΠΌΠΈΡ‚Π΅ ΠŸΡ€ΠΎΡΠΌΠΎΡ‚Ρ€ — Новая Π½Π°ΠΏΡ€Π°Π²Π»ΡΡŽΡ‰Π°Ρ. Π’ Π±Π»ΠΎΠΊΠ΅ Β«ΠžΡ€ΠΈΠ΅Π½Ρ‚Π°Ρ†ΠΈΡΒ» ΠΎΡ‚ΠΌΠ΅Ρ‚ΡŒΡ‚Π΅ ΠΏΡƒΠ½ΠΊΡ‚ Β«Π’Π΅Ρ€Ρ‚ΠΈΠΊΠ°Π»ΡŒΠ½Ρ‹ΠΉΒ». Π’ ΠΏΠΎΠ»Π΅ «ПолоТСниС» Π½Π°ΠΏΠΈΡˆΠΈΡ‚Π΅, Π½Π° ΠΊΠ°ΠΊΠΎΠΌ расстояниС ΠΎΡ‚ Π»Π΅Π²ΠΎΠ³ΠΎ края Π±ΡƒΠ΄Π΅Ρ‚ Π½Π°Ρ…ΠΎΠ΄ΠΈΡ‚ΡŒΡΡ ΠΎΠ±ΡŠΠ΅ΠΊΡ‚. ΠžΡ€ΠΈΠ΅Π½Ρ‚ΠΈΡ€ΡƒΠΉΡ‚Π΅ΡΡŒ ΠΏΠΎ шкалС Π»ΠΈΠ½Π΅ΠΉΠΊΠΈ.
  • НуТны Π΄Π²Π΅ Π½Π°ΠΏΡ€Π°Π²Π»ΡΡŽΡ‰ΠΈΠ΅ — справа ΠΈ слСва ΠΎΡ‚ Ρ‚Π΅Π»Π° страницы. РасстояниС ΠΌΠ΅ΠΆΠ΄Ρƒ Π½ΠΈΠΌΠΈ Π΄ΠΎΠ»ΠΆΠ½ΠΎ ΡΠΎΡΡ‚Π°Π²Π»ΡΡ‚ΡŒ максимум 1003 пиксСлСй для дисплССв с Ρ€Π°Π·Ρ€Π΅ΡˆΠ΅Π½ΠΈΠ΅ΠΌ 1024Γ—720. ΠœΠΎΠΆΠ΅Ρ‚Π΅ ΡƒΠΊΠ°Π·Π°Ρ‚ΡŒ Π΄Ρ€ΡƒΠ³ΡƒΡŽ ΡˆΠΈΡ€ΠΈΠ½Ρƒ. Но большиС рСсурсы Π½Π΅ΡƒΠ΄ΠΎΠ±Π½ΠΎ ΠΏΡ€ΠΎΡΠΌΠ°Ρ‚Ρ€ΠΈΠ²Π°Ρ‚ΡŒ Π½Π° ΠΌΠ°Π»Π΅Π½ΡŒΠΊΠΈΡ… ΠΌΠΎΠ½ΠΈΡ‚ΠΎΡ€Π°Ρ….
  • ΠŸΠΎΡ‡Π΅ΠΌΡƒ 1003, Π° Π½Π΅ 1024? Если сайт Π½Π°Π΄ΠΎ ΠΏΡ€ΠΎΠ»ΠΈΡΡ‚Ρ‹Π²Π°Ρ‚ΡŒ (Β«ΡΠΊΡ€ΠΎΠ»Π»ΠΈΡ‚ΡŒΒ») Π²Π½ΠΈΠ·, Π² Π±Ρ€Π°ΡƒΠ·Π΅Ρ€Π΅ Π±ΡƒΠ΄Π΅Ρ‚ Π²Π΅Ρ€Ρ‚ΠΈΠΊΠ°Π»ΡŒΠ½Ρ‹ΠΉ ΠΏΠΎΠ»Π·ΡƒΠ½ΠΎΠΊ для ΠΏΡ€ΠΎΠΊΡ€ΡƒΡ‚ΠΊΠΈ. Π Π°Π·ΠΌΠ΅Ρ€ этого ΠΏΠΎΠ»Π·ΡƒΠ½ΠΊΠ° — ΠΏΡ€ΠΈΠΌΠ΅Ρ€Π½ΠΎ 21 пиксСль. Если Π΅Π³ΠΎ Π½Π΅ ΡƒΡ‡ΠΈΡ‚Ρ‹Π²Π°Ρ‚ΡŒ, появится Π³ΠΎΡ€ΠΈΠ·ΠΎΠ½Ρ‚Π°Π»ΡŒΠ½Ρ‹ΠΉ скролл. И ΠΏΠΎΡΠ΅Ρ‚ΠΈΡ‚Π΅Π»ΡŽ рСсурса придётся Π΄Π²ΠΈΠ³Π°Ρ‚ΡŒ страницу Π²ΠΏΡ€Π°Π²ΠΎ-Π²Π»Π΅Π²ΠΎ, Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΡƒΠ²ΠΈΠ΄Π΅Ρ‚ΡŒ всю ΠΈΠ½Ρ„ΠΎΡ€ΠΌΠ°Ρ†ΠΈΡŽ.
  • Π’Π΅Π»ΠΎ Π΄ΠΎΠ»ΠΆΠ½ΠΎ Π±Ρ‹Ρ‚ΡŒ Π² Ρ†Π΅Π½Ρ‚Ρ€Π΅ холста.

Π­Ρ‚ΠΎ ΠΏΠΎΠ΄Π³ΠΎΡ‚ΠΎΠ²ΠΈΡ‚Π΅Π»ΡŒΠ½Ρ‹Π΅ этапы Ρ€Π°Π±ΠΎΡ‚Ρ‹. Как ΠΎΡ„ΠΎΡ€ΠΌΠΈΡ‚ΡŒ ΠΌΠ°ΠΊΠ΅Ρ‚ Π² Π€ΠΎΡ‚ΠΎΡˆΠΎΠΏΠ΅, зависит ΠΎΡ‚ вашСго вообраТСния ΠΈ вкуса. ΠŸΠΎΡΡ‚ΠΎΠΌΡƒ дальшС Π±ΡƒΠ΄ΡƒΡ‚ Ρ‚ΠΎΠ»ΡŒΠΊΠΎ ΠΎΠ±Ρ‰ΠΈΠ΅ Ρ€Π΅ΠΊΠΎΠΌΠ΅Π½Π΄Π°Ρ†ΠΈΠΈ тСхничСского Ρ…Π°Ρ€Π°ΠΊΡ‚Π΅Ρ€Π°.

  • Для Π½Π°Ρ‡Π°Π»Π° Π²Π°ΡˆΠ΅ΠΌΡƒ ΠΌΠ°ΠΊΠ΅Ρ‚Ρƒ Π½ΡƒΠΆΠ΅Π½ Ρ„ΠΎΠ½. Π•Π³ΠΎ ΠΌΠΎΠΆΠ½ΠΎ ΡΠ΄Π΅Π»Π°Ρ‚ΡŒ ΡΠ°ΠΌΠΎΡΡ‚ΠΎΡΡ‚Π΅Π»ΡŒΠ½ΠΎ ΠΈΠ»ΠΈ ΡΠΊΠ°Ρ‡Π°Ρ‚ΡŒ ΠΈΠ· сСти. БущСствуСт ΠΌΠ½ΠΎΠ³ΠΎ рСсурсов с бСсплатными тСкстурами. НС ΡΡ‚Π°Π²ΡŒΡ‚Π΅ Π½Π° сайт изобраТСния, Π½Π° ΠΊΠΎΡ‚ΠΎΡ€Ρ‹Π΅ Ρ€Π°ΡΠΏΡ€ΠΎΡΡ‚Ρ€Π°Π½ΡΡŽΡ‚ΡΡ авторскиС ΠΏΡ€Π°Π²Π°. НС стоит Π±Ρ€Π°Ρ‚ΡŒ яркий ΠΈΠ»ΠΈ контрастный Ρ„ΠΎΠ½. Π›ΡƒΡ‡ΡˆΠ΅ Π½Π΅ ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚ΡŒ тСкстуры с большим количСством ΠΌΠ΅Π»ΠΊΠΈΡ… Π²Ρ‹Π΄Π΅Π»ΡΡŽΡ‰ΠΈΡ…ΡΡ Π΄Π΅Ρ‚Π°Π»Π΅ΠΉ. Они Π±ΡƒΠ΄ΡƒΡ‚ ΠΎΡ‚Π²Π»Π΅ΠΊΠ°Ρ‚ΡŒ посСтитСля ΠΎΡ‚ Ρ‚Π΅Π»Π° страницы.
  • Если просто ΠΎΡ‚ΠΊΡ€Ρ‹Ρ‚ΡŒ рисунок Π² Π€ΠΎΡ‚ΠΎΡˆΠΎΠΏΠ΅ , ΠΎΠ½ окаТСтся Π½Π° Π½ΠΎΠ²ΠΎΠΉ Π²ΠΊΠ»Π°Π΄ΠΊΠ΅, Π° Π½Π΅ добавится Π² ΠΌΠ°ΠΊΠ΅Ρ‚. Π’Ρ‹Π΄Π΅Π»ΠΈΡ‚Π΅ вСсь Ρ„ΠΎΠ½. Для этого Π½ΡƒΠΆΠ½ΠΎ сочСтаниС клавиш Ctrl+A ΠΈΠ»ΠΈ инструмСнт Β«Π’Ρ‹Π΄Π΅Π»Π΅Π½ΠΈΠ΅Β» (ΠΎΠ½ находится Π½Π° ΠΏΠ°Π½Π΅Π»ΠΈ слСва). Π‘ΠΊΠΎΠΏΠΈΡ€ΡƒΠΉΡ‚Π΅ Π΅Π³ΠΎ ΠΈ Π²ΡΡ‚Π°Π²ΡŒΡ‚Π΅ Π² шаблон.
  • Π’Π°ΠΊΠΆΠ΅ эта опция доступна, Ссли Π½Π°ΠΆΠ°Ρ‚ΡŒ Π Π΅Π΄Π°ΠΊΡ‚ΠΈΡ€ΠΎΠ²Π°Π½ΠΈΠ΅ — Вставка.

  • Π’ спискС справа Π²Π½ΠΈΠ·Ρƒ появится Π½ΠΎΠ²Ρ‹ΠΉ слой. ΠšΠ»ΠΈΠΊΠ½ΠΈΡ‚Π΅ ΠΏΠΎ Π½Π΅ΠΌΡƒ ΠΏΡ€Π°Π²ΠΎΠΉ ΠΊΠ½ΠΎΠΏΠΊΠΎΠΉ ΠΌΡ‹ΡˆΠΈ, Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΠΏΠΎΡΠΌΠΎΡ‚Ρ€Π΅Ρ‚ΡŒ Π²ΠΎΠ·ΠΌΠΎΠΆΠ½Ρ‹Π΅ дСйствия. Π’ мСню Β«ΠŸΠ°Ρ€Π°ΠΌΠ΅Ρ‚Ρ€Ρ‹ слоя» ΠΌΠΎΠΆΠ½ΠΎ ΠΈΠ·ΠΌΠ΅Π½ΠΈΡ‚ΡŒ Π΅Π³ΠΎ имя. Π’ Β«ΠŸΠ°Ρ€Π°ΠΌΠ΅Ρ‚Ρ€Ρ‹ налоТСния» находятся основныС настройки изобраТСния. МоТно ΡΠ΄Π΅Π»Π°Ρ‚ΡŒ Π΅ΠΌΡƒ свСчСниС, тиснСниС, глянСц, ΠΎΠ±Π²ΠΎΠ΄ΠΊΡƒ, Π³Ρ€Π°Π΄ΠΈΠ΅Π½Ρ‚. Если Π²Ρ‹Π±Π΅Ρ€ΠΈΡ‚Π΅ ΠΊΠ°ΠΊΡƒΡŽ-Ρ‚ΠΎ ΠΎΠΏΡ†ΠΈΡŽ, измСнСния сразу отобразятся Π² Π€ΠΎΡ‚ΠΎΡˆΠΎΠΏΠ΅. Π•ΡΡ‚ΡŒ Π½Π°Π±ΠΎΡ€ Π³ΠΎΡ‚ΠΎΠ²Ρ‹Ρ… стилСй. Π’Π°ΠΊ ΠΈΠ· стандартной тСкстуры ΡΠΎΠ·Π΄Π°ΡŽΡ‚ΡΡ ΠΎΡ€ΠΈΠ³ΠΈΠ½Π°Π»ΡŒΠ½Ρ‹Π΅ дизайнСрскиС Ρ€Π΅ΡˆΠ΅Π½ΠΈΡ. И Π½ΠΈΡ‡Π΅Π³ΠΎ Π΄ΠΎΠΏΠΎΠ»Π½ΠΈΡ‚Π΅Π»ΡŒΠ½ΠΎ Ρ€ΠΈΡΠΎΠ²Π°Ρ‚ΡŒ Π½Π΅ Π½Π°Π΄ΠΎ.
  • Кнопка Β«Π€ΠΈΠ»ΡŒΡ‚Ρ€Ρ‹Β» Π΅ΡΡ‚ΡŒ Π² строкС мСню. Π’Π°ΠΌ Π²Ρ‹ Π½Π°ΠΉΠ΄Ρ‘Ρ‚Π΅ Ρ€Π°Π·Π½ΠΎΠΎΠ±Ρ€Π°Π·Π½Ρ‹Π΅ ΠΈΠΌΠΈΡ‚Π°Ρ†ΠΈΠΈ (ΠΏΠ°ΡΡ‚Π΅Π»ΡŒ, Π°ΠΊΠ²Π°Ρ€Π΅Π»ΡŒ, ΠΊΠ°Ρ€Π°Π½Π΄Π°ΡˆΠΈ), стилизации, тСкстуры, эскизы, Π±Π»ΠΈΠΊΠΈ, Ρ€Π°Π·ΠΌΡ‹Ρ‚ΠΈΠ΅.
  • МоТно Π²Ρ‹Π±Ρ€Π°Ρ‚ΡŒ ΠΎΠ΄Π½ΠΎΡ‚ΠΎΠ½Π½Ρ‹ΠΉ Ρ„ΠΎΠ½. Π¦Π²Π΅Ρ‚ зависит ΠΎΡ‚ Π²Π°ΡˆΠΈΡ… Π»ΠΈΡ‡Π½Ρ‹Ρ… ΠΏΡ€Π΅Π΄ΠΏΠΎΡ‡Ρ‚Π΅Π½ΠΈΠΉ. Но Π»ΡƒΡ‡ΡˆΠ΅ Π½Π΅ Π΄Π΅Π»Π°Ρ‚ΡŒ Π΅Π³ΠΎ Ρ‡Ρ‘Ρ€Π½Ρ‹ΠΌ ΠΈΠ»ΠΈ ядовитым. ΠŸΠΎΠ΄ΠΎΠΉΠ΄ΡƒΡ‚ ΠΏΠΎΡΡ‚Π΅Π»ΡŒΠ½Ρ‹Π΅ ΠΈ мягкиС Ρ‚ΠΎΠ½Π° ΠΈΠ»ΠΈ ΠΏΡ€ΠΎΠ·Ρ€Π°Ρ‡Π½Ρ‹Π΅ Ρ…ΠΎΠ»ΠΎΠ΄Π½Ρ‹Π΅ (Π½Π°ΠΏΡ€ΠΈΠΌΠ΅Ρ€, свСтло-сСрый, Π½Π΅ΠΆΠ½ΠΎ-Π³ΠΎΠ»ΡƒΠ±ΠΎΠΉ).
  • ПослС тСкстур ΠΌΠΎΠΆΠ½ΠΎ ΡΠΎΠ±ΠΈΡ€Π°Ρ‚ΡŒ сам сайт. Π’ΠΎΡ‚ Ρ‚ΡƒΡ‚ Π²Π°ΠΌ прСдоставлСна свобода для творчСства.
  • Π§Ρ‚ΠΎΠ±Ρ‹ Π΄ΠΎΠ±Π°Π²ΠΈΡ‚ΡŒ ΠΊΠ°ΠΊΡƒΡŽ-Ρ‚ΠΎ Ρ„ΠΈΠ³ΡƒΡ€Ρƒ (ΠΎΡ‚Ρ€Π΅Π·ΠΎΠΊ, ΠΊΠ²Π°Π΄Ρ€Π°Ρ‚, ΠΎΠ²Π°Π»), Π½Π°ΠΆΠΌΠΈΡ‚Π΅ Π½Π° ΡΠΎΠΎΡ‚Π²Π΅Ρ‚ΡΡ‚Π²ΡƒΡŽΡ‰ΡƒΡŽ ΠΊΠ½ΠΎΠΏΠΊΡƒ справа. Она Π±ΡƒΠ΄Π΅Ρ‚ ΠΈΠΌΠ΅Ρ‚ΡŒ Π²ΠΈΠ΄ ΠΈ Π½Π°Π·Π²Π°Π½ΠΈΠ΅ Ρ‚ΠΎΠ³ΠΎ ΠΎΠ±ΡŠΠ΅ΠΊΡ‚Π°, ΠΊΠΎΡ‚ΠΎΡ€Ρ‹ΠΉ Π² Π΄Π°Π½Π½Ρ‹ΠΉ ΠΌΠΎΠΌΠ΅Π½Ρ‚ Π²Ρ‹Π±Ρ€Π°Π½ для рисования. НапримСр, Β«Π˜Π½ΡΡ‚Ρ€ΡƒΠΌΠ΅Π½Ρ‚ Эллипс», Β«Π˜Π½ΡΡ‚Ρ€ΡƒΠΌΠ΅Π½Ρ‚ ΠœΠ½ΠΎΠ³ΠΎΡƒΠ³ΠΎΠ»ΡŒΠ½ΠΈΠΊΒ». Π’ Π€ΠΎΡ‚ΠΎΡˆΠΎΠΏΠ΅ количСство Ρ„ΠΈΠ³ΡƒΡ€ ΠΎΠ³Ρ€Π°Π½ΠΈΡ‡Π΅Π½ΠΎ. Но ΠΈΡ… ΠΌΠΎΠΆΠ½ΠΎ Π½Π°ΠΉΡ‚ΠΈ Π² ΠΈΠ½Ρ‚Π΅Ρ€Π½Π΅Ρ‚Π΅, ΡΠΊΠ°Ρ‡Π°Ρ‚ΡŒ ΠΈ ΡƒΡΡ‚Π°Π½ΠΎΠ²ΠΈΡ‚ΡŒ Ρ‡Π΅Ρ€Π΅Π· мСню Π Π΅Π΄Π°ΠΊΡ‚ΠΈΡ€ΠΎΠ²Π°Π½ΠΈΠ΅ — Π£ΠΏΡ€Π°Π²Π»Π΅Π½ΠΈΠ΅ Π½Π°Π±ΠΎΡ€Π°ΠΌΠΈ. Π’ ΠΏΠΎΠ»Π΅ Β«Π’ΠΈΠΏΒ» ΡƒΠΊΠ°ΠΆΠΈΡ‚Π΅, ΠΊΠΎΠ»Π»Π΅ΠΊΡ†ΠΈΡŽ ΠΊΠ°ΠΊΠΈΡ… ΠΎΠ±ΡŠΠ΅ΠΊΡ‚ΠΎΠ² Π²Ρ‹ Π·Π°Π³Ρ€ΡƒΠΆΠ°Π΅Ρ‚Π΅.
  • Π’ Ρ€Π°Π·Π½Ρ‹Ρ… вСрсиях ΠΏΡ€ΠΎΠ³Ρ€Π°ΠΌΠΌΡ‹ эти Ρ„ΠΈΠ³ΡƒΡ€Ρ‹ Π²Ρ‹Π·Ρ‹Π²Π°ΡŽΡ‚ΡΡ ΠΏΠΎ-Ρ€Π°Π·Π½ΠΎΠΌΡƒ. Π›ΠΈΠ±ΠΎ ΠΊΠ½ΠΎΠΏΠΊΠΎΠΉ Π² Π²ΠΈΠ΄Π΅ малСнького Ρ‡Ρ‘Ρ€Π½ΠΎΠ³ΠΎ Ρ‚Ρ€Π΅ΡƒΠ³ΠΎΠ»ΡŒΠ½ΠΈΠΊΠ° (ΠΎΠ½Π° справа), Π»ΠΈΠ±ΠΎ ΠΏΠΈΠΊΡ‚ΠΎΠ³Ρ€Π°ΠΌΠΌΠΎΠΉ Π² Π²ΠΈΠ΄Π΅ ΡˆΠ΅ΡΡ‚Π΅Ρ€Ρ‘Π½ΠΊΠΈ, Π»ΠΈΠ±ΠΎ ΠΏΡƒΠ½ΠΊΡ‚ΠΎΠΌ Β«Π€ΠΎΡ€ΠΌΠ° растровой Ρ‚ΠΎΡ‡ΠΊΠΈΒ» (ΠΎΠ½Π° ΠΏΠΎΠ΄ строкой мСню). ΠžΠ±ΡŠΠ΅ΠΊΡ‚Ρ‹ ΠΌΠΎΠΆΠ½ΠΎ ΠΊΠΎΠΌΠ±ΠΈΠ½ΠΈΡ€ΠΎΠ²Π°Ρ‚ΡŒ, Π³Ρ€ΡƒΠΏΠΏΠΈΡ€ΠΎΠ²Π°Ρ‚ΡŒ, Π΄Π΅Π»Π°Ρ‚ΡŒ ΠΈΠ· Π½ΠΈΡ… ΠΊΠΎΠΌΠΏΠΎΠ·ΠΈΡ†ΠΈΠΈ.
  • Π§Ρ‚ΠΎΠ±Ρ‹ ΡΠΎΠ·Π΄Π°Ρ‚ΡŒ тСкстовый Ρ„Ρ€Π΅ΠΉΠΌ, Π½Π°ΠΆΠΌΠΈΡ‚Π΅ Π½Π° ΠΊΠ½ΠΎΠΏΠΊΡƒ Π² Π²ΠΈΠ΄Π΅ Π·Π°Π³Π»Π°Π²Π½ΠΎΠΉ Π±ΡƒΠΊΠ²Ρ‹ Β«TΒ». ΠŸΠΎΡ‚ΠΎΠΌ Π²Ρ‹Π±Π΅Ρ€ΠΈΡ‚Π΅ мСсто, Π³Π΄Π΅ Π΄ΠΎΠ»ΠΆΠ½Ρ‹ Ρ€Π°ΡΠΏΠΎΠ»Π°Π³Π°Ρ‚ΡŒΡΡ символы, ΠΊΠ»ΠΈΠΊΠ½ΠΈΡ‚Π΅ Ρ‚ΡƒΠ΄Π° ΠΈ Π½Π°ΠΏΠ΅Ρ‡Π°Ρ‚Π°ΠΉΡ‚Π΅ Ρ‚ΠΎ, Ρ‡Ρ‚ΠΎ Π²Π°ΠΌ Π½ΡƒΠΆΠ½ΠΎ.
  • ΠšΠ°ΠΆΠ΄Ρ‹ΠΉ элСмСнт Π»ΡƒΡ‡ΡˆΠ΅ ΡΡ‚Π°Π²ΠΈΡ‚ΡŒ Π½Π° ΠΎΡ‚Π΄Π΅Π»ΡŒΠ½Ρ‹ΠΉ слой. Π’Π°ΠΊ Π±ΡƒΠ΄Π΅Ρ‚ ΡƒΠ΄ΠΎΠ±Π½Π΅Π΅ ΠΏΠ΅Ρ€Π΅ΠΌΠ΅Ρ‰Π°Ρ‚ΡŒ ΠΈ Ρ€Π΅Π΄Π°ΠΊΡ‚ΠΈΡ€ΠΎΠ²Π°Ρ‚ΡŒ, Π½Π΅ «задСвая» вСсь сайт. Π§Ρ‚ΠΎΠ±Ρ‹ Π΄ΠΎΠ±Π°Π²ΠΈΡ‚ΡŒ этот ΠΎΠ±ΡŠΠ΅ΠΊΡ‚, ΠΏΠ΅Ρ€Π΅ΠΉΠ΄ΠΈΡ‚Π΅ Π² Π‘Π»ΠΎΠΈ — Новый.

  • Π§Ρ‚ΠΎΠ±Ρ‹ ΡΠΏΡ€ΠΎΠ΅Ρ†ΠΈΡ€ΠΎΠ²Π°Ρ‚ΡŒ ΠΈΠ·ΠΎΠ±Ρ€Π°ΠΆΠ΅Π½ΠΈΠ΅ Π² Π·Π°Ρ€Π°Π½Π΅Π΅ Π²Ρ‹Π±Ρ€Π°Π½Π½ΡƒΡŽ ΠΎΠ±Π»Π°ΡΡ‚ΡŒ, Π²Π½Π°Ρ‡Π°Π»Π΅ Π²Ρ‹Π΄Π΅Π»ΠΈΡ‚Π΅ Π΅Ρ‘, Π° ΠΏΠΎΡ‚ΠΎΠΌ ΠΎΡ‚ΠΊΡ€ΠΎΠΉΡ‚Π΅ Π Π΅Π΄Π°ΠΊΡ‚ΠΈΡ€ΠΎΠ²Π°Π½ΠΈΠ΅ — Π‘ΠΏΠ΅Ρ†ΠΈΠ°Π»ΡŒΠ½Π°Ρ вставка. Π’Π°ΠΌ Π±ΡƒΠ΄ΡƒΡ‚ ΠΎΠΏΡ†ΠΈΠΈ Β«Π’ΡΡ‚Π°Π²ΠΈΡ‚ΡŒ вмСсто» ΠΈ Β«Π’ΡΡ‚Π°Π²ΠΈΡ‚ΡŒ Π·Π° ΠΏΡ€Π΅Π΄Π΅Π»Π°ΠΌΠΈΒ».
  • МоТно Ρ‡Π°ΡΡ‚ΡŒ ΠΎΠ΄Π½ΠΎΠ³ΠΎ рисунка пСрСнСсти Π½Π° Π½ΠΎΠ²Ρ‹ΠΉ слой. Для этого Π½Π°Π΄ΠΎ Π²Ρ‹Π΄Π΅Π»ΠΈΡ‚ΡŒ Π΅Ρ‘, Ρ‰Ρ‘Π»ΠΊΠ½ΡƒΡ‚ΡŒ ΠΏΠΎ Π½Π΅ΠΉ ΠΏΡ€Π°Π²ΠΎΠΉ ΠΊΠ½ΠΎΠΏΠΊΠΎΠΉ ΠΌΡ‹ΡˆΠΈ ΠΈ Π²Ρ‹Π±Ρ€Π°Ρ‚ΡŒ Β«Π’Ρ‹Ρ€Π΅Π·Π°Ρ‚ΡŒ Π½Π° Π½ΠΎΠ²Ρ‹ΠΉ слой».
  • Π‘ Ρ„ΠΈΠ³ΡƒΡ€Π°ΠΌΠΈ, надписями ΠΈ изобраТСниями доступны Ρ‚Π΅ ΠΆΠ΅ ΠΎΠΏΡ†ΠΈΠΈ, Ρ‡Ρ‚ΠΎ ΠΈ с Ρ„ΠΎΠ½ΠΎΠΌ: эффСкты, Ρ„ΠΈΠ»ΡŒΡ‚Ρ€Ρ‹ ΠΈ Ρ‚Π°ΠΊ Π΄Π°Π»Π΅Π΅.
  • Π’ Π€ΠΎΡ‚ΠΎΡˆΠΎΠΏΠ΅ сущСствуСт Π΅Ρ‰Ρ‘ ΠΌΠ½ΠΎΠ³ΠΎ инструмСнтов для рисования: кисти, ΠΏΠ΅Ρ€ΡŒΡ, ΠΊΠ°Ρ€Π°Π½Π΄Π°ΡˆΠΈ.

МоТно ΡΠ΄Π΅Π»Π°Ρ‚ΡŒ качСствСнный рСсурс Π΄Π°ΠΆΠ΅ ΠΈΠ· простых гСомСтричСских ΠΎΠ±ΡŠΠ΅ΠΊΡ‚ΠΎΠ².

Π‘ΡƒΡ‰Π΅ΡΡ‚Π²ΡƒΡŽΡ‚ рСсурсы с бСсплатными ΠΌΠ°ΠΊΠ΅Ρ‚Π°ΠΌΠΈ. Π—Π°Π³Ρ€ΡƒΠ·ΠΈΡ‚Π΅ ΠΈΡ… Π² Photoshop ΠΈ ΠΎΡ‚Ρ€Π΅Π΄Π°ΠΊΡ‚ΠΈΡ€ΡƒΠΉΡ‚Π΅, Ссли Π½Π°Π΄ΠΎ. Π­Ρ‚ΠΎ ΠΏΡ€ΠΎΡ‰Π΅ ΠΈ быстрСС, Ρ‡Π΅ΠΌ Ρ€ΠΈΡΠΎΠ²Π°Ρ‚ΡŒ с нуля.

Как ΠΏΡ€Π΅Π²Ρ€Π°Ρ‚ΠΈΡ‚ΡŒ ΠΌΠ°ΠΊΠ΅Ρ‚ Π² html-Ρ„Π°ΠΉΠ»?

Π’Ρ‹ Ρ€Π°Π·ΠΎΠ±Ρ€Π°Π»ΠΈΡΡŒ, ΠΊΠ°ΠΊ ΡΠΎΠ·Π΄Π°Ρ‚ΡŒ сайт Π² Π€ΠΎΡ‚ΠΎΡˆΠΎΠΏΠ΅, ΠΈ ΠΎΡ„ΠΎΡ€ΠΌΠΈΠ»ΠΈ свой ΠΏΠ΅Ρ€Π²Ρ‹ΠΉ ΠΌΠ°ΠΊΠ΅Ρ‚. Π§Ρ‚ΠΎ с Π½ΠΈΠΌ Π΄Π΅Π»Π°Ρ‚ΡŒ дальшС? Π’Π΅Π΄ΡŒ Π΅Π³ΠΎ нСльзя просто Π·Π°Π³Ρ€ΡƒΠ·ΠΈΡ‚ΡŒ Π½Π° хостинг.

Π•Π³ΠΎ ΠΌΠΎΠΆΠ½ΠΎ ΠΎΡ‚Π΄Π°Ρ‚ΡŒ Π²Π΅Ρ€ΡΡ‚Π°Π»ΡŒΡ‰ΠΈΠΊΡƒ, ΠΊΠΎΡ‚ΠΎΡ€Ρ‹ΠΉ сдСлаСт качСствСнный html-шаблон. Но Π΅ΡΡ‚ΡŒ ΠΈ Π΄Ρ€ΡƒΠ³ΠΎΠΉ Π²Π°Ρ€ΠΈΠ°Π½Ρ‚. Π’ΠΎΡΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚ΡŒΡΡ сСрвисами для ΠΊΠΎΠ½Π²Π΅Ρ€Ρ‚Π°Ρ†ΠΈΠΈ PSD-Ρ„Π°ΠΉΠ»Π° Π² HTML ΠΈ CSS.

  • Psd2Html Converter. ΠŸΠ»Π°Ρ‚Π½Ρ‹ΠΉ ΠΎΠ½Π»Π°ΠΉΠ½-сСрвис. Быстро ΠΊΠΎΠ½Π²Π΅Ρ€Ρ‚ΠΈΡ€ΡƒΠ΅Ρ‚ Ρ„ΠΎΡ€ΠΌΠ°Ρ‚ Photoshop Π² шаблон ΠΈΠ½Ρ‚Π΅Ρ€Π½Π΅Ρ‚-страницы. Π‘ этим рСсурсом Π΄Π°ΠΆΠ΅ ΠΈΠ· нСкачСствСнного ΠΌΠ°ΠΊΠ΅Ρ‚Π° ΠΌΠΎΠΆΠ½ΠΎ ΡΠΎΠ·Π΄Π°Ρ‚ΡŒ ΠΏΡ€ΠΈΠ»ΠΈΡ‡Π½Ρ‹ΠΉ сайт.
  • PSDCenter
  • 40 Dollar Markup.

ΠšΠΎΠ½ΡΡ‚Ρ€ΡƒΠΊΡ‚ΠΎΡ€Ρ‹

ΠœΠ°ΠΊΠ΅Ρ‚Ρ‹ ΠΌΠΎΠΆΠ½ΠΎ ΡΠΎΠ±ΠΈΡ€Π°Ρ‚ΡŒ ΠΈ Π½Π° ΡΠΏΠ΅Ρ†ΠΈΠ°Π»ΡŒΠ½Ρ‹Ρ… сайтах. ΠžΠ±Ρ‹Ρ‡Π½ΠΎ Ρ‚Π°ΠΌ понятный ΠΈ наглядный интСрфСйс. Π’Ρ‹ просто собираСтС шаблон ΠΈΠ· Ρ€Π°Π·Π»ΠΈΡ‡Π½Ρ‹Ρ… Π΄Π΅Ρ‚Π°Π»Π΅ΠΉ. НСкоторыС элСмСнты Π»ΡƒΡ‡ΡˆΠ΅ Ρ€ΠΈΡΠΎΠ²Π°Ρ‚ΡŒ Π² Photoshop. Π’Π°ΠΊ Ρƒ вас получится ΠΎΡ€ΠΈΠ³ΠΈΠ½Π°Π»ΡŒΠ½Ρ‹ΠΉ Π΄ΠΈΠ·Π°ΠΉΠ½. НСсмотря Π½Π° Ρ‚ΠΎ Ρ‡Ρ‚ΠΎ ΠΎΠ½ создан Π½Π° конструкторС.

Π‘ΠΎΠ·Π΄Π°Π½ΠΈΠ΅ ΠΏΡ€ΠΈΠ²Π»Π΅ΠΊΠ°Ρ‚Π΅Π»ΡŒΠ½Ρ‹Ρ… ΠΈ Ρ„ΡƒΠ½ΠΊΡ†ΠΈΠΎΠ½Π°Π»ΡŒΠ½Ρ‹Ρ… Π²Π΅Π±-ΠΌΠ°ΠΊΠ΅Ρ‚ΠΎΠ² — Π½Π΅ΠΎΡ‚ΡŠΠ΅ΠΌΠ»Π΅ΠΌΠ°Ρ Ρ‡Π°ΡΡ‚ΡŒ ΠΆΠΈΠ·Π½ΠΈ Π²Π΅Π±-Π΄ΠΈΠ·Π°ΠΉΠ½Π΅Ρ€Π°. Π’ этом ΡƒΡ€ΠΎΠΊΠ΅ ΠΌΡ‹ Π±ΡƒΠ΄Π΅ΠΌ ΡΠΎΠ·Π΄Π°Π²Π°Ρ‚ΡŒ ΠΏΡ€ΠΎΡ„Π΅ΡΡΠΈΠΎΠ½Π°Π»ΡŒΠ½Ρ‹ΠΉ ΠΌΠ°ΠΊΠ΅Ρ‚ сайта с нуля. Π’ процСссС ΡƒΡ€ΠΎΠΊΠ° Π’Ρ‹ ΡƒΠ·Π½Π°Π΅Ρ‚Π΅ Π½Π΅ΠΊΠΎΡ‚ΠΎΡ€Ρ‹Π΅ ΠΏΠΎΠ»Π΅Π·Π½Ρ‹Π΅ Ρ‚Ρ€ΡŽΠΊΠΈ ΠΏΡ€ΠΈ создании Π΄ΠΈΠ·Π°ΠΉΠ½Π°.

РСсурсы ΡƒΡ€ΠΎΠΊΠ°:

  1. Набор ΠΈΠΊΠΎΠ½ΠΎΠΊ (wefunction.com)
    ΠΠ»ΡŒΡ‚Π΅Ρ€Π½Π°Ρ‚ΠΈΠ²Π½Ρ‹ΠΉ Π½Π°Π±ΠΎΡ€ ΠΈΠΊΠΎΠ½ΠΎΠΊ
  2. Иконка Twitter (iconeden.com)
  3. Π¨Ρ€ΠΈΡ„Ρ‚ Bebas (dafont.com)

Π¨Π°Π³ 1. Mockup

ΠŸΡ€Π΅ΠΆΠ΄Π΅, Ρ‡Π΅ΠΌ ΠΌΡ‹ Π½Π°Ρ‡Π½Π΅ΠΌ ΡΠΎΠ·Π΄Π°Π²Π°Ρ‚ΡŒ ΠΌΠ°ΠΊΠ΅Ρ‚ сайта, Π½ΡƒΠΆΠ½ΠΎ ΡΠΎΠ·Π΄Π°Ρ‚ΡŒ ΠΏΠ»Π°Π½-эскиз Π±ΡƒΠ΄ΡƒΡ‰Π΅Π³ΠΎ ΠΌΠ°ΠΊΠ΅Ρ‚Π°, Π½Π° ΠΊΠΎΡ‚ΠΎΡ€ΠΎΠΌ Π±ΡƒΠ΄Π΅Ρ‚ Π²ΠΈΠ΄Π½Π° Π΅Π³ΠΎ Ρ„ΡƒΠ½ΠΊΡ†ΠΈΠΎΠ½Π°Π»ΡŒΠ½ΠΎΡΡ‚ΡŒ ΠΈ ΠΏΡ€ΠΈΠ±Π»ΠΈΠ·ΠΈΡ‚Π΅Π»ΡŒΠ½Ρ‹ΠΉ внСшний Π²ΠΈΠ΄.

Π¨Π°Π³ 2. Π‘ΠΎΠ·Π΄Π°Π΅ΠΌ Π΄ΠΎΠΊΡƒΠΌΠ΅Π½Ρ‚.

ΠœΡ‹ Π±ΡƒΠ΄Π΅ΠΌ ΡΠΎΠ·Π΄Π°Π²Π°Ρ‚ΡŒ ΠΌΠ°ΠΊΠ΅Ρ‚ сайта ΡˆΠΈΡ€ΠΈΠ½ΠΎΠΉ Π² 960 пиксСлов. Для этого, создайтС Π½ΠΎΠ²Ρ‹ΠΉ Π΄ΠΎΠΊΡƒΠΌΠ΅Π½Ρ‚ Ρ€Π°Π·ΠΌΠ΅Ρ€ΠΎΠΌ 1200Ρ…1500 пиксСлов. Π Π°Π·Ρ€Π΅ΡˆΠ΅Π½ΠΈΠ΅ 72 пиксСла.

Π’Π°ΠΊ, ΠΊΠ°ΠΊ ΠΌΠ°ΠΊΠ΅Ρ‚ сайта Π±ΡƒΠ΄Π΅Ρ‚ ΡˆΠΈΡ€ΠΈΠ½ΠΎΠΉ Π² 960 пиксСлов, Π½Π°ΠΌ Π½ΡƒΠΆΠ½ΠΎ ΠΎΠΏΡ€Π΅Π΄Π΅Π»ΠΈΡ‚ΡŒ эту ΠΎΠ±Π»Π°ΡΡ‚ΡŒ, Π΄ΠΎΠ±Π°Π²ΠΈΠ² Π½Π°ΠΏΡ€Π°Π²Π»ΡΡŽΡ‰ΠΈΠ΅. Π’Ρ‹Π΄Π΅Π»ΠΈΡ‚Π΅ вСсь Π΄ΠΎΠΊΡƒΠΌΠ΅Π½Ρ‚ (Ctrl+A).

ΠŸΠ΅Ρ€Π΅ΠΉΠ΄ΠΈΡ‚Π΅ Π² мСню Π’Ρ‹Π΄Π΅Π»Π΅Π½ΠΈΠ΅ — Π’Ρ€Π°Π½ΡΡ„ΠΎΡ€ΠΌΠΈΡ€ΠΎΠ²Π°Ρ‚ΡŒ Π²Ρ‹Π΄Π΅Π»Π΅Π½Π½ΡƒΡŽ ΠΎΠ±Π»Π°ΡΡ‚ΡŒ (Select > Transform Selection). На ΠΏΠ°Π½Π΅Π»ΠΈ свойств Π² Π²Π΅Ρ€Ρ…Π½Π΅ΠΉ части экрана установитС Π·Π½Π°Ρ‡Π΅Π½ΠΈΠ΅ ΡˆΠΈΡ€ΠΈΠ½Ρ‹ 960 пиксСлов. Π­Ρ‚ΠΎ ΠΈ Π±ΡƒΠ΄Π΅Ρ‚ рабочая ΠΎΠ±Π»Π°ΡΡ‚ΡŒ ΠΌΠ°ΠΊΠ΅Ρ‚Π°.

УстановитС Π½Π°ΠΏΡ€Π°Π²Π»ΡΡŽΡ‰ΠΈΠ΅ Ρ‚ΠΎΡ‡Π½ΠΎ ΠΏΠΎ Π³Ρ€Π°Π½ΠΈΡ†Π°ΠΌ выдСлСния.

Нам Π½ΡƒΠΆΠ½ΠΎ ΡΠΎΠ·Π΄Π°Ρ‚ΡŒ отступ ΠΌΠ΅ΠΆΠ΄Ρƒ краями Ρ€Π°Π±ΠΎΡ‡Π΅ΠΉ области ΠΌΠ°ΠΊΠ΅Ρ‚Π° ΠΈ ΠΎΠ±Π»Π°ΡΡ‚ΡŒΡŽ ΠΊΠΎΠ½Ρ‚Π΅Π½Ρ‚Π°, ΠΊΠΎΡ‚ΠΎΡ€Ρ‹ΠΉ ΠΌΡ‹ Π΄ΠΎΠ±Π°Π²ΠΈΠΌ ΠΏΠΎΠ·ΠΆΠ΅. ΠŸΡ€ΠΈ Π°ΠΊΡ‚ΠΈΠ²Π½ΠΎΠΌ Π²Ρ‹Π΄Π΅Π»Π΅Π½ΠΈΠΈ Π΄ΠΎΠΊΡƒΠΌΠ΅Π½Ρ‚Π°, снова ΠΏΠ΅Ρ€Π΅ΠΉΠ΄ΠΈΡ‚Π΅ Π² мСню Π’Ρ‹Π΄Π΅Π»Π΅Π½ΠΈΠ΅ — Π’Ρ€Π°Π½ΡΡ„ΠΎΡ€ΠΌΠΈΡ€ΠΎΠ²Π°Ρ‚ΡŒ Π²Ρ‹Π΄Π΅Π»Π΅Π½Π½ΡƒΡŽ ΠΎΠ±Π»Π°ΡΡ‚ΡŒ (Select > Transform Selection). Π£ΠΌΠ΅Π½ΡŒΡˆΠΈΡ‚Π΅ Π²Ρ‹Π΄Π΅Π»Π΅Π½ΠΈΠ΅ ΠΏΠΎ ΡˆΠΈΡ€ΠΈΠ½Π΅ Π΄ΠΎ 920 пиксСлов. Π­Ρ‚ΠΎ ΠΎΠ·Π½Π°Ρ‡Π°Π΅Ρ‚, Ρ‡Ρ‚ΠΎ с ΠΊΠ°ΠΆΠ΄ΠΎΠΉ стороны ΠΌΠ°ΠΊΠ΅Ρ‚Π° Π±ΡƒΠ΄Π΅Ρ‚ отступ Π² 20 пиксСлов, Π² ΠΈΡ‚ΠΎΠ³Π΅ всСго это 40 пиксСлов.

УстановитС Π½Π°ΠΏΡ€Π°Π²Π»ΡΡŽΡ‰ΠΈΠ΅ ΠΏΠΎ Π½ΠΎΠ²ΠΎΠΌΡƒ Π²Ρ‹Π΄Π΅Π»Π΅Π½ΠΈΡŽ:

Π¨Π°Π³ 3. Π‘ΠΎΠ·Π΄Π°Π΅ΠΌ ΡˆΠ°ΠΏΠΊΡƒ сайта.

ΠŸΠ΅Ρ€Π΅Ρ…ΠΎΠ΄ΠΈΠΌ ΠΊ созданию шапки сайта. Π‘ΠΎΠ·Π΄Π°ΠΉΡ‚Π΅ Π²Ρ‹Π΄Π΅Π»Π΅Π½ΠΈΠ΅ высотой Π² 465 пиксСлов Π² Π²Π΅Ρ€Ρ…Π½Π΅ΠΉ части ΠΌΠ°ΠΊΠ΅Ρ‚Π°.

Π—Π°Π»Π΅ΠΉΡ‚Π΅ Π²Ρ‹Π΄Π΅Π»Π΅Π½ΠΈΠ΅ сСрым Ρ†Π²Π΅Ρ‚ΠΎΠΌ, Π° Π² дальнСйшСм ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠΉΡ‚Π΅ стили слоя, Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΠΏΡ€ΠΈΠΌΠ΅Π½ΡΡ‚ΡŒ Ρ†Π²Π΅Ρ‚Π° ΠΈ Π³Ρ€Π°Π΄ΠΈΠ΅Π½Ρ‚Ρ‹.

К шапкС Π΄ΠΎΠ±Π°Π²ΠΈΠΌ Π³Ρ€Π°Π΄ΠΈΠ΅Π½Ρ‚Π½ΡƒΡŽ Π·Π°Π»ΠΈΠ²ΠΊΡƒ Ρ‡Π΅Ρ€Π΅Π· ΡΡ‚ΠΈΠ»ΡŒ слоя НалоТСниС Π³Ρ€Π°Π΄ΠΈΠ΅Π½Ρ‚Π° (Gradient Overlay). Π‘ΠΎΠ·Π΄Π°ΠΉΡ‚Π΅ Π³Ρ€Π°Π΄ΠΈΠ΅Π½Ρ‚ ΠΈΠ· Π΄Π²ΡƒΡ… Ρ†Π²Π΅Ρ‚ΠΎΠ².

Π’Π΅ΠΏΠ΅Ρ€ΡŒ шапка Π±ΡƒΠ΄Π΅Ρ‚ Π²Ρ‹Π³Π»ΡΠ΄Π΅Ρ‚ΡŒ Ρ‚Π°ΠΊ:

К шапкС Ρ‚Π΅ΠΏΠ΅Ρ€ΡŒ Π½ΡƒΠΆΠ½ΠΎ Π΄ΠΎΠ±Π°Π²ΠΈΡ‚ΡŒ подсвСтку. Π‘ΠΎΠ·Π΄Π°ΠΉΡ‚Π΅ Π½ΠΎΠ²Ρ‹ΠΉ слой (Ctrl + Alt + Shift + N) ΠΈ Π²Ρ‹Π±Π΅Ρ€ΠΈΡ‚Π΅ ΠΌΡΠ³ΠΊΡƒΡŽ ΠΊΠΈΡΡ‚ΡŒ Ρ€Π°Π·ΠΌΠ΅Ρ€ΠΎΠΌ 600 пиксСлов. Π’Ρ‹Π±Π΅Ρ€ΠΈΡ‚Π΅ Ρ†Π²Π΅Ρ‚ #19535a ΠΈ ΠΊΠΈΡΡ‚ΡŒΡŽ ΠΊΠ»ΠΈΠΊΠ½ΠΈΡ‚Π΅ ΠΎΠ΄ΠΈΠ½ Ρ€Π°Π· Π² Π²Π΅Ρ€Ρ…Π½Π΅ΠΉ Ρ†Π΅Π½Ρ‚Ρ€Π°Π»ΡŒΠ½ΠΎΠΉ части шапки.

Π‘ΠΎΠ·Π΄Π°ΠΉΡ‚Π΅ Π½Π° шапкС Π²Ρ‹Π΄Π΅Π»Π΅Π½ΠΈΠ΅ Π² 110 пиксСлов.

НаТмитС ΠΊΠ»Π°Π²ΠΈΡˆΡƒ Delete , Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΡƒΠ΄Π°Π»ΠΈΡ‚ΡŒ Π²Ρ‹Π΄Π΅Π»Π΅Π½Π½ΡƒΡŽ Ρ‡Π°ΡΡ‚ΡŒ.

Π‘Π»ΠΎΠΉ с подсвСткой соТмитС ΠΏΠΎ Π²Π΅Ρ€Ρ‚ΠΈΠΊΠ°Π»ΠΈ (Ctrl + T) .

НуТно ΡƒΠ±Π΅Π΄ΠΈΡ‚ΡŒΡΡ, Ρ‡Ρ‚ΠΎ свСтовоС пятно Π½Π° шапкС находится Ρ€ΠΎΠ²Π½ΠΎ ΠΏΠΎ Ρ†Π΅Π½Ρ‚Ρ€Ρƒ. Для этого, сдСлайтС Π°ΠΊΡ‚ΠΈΠ²Π½Ρ‹ΠΌΠΈ слои с шапкой ΠΈ подсвСткой ΠΈ Π²Ρ‹Π±Π΅Ρ€ΠΈΡ‚Π΅ инструмСнт ΠŸΠ΅Ρ€Π΅ΠΌΠ΅Ρ‰Π΅Π½ΠΈΠ΅ (Move Tool) (V). На ΠΏΠ°Π½Π΅Π»ΠΈ свойств Π² Π²Π΅Ρ€Ρ…Π½Π΅ΠΉ части экрана Π½Π°ΠΆΠΌΠΈΡ‚Π΅ ΠΊΠ½ΠΎΠΏΠΊΡƒ Π’Ρ‹Ρ€Π°Π²Π½ΠΈΠ²Π°Π½ΠΈΠ΅ Ρ†Π΅Π½Ρ‚Ρ€ΠΎΠ² ΠΏΠΎ Π³ΠΎΡ€ΠΈΠ·ΠΎΠ½Ρ‚Π°Π»ΠΈ (Align Horizontal Centers).

Π‘ΠΎΠ·Π΄Π°ΠΉΡ‚Π΅ Π½ΠΎΠ²Ρ‹ΠΉ слой (Shift + Ctrl + N) ΠΈ нарисуйтС инструмСнтом ΠšΠ°Ρ€Π°Π½Π΄Π°Ρˆ (Pencil Tool) Ρ‚ΠΎΡ‡ΠΊΡƒ, Ρ€Π°Π·ΠΌΠ΅Ρ€ΠΎΠΌ Π² 1 пиксСл. Для рисования ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠΉΡ‚Π΅ Ρ†Π²Π΅Ρ‚ #01bfd2.

Π‘Π³Π»Π°Π΄ΠΈΠΌ края этого слоя, ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΡ Π³Ρ€Π°Π΄ΠΈΠ΅Π½Ρ‚Π½ΡƒΡŽ маску. Π’Ρ‹Π±Π΅Ρ€ΠΈΡ‚Π΅ инструмСнт Π“Ρ€Π°Π΄ΠΈΠ΅Π½Ρ‚ (Gradient Tool) ΠΈ создайтС Π³Ρ€Π°Π΄ΠΈΠ΅Π½Ρ‚, ΠΊΠ°ΠΊ ΠΏΠΎΠΊΠ°Π·Π°Π½ΠΎ Π½ΠΈΠΆΠ΅:

ΠŸΡ€ΠΈΠΌΠ΅Π½ΠΈΡ‚Π΅ Π½ΠΎΠ²Ρ‹ΠΉ слой с маской, ΠΊΠΎΡ‚ΠΎΡ€ΡƒΡŽ Π·Π°Π»Π΅ΠΉΡ‚Π΅ Ρ‚ΠΎΠ»ΡŒΠΊΠΎ Ρ‡Ρ‚ΠΎ созданным Π³Ρ€Π°Π΄ΠΈΠ΅Π½Ρ‚ΠΎΠΌ.

Π¨Π°Π³ 4. Π‘ΠΎΠ·Π΄Π°Π΅ΠΌ ΡƒΠ·ΠΎΡ€

Π’Π΅ΠΏΠ΅Ρ€ΡŒ создадим простой ΡƒΠ·ΠΎΡ€, ΠΊΠΎΡ‚ΠΎΡ€Ρ‹ΠΉ Π΄ΠΎΠ±Π°Π²ΠΈΠΌ ΠΊ шапкС. Π˜Π½ΡΡ‚Ρ€ΡƒΠΌΠ΅Π½Ρ‚ΠΎΠΌ ΠšΠ°Ρ€Π°Π½Π΄Π°Ρˆ (Pencil Tool) Ρ€Π°Π·ΠΌΠ΅Ρ€ΠΎΠΌ Π² 2 пиксСла нарисуйтС Π΄Π²Π΅ Ρ‚ΠΎΡ‡ΠΊΠΈ, ΠΊΠ°ΠΊ ΠΏΠΎΠΊΠ°Π·Π°Π½ΠΎ Π½Π° рисункС. ΠžΡ‚ΠΊΠ»ΡŽΡ‡ΠΈΡ‚Π΅ Π½Π° врСмя Π²ΠΈΠ΄ΠΈΠΌΠΎΡΡ‚ΡŒ Ρ„ΠΎΠ½ΠΎΠ²ΠΎΠ³ΠΎ слоя (ΠΊΠ»ΠΈΠΊΠ½ΠΈΡ‚Π΅ ΠΏΠΎ ΠΈΠΊΠΎΠ½ΠΊΠ΅ Π³Π»Π°Π·Π° ΠΎΠΊΠΎΠ»ΠΎ Ρ„ΠΎΠ½ΠΎΠ²ΠΎΠ³ΠΎ слоя) ΠΈ создайтС ΡƒΠ·ΠΎΡ€ (Π Π΅Π΄Π°ΠΊΡ‚ΠΈΡ€ΠΎΠ²Π°Π½ΠΈΠ΅ — ΠžΠΏΡ€Π΅Π΄Π΅Π»ΠΈΡ‚ΡŒ ΡƒΠ·ΠΎΡ€) (Edit > Define Pattern):

Π‘ΠΎΠ·Π΄Π°ΠΉΡ‚Π΅ Π½ΠΎΠ²Ρ‹ΠΉ слой (Shift + Ctrl + N) ΠΈ помСститС Π΅Π³ΠΎ ΠΏΠΎΠ΄ слой с подсвСткой. Π’Ρ‹Π΄Π΅Π»ΠΈΡ‚Π΅ ΠΎΠ±Π»Π°ΡΡ‚ΡŒ, ΠΊ ΠΊΠΎΡ‚ΠΎΡ€ΠΎΠΉ Π’Ρ‹ Ρ…ΠΎΡ‚ΠΈΡ‚Π΅ ΠΏΡ€ΠΈΠΌΠ΅Π½ΠΈΡ‚ΡŒ ΡƒΠ·ΠΎΡ€ ΠΈ ΠΎΡ‚ΠΊΡ€ΠΎΠΉΡ‚Π΅ ΠΎΠΊΠ½ΠΎ Π’Ρ‹ΠΏΠΎΠ»Π½ΠΈΡ‚ΡŒ Π·Π°Π»ΠΈΠ²ΠΊΡƒ (Fill) (Shift + F5). НаТмитС ОК.

ПослС добавлСния тСкстуры шапка выглядит Ρ‚Π°ΠΊ:

Π‘Π΄Π΅Π»Π°ΠΉΡ‚Π΅ ΠΏΠ»Π°Π²Π½Ρ‹ΠΉ ΠΏΠ΅Ρ€Π΅Ρ…ΠΎΠ΄ ΠΎΡ‚ ΡƒΠ·ΠΎΡ€Π° ΠΊ шапкС: ΠΊ слою с ΡƒΠ·ΠΎΡ€ΠΎΠΌ Π΄ΠΎΠ±Π°Π²ΡŒΡ‚Π΅ маску ΠΈ мягкой ΠΊΠΈΡΡ‚ΡŒΡŽ Π±Π΅Π»ΠΎΠ³ΠΎ Ρ†Π²Π΅Ρ‚Π° (#ffffff) с Π½Π΅ΠΏΡ€ΠΎΠ·Ρ€Π°Ρ‡Π½ΠΎΡΡ‚ΡŒΡŽ 60% ΠΏΡ€ΠΎΠΉΠ΄ΠΈΡ‚Π΅ΡΡŒ ΠΏΠΎ маскС.

Π Π΅Π·ΡƒΠ»ΡŒΡ‚Π°Ρ‚:

Π¨Π°Π³ 5. ДобавляСм Π»ΠΎΠ³ΠΎΡ‚ΠΈΠΏ

ΠŸΠ΅Ρ€Π΅Ρ…ΠΎΠ΄ΠΈΠΌ ΠΊ добавлСнию Π»ΠΎΠ³ΠΎΡ‚ΠΈΠΏΠ°. Π’Ρ‹Π±Π΅Ρ€ΠΈΡ‚Π΅ ΠΌΡΠ³ΠΊΡƒΡŽ ΠΊΠΈΡΡ‚ΡŒ с Ρ†Π²Π΅Ρ‚ΠΎΠΌ #19535a ΠΈ нарисуйтС пятно.

ΠΠ°ΠΏΠΈΡˆΠΈΡ‚Π΅ тСкст:

К слою с Π»ΠΎΠ³ΠΎΡ‚ΠΈΠΏΠΎΠΌ Π΄ΠΎΠ±Π°Π²ΡŒΡ‚Π΅ ΡΡ‚ΠΈΠ»ΡŒ слоя ВСнь (Drop Shadow).

Π¨Π°Π³ 6. Навигация

Π”ΠΎΠ±Π°Π²ΡŒΡ‚Π΅ тСкст для Π½Π°Π²ΠΈΠ³Π°Ρ†ΠΈΠΈ.

НарисуйтС ΠΊΠ½ΠΎΠΏΠΊΡƒ Π½Π°Π²ΠΈΠ³Π°Ρ†ΠΈΠΈ, ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΡ инструмСнт (Rectangular Marquee Tool). Π—Π°Π»Π΅ΠΉΡ‚Π΅ Π²Ρ‹Π΄Π΅Π»Π΅Π½ΠΈΠ΅ Π»ΡŽΠ±Ρ‹ΠΌ Ρ†Π²Π΅Ρ‚ΠΎΠΌ ΠΈ ΡƒΠΌΠ΅Π½ΡŒΡˆΠΈΡ‚Π΅ ΠΏΠ°Ρ€Π°ΠΌΠ΅Ρ‚Ρ€ Π—Π°Π»ΠΈΠ²ΠΊΠ° Π΄ΠΎ нуля.

К слою с ΠΊΠ½ΠΎΠΏΠΊΠΎΠΉ Π΄ΠΎΠ±Π°Π²ΡŒΡ‚Π΅ ΡΡ‚ΠΈΠ»ΡŒ НалоТСниС Π³Ρ€Π°Π΄ΠΈΠ΅Π½Ρ‚Π° (Gradient Overlay).

Π¨Π°Π³ 7. Π‘Π»Π°ΠΉΠ΄Π΅Ρ€ для ΠΊΠΎΠ½Ρ‚Π΅Π½Ρ‚Π°

Π‘ΠΎΠ·Π΄Π°ΠΉΡ‚Π΅ Π²Ρ‹Π΄Π΅Π»Π΅Π½ΠΈΠ΅ Ρ€Π°Π·ΠΌΠ΅Ρ€ΠΎΠΌ 580Ρ…295 пиксСлов.

Π—Π°Π»Π΅ΠΉΡ‚Π΅ Π²Ρ‹Π΄Π΅Π»Π΅Π½ΠΈΠ΅ Π»ΡŽΠ±Ρ‹ΠΌ ΠΎΡ‚Ρ‚Π΅Π½ΠΊΠΎΠΌ сСрого.

ΠŸΠΎΠΌΠ΅ΡΡ‚ΠΈΡ‚Π΅ ΠΈΠ·ΠΎΠ±Ρ€Π°ΠΆΠ΅Π½ΠΈΠ΅. Π—Π°ΠΊΡ€Π΅ΠΏΠΈΡ‚Π΅ Π΅Π³ΠΎ со слоСм, ΠΊΠΎΡ‚ΠΎΡ€Ρ‹ΠΉ создали Ρ€Π°Π½Π΅Π΅.

Π’Π΅ΠΏΠ΅Ρ€ΡŒ ΠΊ слайдСру Π΄ΠΎΠ±Π°Π²ΠΈΠΌ эффСкт. Π‘ΠΎΠ·Π΄Π°ΠΉΡ‚Π΅ Π½ΠΎΠ²Ρ‹ΠΉ слой (Shift + Ctrl + N) , Π²Ρ‹Π±Π΅Ρ€ΠΈΡ‚Π΅ ΠšΠΈΡΡ‚ΡŒ (Brush Tool) с Π΄ΠΈΠ°ΠΌΠ΅Ρ‚Ρ€ΠΎΠΌ 400 пиксСлов. ΠžΡ‚ΠΊΡ€ΠΎΠΉΡ‚Π΅ ΠΏΠ°Π»ΠΈΡ‚Ρ€Ρƒ ΠšΠΈΡΡ‚ΡŒ (F5) ΠΈ установитС Ρ‚Π΅ ΠΏΠ°Ρ€Π°ΠΌΠ΅Ρ‚Ρ€Ρ‹, ΠΊΠΎΡ‚ΠΎΡ€Ρ‹Π΅ ΠΏΠΎΠΊΠ°Π·Π°Π½Ρ‹ Π½Π° ΡΠΊΡ€ΠΈΠ½ΡˆΠΎΡ‚Π΅:

Π’Ρ‹Π±Π΅Ρ€ΠΈΡ‚Π΅ Ρ‡Π΅Ρ€Π½Ρ‹ΠΉ Ρ†Π²Π΅Ρ‚ (#000000) ΠΈ нарисуйтС пятно:

Для смягчСния ΠΊΡ€Π°Π΅Π² ΠΏΡ€ΠΈΠΌΠ΅Π½ΠΈΡ‚Π΅ Ρ„ΠΈΠ»ΡŒΡ‚Ρ€ Π Π°Π·ΠΌΡ‹Ρ‚ΠΈΠ΅ ΠΏΠΎ Гауссу (Gaussian Blur).

Π’Ρ‹Π΄Π΅Π»ΠΈΡ‚Π΅ ниТнюю ΠΏΠΎΠ»ΠΎΠ²ΠΈΠ½Ρƒ Ρ‚Π΅Π½ΠΈ ΠΈ ΡƒΠ΄Π°Π»ΠΈΡ‚Π΅ (Delete) .

ΠŸΠΎΠΌΠ΅ΡΡ‚ΠΈΡ‚Π΅ слой с Ρ‚Π΅Π½ΡŒΡŽ Π½Π°Π΄ слайдСром:

Π‘ΠΎΠΆΠΌΠΈΡ‚Π΅ слой с Ρ‚Π΅Π½ΡŒΡŽ Π·Π° срСдний ΠΌΠ°Ρ€ΠΊΠ΅Ρ€ (Ctrl + T) , Π° Π·Π°Ρ‚Π΅ΠΌ снова ΠΎΡ‚Ρ†Π΅Π½Ρ‚Ρ€ΠΈΡ€ΡƒΠΉΡ‚Π΅ слой с Ρ‚Π΅Π½ΡŒΡŽ: Π²Ρ‹Π΄Π΅Π»ΠΈΡ‚Π΅ ΠΎΠ±Π° слоя ΠΈ Π² ΠΏΠ°Π½Π΅Π»ΠΈ свойств Π½Π°ΠΆΠΌΠΈΡ‚Π΅ Π½Π° ΠΊΠ½ΠΎΠΏΠΊΡƒ Π’Ρ‹Ρ€Π°Π²Π½ΠΈΠ²Π°Π½ΠΈΠ΅ Ρ†Π΅Π½Ρ‚Ρ€ΠΎΠ² ΠΏΠΎ Π³ΠΎΡ€ΠΈΠ·ΠΎΠ½Ρ‚Π°Π»ΠΈ (Align Horizontal Centers).

Π”ΡƒΠ±Π»ΠΈΡ€ΡƒΠΉΡ‚Π΅ слой с Ρ‚Π΅Π½ΡŒΡŽ (Ctrl + J) ΠΈ помСститС Π΄ΡƒΠ±Π»ΠΈΠΊΠ°Ρ‚ Π½Π° Π½ΠΈΠΆΠ½ΠΈΠΉ ΠΊΡ€Π°ΠΉ слайдСра.

НарисуйтС ΠΊΠ½ΠΎΠΏΠΊΠΈ Π½Π° слайдСрС, ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΡ инструмСнт ΠŸΡ€ΡΠΌΠΎΡƒΠ³ΠΎΠ»ΡŒΠ½Π°Ρ ΠΎΠ±Π»Π°ΡΡ‚ΡŒ выдСлСния (Rectangular Marqee Tool) . Π—Π°Π»Π΅ΠΉΡ‚Π΅ ΠΊΠ½ΠΎΠΏΠΊΠΈ Ρ‡Π΅Ρ€Π½Ρ‹ΠΌ Ρ†Π²Π΅Ρ‚ΠΎΠΌ (#000000).

Π£ΠΌΠ΅Π½ΡŒΡˆΠΈΡ‚Π΅ Π½Π΅ΠΏΡ€ΠΎΠ·Ρ€Π°Ρ‡Π½ΠΎΡΡ‚ΡŒ слоя с ΠΊΠ½ΠΎΠΏΠΊΠ°ΠΌΠΈ Π΄ΠΎ 50%.

Π”ΠΎΠ±Π°Π²ΡŒΡ‚Π΅ Ρ„ΠΈΠ³ΡƒΡ€Ρƒ стрСлки Π½Π° ΠΊΠ½ΠΎΠΏΠΊΠΈ слайдСра:

На Π½ΠΈΠΆΠ½Π΅ΠΉ части слайдСра нарисуйтС полосу ΠΈ Π·Π°Π»Π΅ΠΉΡ‚Π΅ Π΅Π΅ Ρ‡Π΅Ρ€Π½Ρ‹ΠΌ Ρ†Π²Π΅Ρ‚ΠΎΠΌ (#000000).

Π£ΠΌΠ΅Π½ΡŒΡˆΠΈΡ‚Π΅ Π½Π΅ΠΏΡ€ΠΎΠ·Ρ€Π°Ρ‡Π½ΠΎΡΡ‚ΡŒ слоя с полосой Π΄ΠΎ 50%.

На эту полосу Π΄ΠΎΠ±Π°Π²ΡŒΡ‚Π΅ описаниС Π’Π°ΡˆΠ΅Π³ΠΎ ΠΏΡ€ΠΎΠ΅ΠΊΡ‚Π°:

Π¨Π°Π³ 8. ДобавляСм тСкст с привСтствиСм

ΠΠ°ΠΏΠΈΡˆΠΈΡ‚Π΅ тСкст с привСтствиСм:

Π¨Π°Π³ 9. Π—Π°Π²Π΅Ρ€ΡˆΠ°Π΅ΠΌ Ρ€Π°Π±ΠΎΡ‚Ρƒ Π½Π°Π΄ шапкой сайта

ΠœΡ‹ ΠΏΠΎΡ‡Ρ‚ΠΈ Π·Π°ΠΊΠΎΠ½Ρ‡ΠΈΠ»ΠΈ Ρ€Π°Π±ΠΎΡ‚Ρƒ Π½Π°Π΄ шапкой сайта. Π”ΠΎΠ±Π°Π²ΡŒΡ‚Π΅ Π΅Π»Π΅ Π·Π°ΠΌΠ΅Ρ‚Π½ΡƒΡŽ Ρ‚Π΅Π½ΡŒ ΠΏΡ€ΠΈ ΠΏΠΎΠΌΠΎΡ‰ΠΈ инструмСнта ΠšΠΈΡΡ‚ΡŒ (Brush Tool).

ΠžΡΡ‚Π°Π²ΡŒΡ‚Π΅ ΠΌΠ΅ΠΆΠ΄Ρƒ Ρ‚Π΅Π½ΡŒΡŽ ΠΈ Π·Π°Π³ΠΎΠ»ΠΎΠ²ΠΊΠΎΠΌ пропуск Π² 1 пиксСл.

Π‘ΠΎΠ·Π΄Π°ΠΉΡ‚Π΅ Π½ΠΎΠ²Ρ‹ΠΉ слой ΠΏΠΎΠ΄ слоСм с шапкой (Shift + Ctrl + N) ΠΈ ΠΏΡ€ΠΈΠΌΠ΅Π½ΠΈΡ‚Π΅ ΠΊ Π½Π΅ΠΌΡƒ Π³Ρ€Π°Π΄ΠΈΠ΅Π½Ρ‚.

Π¨Π°Π³ 10. ДобавляСм ΠΊΠ½ΠΎΠΏΠΊΠΈ для слайдСра

НарисуйтС ΠΊΠ½ΠΎΠΏΠΊΠΈ смСны слайдов.

К ΠΎΠ΄Π½ΠΎΠΉ ΠΊΠ½ΠΎΠΏΠΊΠ΅ Π΄ΠΎΠ±Π°Π²ΡŒΡ‚Π΅ ΡΡ‚ΠΈΠ»ΡŒ слоя ВнутрСнняя Ρ‚Π΅Π½ΡŒ (Inner Shadow), Π° Π·Π°Ρ‚Π΅ΠΌ Π΄ΡƒΠ±Π»ΠΈΡ€ΡƒΠΉΡ‚Π΅ слой с ΠΊΠ½ΠΎΠΏΠΊΠΎΠΉ Π½ΡƒΠΆΠ½ΠΎΠ΅ количСство Ρ€Π°Π· (Ctrl + J) .

Π¨Π°Π³ 12. Π‘ΠΎΠ·Π΄Π°Π΅ΠΌ Ρ€Π°Π·Π΄Π΅Π»ΠΈΡ‚Π΅Π»ΡŒ для ΠΊΠΎΠ½Ρ‚Π΅Π½Ρ‚Π°

Π˜Π½ΡΡ‚Ρ€ΡƒΠΌΠ΅Π½Ρ‚ΠΎΠΌ ΠšΠ°Ρ€Π°Π½Π΄Π°Ρˆ (Pencil Tool) ΠΈ нарисуйтС свСтло-ΡΠ΅Ρ€ΡƒΡŽ (#aaaaaa) линию ΡˆΠΈΡ€ΠΈΠ½ΠΎΠΉ Π² 1 пиксСл.

Π”ΠΎΠ±Π°Π²ΡŒΡ‚Π΅ ΠΊ слою с Π»ΠΈΠ½ΠΈΠ΅ΠΉ маску ΠΈ ΠΏΡ€ΠΈ ΠΏΠΎΠΌΠΎΡ‰ΠΈ Π³Ρ€Π°Π΄ΠΈΠ΅Π½Ρ‚Π° сдСлайтС ΠΏΠ»Π°Π²Π½Ρ‹ΠΉ ΠΏΠ΅Ρ€Π΅Ρ…ΠΎΠ΄ Π½Π° краях.

НС судитС ΠΎ ΠΊΠ½ΠΈΠ³Π΅ ΠΏΠΎ ΠΎΠ±Π»ΠΎΠΆΠΊΠ΅ β€” это Ρ…ΠΎΡ€ΠΎΡˆΠ°Ρ пословица. Она Π³ΠΎΠ²ΠΎΡ€ΠΈΡ‚ Π½Π°ΠΌ ΠΎ Ρ‚ΠΎΠΌ, Ρ‡Ρ‚ΠΎ Π½Π΅ Π½ΡƒΠΆΠ½ΠΎ Π±Ρ‹Ρ‚ΡŒ высокомСрными. Но ΠΊΠΎΠ³Π΄Π° ΠΌΡ‹ ΠΎΡ‚ΠΊΡ€Ρ‹Π²Π°Π΅ΠΌ Π±Ρ€Π°ΡƒΠ·Π΅Ρ€, ΠΌΡ‹ Π·Π°Π±Ρ‹Π²Π°Π΅ΠΌ ΠΎ вСТливости, ΠΈ, ΠΊΠ°ΠΊ ΠΈ ΠΊΠ°ΠΆΠ΄Ρ‹ΠΉ Π΄Ρ€ΡƒΠ³ΠΎΠΉ ΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚Π΅Π»ΡŒ, ΠΌΡ‹ Ρ‚Ρ€Π΅Π±ΡƒΠ΅ΠΌ ΡΠ°ΠΌΡƒΡŽ ΡΠ²Π΅ΠΆΡƒΡŽ ΠΈΠ½Ρ„ΠΎΡ€ΠΌΠ°Ρ†ΠΈΡŽ, самоС Π»ΡƒΡ‡ΡˆΠ΅Π΅ Π²ΠΈΠ΄Π΅ΠΎ ΠΈ самый друТСствСнный интСрфСйс.

Π”Π°ΠΆΠ΅ Ссли ваш сайт Π±ΡƒΠ΄Π΅Ρ‚ ΠΏΡ€Π΅Π΄Π»Π°Π³Π°Ρ‚ΡŒ Π΄Π΅ΠΉΡΡ‚Π²ΠΈΡ‚Π΅Π»ΡŒΠ½ΠΎ ΡΠΊΡΠΊΠ»ΡŽΠ·ΠΈΠ²Π½Ρ‹ΠΉ ΠΊΠΎΠ½Ρ‚Π΅Π½Ρ‚, Π½ΠΈΠΊΡ‚ΠΎ Π½Π΅ Π±ΡƒΠ΄Π΅Ρ‚ Ρ‡ΠΈΡ‚Π°Ρ‚ΡŒ Π΅Π³ΠΎ Π±Π΅Π· идСального Π΄ΠΈΠ·Π°ΠΉΠ½Π° страницы, ΠΏΠΎΡ‚ΠΎΠΌΡƒ Ρ‡Ρ‚ΠΎ это ΠΎΠ±Π»ΠΎΠΆΠΊΠ° вашСго сайта. Π’ этой ΡΡ‚Π°Ρ‚ΡŒΠ΅ ΠΌΡ‹ расскаТСм, ΠΊΠ°ΠΊ ΡΠΎΠ·Π΄Π°Ρ‚ΡŒ Π»ΡƒΡ‡ΡˆΠΈΠΉ сайт с Π»ΡƒΡ‡ΡˆΠΈΠΌ ΠΌΠ°ΠΊΠ΅Ρ‚ΠΎΠΌ Π²Π΅Π±-Π΄ΠΈΠ·Π°ΠΉΠ½Π°.

Π§Ρ‚ΠΎ Ρ‚Π°ΠΊΠΎΠ΅ ΠΌΠ°ΠΊΠ΅Ρ‚ (ΠΌΠΎΠΊΠ°ΠΏ) сайта?

Π’ ΠΎΡ‚Π»ΠΈΡ‡ΠΈΠ΅ ΠΎΡ‚ Wireframe , ΠΊΠΎΡ‚ΠΎΡ€Ρ‹ΠΉ являСтся простым эскизом Π±ΡƒΠ΄ΡƒΡ‰Π΅Π³ΠΎ сайта, ΠΌΠ°ΠΊΠ΅Ρ‚ β€” это ΠΏΠΎΡ‡Ρ‚ΠΈ вСсь Π΄ΠΈΠ·Π°ΠΉΠ½. Он ΠΎΡ‚ΠΎΠ±Ρ€Π°ΠΆΠ°Π΅Ρ‚ Π½Π΅ Ρ‚ΠΎΠ»ΡŒΠΊΠΎ порядок всСх элСмСнтов, Π½ΠΎ ΠΈ Ρ‚ΠΎΡ‡Π½Ρ‹Π΅ Ρ†Π²Π΅Ρ‚Π°, Ρ„ΠΎΡ€ΠΌΡ‹, Π° Ρ‚Π°ΠΊΠΆΠ΅ Ρ‚ΠΎΡ‡Π½ΠΎΠ΅ Ρ€Π°Π·ΠΌΠ΅Ρ‰Π΅Π½ΠΈΠ΅ элСмСнтов ΠΏΠΎ ΠΎΡ‚Π½ΠΎΡˆΠ΅Π½ΠΈΡŽ Π΄Ρ€ΡƒΠ³ ΠΊ Π΄Ρ€ΡƒΠ³Ρƒ.

Π§Ρ‚ΠΎΠ±Ρ‹ ΠΏΡ€ΠΎΡΡΠ½ΠΈΡ‚ΡŒ Ρ‚Π΅Ρ€ΠΌΠΈΠ½Ρ‹ ΠΌΠ°ΠΊΠ΅Ρ‚, Wireframe ΠΈ ΠΏΡ€ΠΎΡ‚ΠΎΡ‚ΠΈΠΏ, ΠΏΡ€Π΅Π΄ΡΡ‚Π°Π²ΡŒΡ‚Π΅, Ρ‡Ρ‚ΠΎ ΠΎΠ½ΠΈ ΡΠ²Π»ΡΡŽΡ‚ΡΡ шагами ΠΊ ΠΊΠΎΠ½Π΅Ρ‡Π½ΠΎΠΌΡƒ ΠΏΡ€ΠΎΠ΄ΡƒΠΊΡ‚Ρƒ.

ΠœΠ°ΠΊΠ΅Ρ‚ Π² процСссС Ρ€Π°Π·Ρ€Π°Π±ΠΎΡ‚ΠΊΠΈ ΠΏΡ€ΠΎΠ΄ΡƒΠΊΡ‚Π°

ΠŸΠ΅Ρ€Π²Ρ‹ΠΌ шагом являСтся Wireframe , ΠΎΠ½ ΠΎΡ‚Ρ€Π°ΠΆΠ°Π΅Ρ‚ Ρ‚ΠΎΠ»ΡŒΠΊΠΎ элСмСнты, ΠΊΠΎΡ‚ΠΎΡ€Ρ‹Π΅ Π²Ρ‹ Ρ…ΠΎΡ‚ΠΈΡ‚Π΅ Ρ€Π°Π·ΠΌΠ΅ΡΡ‚ΠΈΡ‚ΡŒ Π½Π° сайтС, Π° Ρ‚Π°ΠΊΠΆΠ΅ ΠΈΡ… ΠΏΠΎΠ»ΠΎΠΆΠ΅Π½ΠΈΠ΅ Π½Π° страницС. Wireframe ΠΌΠΎΠΆΠ½ΠΎ Π»Π΅Π³ΠΊΠΎ ΡΠΎΠ·Π΄Π°Ρ‚ΡŒ Π²Ρ€ΡƒΡ‡Π½ΡƒΡŽ.

Π’Ρ‚ΠΎΡ€ΠΎΠΉ шаг β€” это ΠΌΠ°ΠΊΠ΅Ρ‚ Π²Π΅Π±-страницы. На этом этапС Π½ΡƒΠΆΠ½ΠΎ Π²Ρ‹Π±Ρ€Π°Ρ‚ΡŒ ΡΡ‚ΠΈΠ»ΡŒ, Ρ†Π²Π΅Ρ‚ΠΎΠ²ΡƒΡŽ ΠΏΠ°Π»ΠΈΡ‚Ρ€Ρƒ, Ρ„ΠΎΡ€ΠΌΡƒ ΠΈ Π΄ΠΈΠ·Π°ΠΉΠ½ всСх ΠΊΠΎΠΌΠΏΠΎΠ½Π΅Π½Ρ‚ΠΎΠ². Работая Π½Π°Π΄ ΠΌΠ°ΠΊΠ΅Ρ‚ΠΎΠΌ, Π²Ρ‹ смоТСтС ΠΎΡ†Π΅Π½ΠΈΡ‚ΡŒ, насколько эргономичным Π±ΡƒΠ΄Π΅Ρ‚ Π΄ΠΈΠ·Π°ΠΉΠ½, Π° Ρ‚Π°ΠΊΠΆΠ΅ ΠΎΠ±Ρ‰ΠΈΠΉ Π²ΠΈΠ΄ страницы.

ΠŸΡ€ΠΎΡ‚ΠΎΡ‚ΠΈΠΏ прСдставляСт собой ΠΈΠ½Ρ‚Π΅Ρ€Π°ΠΊΡ‚ΠΈΠ²Π½Ρ‹ΠΉ Ρ€Π°Π±ΠΎΡ‡ΠΈΠΉ ΠΏΡ€ΠΎΠ΄ΡƒΠΊΡ‚, ΠΊΠΎΡ‚ΠΎΡ€Ρ‹ΠΉ ΠΌΠΎΠΆΠ½ΠΎ ΠΏΡ€ΠΎΡΠΌΠΎΡ‚Ρ€Π΅Ρ‚ΡŒ. ΠŸΡ€ΠΎΡΡ‚Ρ‹ΠΌ языком β€” это Π³ΠΎΡ‚ΠΎΠ²Ρ‹ΠΉ ΠΏΡ€ΠΎΠ΄ΡƒΠΊΡ‚, оснащСнный ΠΌΠΈΠ½ΠΈΠΌΠ°Π»ΡŒΠ½Ρ‹ΠΌ Ρ„ΡƒΠ½ΠΊΡ†ΠΈΠΎΠ½Π°Π»ΠΎΠΌ.

ΠŸΡ€ΠΎΡ‚ΠΎΡ‚ΠΈΠΏ Π½Π΅ΠΎΠ±Ρ…ΠΎΠ΄ΠΈΠΌ ΠΊΠ°ΠΊ Π΄ΠΎΠΊΠ°Π·Π°Ρ‚Π΅Π»ΡŒΡΡ‚Π²ΠΎ ΠΊΠΎΠ½Ρ†Π΅ΠΏΡ†ΠΈΠΈ, особСнно Ссли Π²Ρ‹ Ρ€Π°Π±ΠΎΡ‚Π°Π΅Ρ‚Π΅ с ΠΏΡ€ΠΈΠ΄ΠΈΡ€Ρ‡ΠΈΠ²Ρ‹ΠΌΠΈ инвСсторами. Если Π²Ρ‹ Ρ…ΠΎΡ‚ΠΈΡ‚Π΅ ΡƒΠ±Π΅Π΄ΠΈΡ‚ΡŒ ΠΈΡ…, Ρ‡Ρ‚ΠΎ ваша идСя Π΄Π΅ΠΉΡΡ‚Π²ΠΈΡ‚Π΅Π»ΡŒΠ½ΠΎ блСстящая, ΠΏΠΎΠΊΠ°ΠΆΠΈΡ‚Π΅ ΠΈΠΌ ΠΏΡ€ΠΎΡ‚ΠΎΡ‚ΠΈΠΏ.

ΠœΠ°ΠΊΠ΅Ρ‚ сайта, для Ρ‡Π΅Π³ΠΎ ΠΎΠ½ Π½ΡƒΠΆΠ΅Π½?

ΠšΠΎΠ½Π΅Ρ‡Π½ΠΎ, ΠΊΠΎΠ³Π΄Π° Π²Ρ‹ Ρ€Π°Π·Ρ€Π°Π±Π°Ρ‚Ρ‹Π²Π°Π΅Ρ‚Π΅ ΠΏΡ€ΠΎΠ΄ΡƒΠΊΡ‚, Ρƒ вас Π² любом случаС Π±ΡƒΠ΄Π΅Ρ‚ Wireframe . ΠŸΡ€ΠΎΡ‚ΠΎΡ‚ΠΈΠΏ β€” это ΠΏΠΎ ТСланию, ΠΎΠ΄Π½Π°ΠΊΠΎ ΠΌΠ°ΠΊΠ΅Ρ‚ Π²Π΅Π±-Π΄ΠΈΠ·Π°ΠΉΠ½Π° Π΄ΠΎΠ»ΠΆΠ΅Π½ ΡΠΎΠ·Π΄Π°Π²Π°Ρ‚ΡŒΡΡ Π² ΠΎΠ±ΡΠ·Π°Ρ‚Π΅Π»ΡŒΠ½ΠΎΠΌ порядкС. Для Ρ‡Π΅Π³ΠΎ? Π”Π°Π²Π°ΠΉΡ‚Π΅ зададимся ΡΠ»Π΅Π΄ΡƒΡŽΡ‰ΠΈΠΌ вопросом β€” ΠΊΠ°ΠΊ ΡΠΎΠ·Π΄Π°Ρ‚ΡŒ ΠΌΠ°ΠΊΠ΅Ρ‚ сайта ΠΈ ΠΏΠΎΠ»ΡƒΡ‡ΠΈΡ‚ΡŒ прСимущСства, ΠΊΠΎΡ‚ΠΎΡ€Ρ‹Π΅ ΠΎΠ½ Π΄Π°Π΅Ρ‚ Π΄ΠΈΠ·Π°ΠΉΠ½Π΅Ρ€Π°ΠΌ ΠΈ Π²Π»Π°Π΄Π΅Π»ΡŒΡ†Π°ΠΌ ΠΏΡ€ΠΎΠ΄ΡƒΠΊΡ‚Π°.


ΠŸΡ€Π΅ΠΈΠΌΡƒΡ‰Π΅ΡΡ‚Π²Π° Ρ€Π°Π·Ρ€Π°Π±ΠΎΡ‚ΠΊΠΈ ΠΌΠ°ΠΊΠ΅Ρ‚Π° сайта

Π‘ ΠΏΠΎΠΌΠΎΡ‰ΡŒΡŽ ΠΌΠ°ΠΊΠ΅Ρ‚Π° Π΄ΠΈΠ·Π°ΠΉΠ½Π° сайта Π΄ΠΈΠ·Π°ΠΉΠ½Π΅Ρ€Ρ‹ ΠΌΠΎΠ³ΡƒΡ‚:

ΠžΠ±Π½Π°Ρ€ΡƒΠΆΠΈΡ‚ΡŒ Π²ΠΎΠ·ΠΌΠΎΠΆΠ½Ρ‹Π΅ ΠΏΡ€ΠΎΠ±Π»Π΅ΠΌΡ‹ Π½Π° Ρ€Π°Π½Π½Π΅ΠΌ этапС

Иногда Π΄ΠΈΠ·Π°ΠΉΠ½, ΠΊΠΎΡ‚ΠΎΡ€Ρ‹ΠΉ ΠΌΡ‹ прСдставляСм, Π² Π΄Π΅ΠΉΡΡ‚Π²ΠΈΡ‚Π΅Π»ΡŒΠ½ΠΎΡΡ‚ΠΈ выглядит ΡΠΎΠ²Π΅Ρ€ΡˆΠ΅Π½Π½ΠΎ Π΄Ρ€ΡƒΠ³ΠΈΠΌ. Когда Π²Ρ‹ Π²ΠΎΠΏΠ»ΠΎΡ‰Π°Π΅Ρ‚Π΅ идСю Π² Ρ€Π΅Π°Π»ΡŒΠ½ΠΎΡΡ‚ΡŒ, Π²Ρ‹ Π²ΠΈΠ΄ΠΈΡ‚Π΅ всС нСдостатки ΠΏΡ€ΠΎΠ΅ΠΊΡ‚Π°. И Π² этот ΠΌΠΎΠΌΠ΅Π½Ρ‚ Π΄ΠΈΠ·Π°ΠΉΠ½Π΅Ρ€ ΠΌΠΎΠΆΠ΅Ρ‚ Π»Π΅Π³ΠΊΠΎ ΠΈΠ·ΠΌΠ΅Π½ΠΈΡ‚ΡŒ Π»ΡŽΠ±ΡƒΡŽ Π΄Π΅Ρ‚Π°Π»ΡŒ, Π΅Π΅ ΡΡ‚ΠΈΠ»ΡŒ, Ρ€Π°Π·ΠΌΠ΅Ρ€ ΠΈΠ»ΠΈ Ρ†Π²Π΅Ρ‚. А Ρ‚Π°ΠΊΠΆΠ΅ ΠΈΡΠΊΠ»ΡŽΡ‡ΠΈΡ‚ΡŒ ΠΈΠ»ΠΈ Π΄ΠΎΠ±Π°Π²ΠΈΡ‚ΡŒ элСмСнт.

ΠŸΡ€Π΅Π΄Π»ΠΎΠΆΠΈΡ‚ΡŒ Π²Π°Ρ€ΠΈΠ°Π½Ρ‚Ρ‹ Π½Π° Π²Ρ‹Π±ΠΎΡ€

Π’ΠΈΠ΄Π΅Π½ΠΈΠ΅ Π΄ΠΈΠ·Π°ΠΉΠ½Π΅Ρ€Π° ΠΈ ΠΊΠ»ΠΈΠ΅Π½Ρ‚Π° Ρ€Π΅Π΄ΠΊΠΎ ΡΠΎΠ²ΠΏΠ°Π΄Π°ΡŽΡ‚. И Ссли Π΄ΠΈΠ·Π°ΠΉΠ½Π΅Ρ€ Ρ…ΠΎΡ‡Π΅Ρ‚ ΠΏΡ€Π΅Π΄Π»ΠΎΠΆΠΈΡ‚ΡŒ Π΄Ρ€ΡƒΠ³ΠΈΠ΅ Ρ€Π΅ΡˆΠ΅Π½ΠΈΡ, ΠΎΠ½ ΠΌΠΎΠΆΠ΅Ρ‚ ΡƒΠ±Π΅Π΄ΠΈΡ‚ΡŒ ΠΊΠ»ΠΈΠ΅Π½Ρ‚Π°, имСя Π½Π° Ρ€ΡƒΠΊΠ°Ρ… Ρ€Π°Π·Π»ΠΈΡ‡Π½Ρ‹Π΅ Π²Π°Ρ€ΠΈΠ°Π½Ρ‚Ρ‹.

Π›Π΅Π³ΠΊΠΎ донСсти своС Π²ΠΈΠ΄Π΅Π½ΠΈΠ΅ Π΄ΠΎ ΠΊΠ»ΠΈΠ΅Π½Ρ‚Π°

Π’Ρ‹ ΠΌΠΎΠΆΠ΅Ρ‚Π΅ Π±Ρ‹Ρ‚ΡŒ Π΄Π΅ΠΉΡΡ‚Π²ΠΈΡ‚Π΅Π»ΡŒΠ½ΠΎ Π²Ρ‹Π΄Π°ΡŽΡ‰ΠΈΠΌΡΡ Π΄ΠΈΠ·Π°ΠΉΠ½Π΅Ρ€ΠΎΠΌ, Π½ΠΎ Ρ‚Π°ΠΊ слоТно ΠΎΠ±ΡŠΡΡΠ½ΠΈΡ‚ΡŒ свою Ρ„Π°Π½Ρ‚Π°ΡΡ‚ΠΈΡ‡Π΅ΡΠΊΡƒΡŽ идСю ΠΊΠ»ΠΈΠ΅Π½Ρ‚Ρƒ! Но, Ссли Π²Ρ‹ ΠΏΠΎΠΊΠ°ΠΆΠ΅Ρ‚Π΅ ΠΌΠ°ΠΊΠ΅Ρ‚, ΠΊΠ»ΠΈΠ΅Π½Ρ‚ ΠΏΠΎΠΉΠΌΠ΅Ρ‚ вашС ΠΏΡ€Π΅Π΄Π»ΠΎΠΆΠ΅Π½ΠΈΠ΅.

ΠœΠ°ΠΊΠ΅Ρ‚ (ΠΌΠΎΠΊΠ°ΠΏ) Π²ΠΈΠ·ΡƒΠ°Π»ΡŒΠ½ΠΎΠ³ΠΎ оформлСния сайта β€” отличная Π²ΠΎΠ·ΠΌΠΎΠΆΠ½ΠΎΡΡ‚ΡŒ ΠΈ для Π²Π»Π°Π΄Π΅Π»ΡŒΡ†Π° ΠΏΡ€ΠΎΠ΄ΡƒΠΊΡ‚Π°, ΠΈ Π²ΠΎΡ‚ ΠΏΠΎΡ‡Π΅ΠΌΡƒ:

ΠŸΡ€ΠΈΠ²Π»Π΅Ρ‡Π΅Π½ΠΈΠ΅ инвСсторов

Если Π²Ρ‹ Ρ…ΠΎΡ‚ΠΈΡ‚Π΅ Π½Π°ΠΉΡ‚ΠΈ инвСсторов для своСго ΠΏΡ€ΠΎΠ΅ΠΊΡ‚Π°, Π»ΡƒΡ‡ΡˆΠ΅ всСго ΠΏΠΎΠ΄Π³ΠΎΡ‚ΠΎΠ²ΠΈΡ‚ΡŒ ΠΏΡ€ΠΎΡ‚ΠΎΡ‚ΠΈΠΏ ΠΏΡ€ΠΎΠ΄ΡƒΠΊΡ‚Π°. Однако это Π±ΡƒΠ΄Π΅Ρ‚ Π΄ΠΎΡ€ΠΎΠΆΠ΅, ΠΈ Π½Π΅Ρ‚ Π½ΠΈΠΊΠ°ΠΊΠΈΡ… Π³Π°Ρ€Π°Π½Ρ‚ΠΈΠΉ, Ρ‡Ρ‚ΠΎ инвСсторы согласятся ΡƒΡ‡Π°ΡΡ‚Π²ΠΎΠ²Π°Ρ‚ΡŒ. Π§Ρ‚ΠΎΠ±Ρ‹ свСсти расходы ΠΊ ΠΌΠΈΠ½ΠΈΠΌΡƒΠΌΡƒ, ΠΌΠΎΠΆΠ½ΠΎ ΠΏΠΎΠΊΠ°Π·Π°Ρ‚ΡŒ ΠΌΠ°ΠΊΠ΅Ρ‚, ΠΈ Ρ‡Π΅ΠΌ ΠΊΡ€ΡƒΡ‡Π΅ ΠΎΠ½ Π±ΡƒΠ΄Π΅Ρ‚ Π²Ρ‹Π³Π»ΡΠ΄Π΅Ρ‚ΡŒ, Ρ‚Π΅ΠΌ большС Ρƒ вас шансов.

ΠœΠ°ΠΊΠ΅Ρ‚ Π² качСствС руководства

Когда ΠΊΠ»ΠΈΠ΅Π½Ρ‚ Π²ΠΈΠ΄ΠΈΡ‚ страницу сайта Β«ΠœΠ°ΠΊΠ΅Ρ‚ Π±ΡƒΠ΄ΡƒΡ‰Π΅Π³ΠΎ ΠΏΡ€ΠΎΠ΄ΡƒΠΊΡ‚Π° Β», ΠΈ, Ссли ΠΎΠ½Π° Π΅ΠΌΡƒ нравится, ΠΎΠ½ ΠΏΠΎΠ½ΠΈΠΌΠ°Π΅Ρ‚, ΠΊΠ°ΠΊ Π±ΡƒΠ΄Π΅Ρ‚ Ρ„ΡƒΠ½ΠΊΡ†ΠΈΠΎΠ½ΠΈΡ€ΠΎΠ²Π°Ρ‚ΡŒ вСсь ΠΏΡ€ΠΎΠ΄ΡƒΠΊΡ‚. Π’Π΅ΠΏΠ΅Ρ€ΡŒ это Π΅Π³ΠΎ Ρ‚ΠΎΡ‡ΠΊΠ° отсчСта, поэтому Π½Π΅Ρ‚ нСобходимости ΠΈΠ·ΠΌΠ΅Π½ΡΡ‚ΡŒ ΠΈ Π΄ΠΎΠ±Π°Π²Π»ΡΡ‚ΡŒ Ρ‡Ρ‚ΠΎ-Π»ΠΈΠ±ΠΎ.

ΠŸΡ€ΠΎΡΡ‚ΠΎΠ΅ внСсСниС ΠΈΠ·ΠΌΠ΅Π½Π΅Π½ΠΈΠΉ

Когда Π²Ρ‹ смотритС Π½Π° ΠΌΠΎΠ½ΠΈΡ‚ΠΎΡ€, Π²Ρ‹ сразу ΠΌΠΎΠΆΠ΅Ρ‚Π΅ ΡƒΠ²ΠΈΠ΄Π΅Ρ‚ΡŒ, Ρ‡Ρ‚ΠΎ выглядит Π½Π΅ Ρ‚Π°ΠΊ ΠΊΠ°ΠΊ Ρ…ΠΎΡ‚Π΅Π»ΠΎΡΡŒ Π±Ρ‹. Π­Ρ‚ΠΎ слишком ΠΌΠ΅Π»ΠΊΠΎΠ΅, это слишком яркоС, Π° эта ΠΊΠ½ΠΎΠΏΠΊΠ° слишком большая. ΠšΠ»ΠΈΠ΅Π½Ρ‚ Π΄Π°Π΅Ρ‚ ΠΊΠΎΠ½ΠΊΡ€Π΅Ρ‚Π½Ρ‹Π΅ инструкции Π΄ΠΈΠ·Π°ΠΉΠ½Π΅Ρ€Ρƒ, Ρ‡Ρ‚ΠΎ ΠΎΠ±Π»Π΅Π³Ρ‡Π°Π΅Ρ‚ послСднСму Тизнь.

Π‘Π°ΠΌΠΎΠ΅ большоС прСимущСство для всСх сторон Π·Π°ΠΊΠ»ΡŽΡ‡Π°Π΅Ρ‚ΡΡ Π² Ρ‚ΠΎΠΌ, Ρ‡Ρ‚ΠΎ ΠΎΠ±Π° Π±ΡƒΠ΄ΡƒΡ‚ счастливы послС Π·Π°Π²Π΅Ρ€ΡˆΠ΅Π½ΠΈΡ Ρ€Π°Π±ΠΎΡ‚Ρ‹ Π½Π°Π΄ ΠΏΡ€ΠΎΠ΅ΠΊΡ‚ΠΎΠΌ. Π”ΠΈΠ·Π°ΠΉΠ½Π΅Ρ€Π°ΠΌ Π½Π΅ придСтся Π²Π½ΠΎΡΠΈΡ‚ΡŒ измСнСния Π² послСднюю ΠΌΠΈΠ½ΡƒΡ‚Ρƒ, Π° ΠΊΠ»ΠΈΠ΅Π½Ρ‚Ρƒ Π΄Π΅ΠΉΡΡ‚Π²ΠΈΡ‚Π΅Π»ΡŒΠ½ΠΎ понравится Ρ‚ΠΎ, Π·Π° Ρ‡Ρ‚ΠΎ ΠΎΠ½ Π·Π°ΠΏΠ»Π°Ρ‚ΠΈΠ».

Как ΡΠΎΠ·Π΄Π°Ρ‚ΡŒ ΠΌΠ°ΠΊΠ΅Ρ‚ (ΠΌΠΎΠΊΠ°ΠΏ) для ΠΏΡ€Π΅Π·Π΅Π½Ρ‚Π°Ρ†ΠΈΠΈ сайта?

Π­Ρ‚ΠΎ Π·Π°ΠΌΠ΅Ρ‡Π°Ρ‚Π΅Π»ΡŒΠ½ΠΎ, Ссли Ρƒ Π΄ΠΈΠ·Π°ΠΉΠ½Π΅Ρ€Π° ΠΌΠ½ΠΎΠ³ΠΎ ΠΈΠ΄Π΅ΠΉ. Π₯отя для создания ΠΌΠ°ΠΊΠ΅Ρ‚Π° сайта, ΠΏΡ€ΠΈΡ‡Π΅ΠΌ Π΄Π΅ΠΉΡΡ‚Π²ΠΈΡ‚Π΅Π»ΡŒΠ½ΠΎ фантастичСского, Π½Π΅ΠΎΠ±Ρ…ΠΎΠ΄ΠΈΠΌΠΎ Π΄ΡƒΠΌΠ°Ρ‚ΡŒ Π½Π΅ Ρ‚ΠΎΠ»ΡŒΠΊΠΎ ΠΎΠ± эстСтичСском наслаТдСнии, Π½ΠΎ ΠΈ ΠΎ Ρ„ΡƒΠ½ΠΊΡ†ΠΈΠΎΠ½Π°Π»ΡŒΠ½ΠΎΡΡ‚ΠΈ создаваСмого ΠΌΠ°ΠΊΠ΅Ρ‚Π°. ΠŸΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚Π΅Π»ΠΈ Π½Π΅ оцСнят ΠΈΠ΄Π΅Π°Π»ΡŒΠ½Ρ‹ΠΉ Π΄ΠΈΠ·Π°ΠΉΠ½, Ссли ΠΎΠ½ Π±ΡƒΠ΄Π΅Ρ‚ Π½Π΅ΡƒΠ΄ΠΎΠ±Π½Ρ‹ΠΌ. ΠœΠ°ΠΊΠ΅Ρ‚ слуТит Π½Π΅ Ρ‚ΠΎΠ»ΡŒΠΊΠΎ для красоты, Π½ΠΎ ΠΈ для удобства ΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚Π΅Π»Π΅ΠΉ.

Π’Ρ‹ ΠΏΠΎΠΌΠ½ΠΈΡ‚Π΅ ΠΎΠΏΡ‹Ρ‚ Mcdonald’s ? Π‘Ρ€Π°Ρ‚ΡŒΡ Π ΠΈΡ‡Π°Ρ€Π΄ ΠΈ ΠœΠΎΡ€ΠΈΡ ΠœΠ°ΠΊΠ΄ΠΎΠ½Π°Π»ΡŒΠ΄Ρ‹ нарисовали Π½Π° ΠΏΠΎΠ»Ρƒ ΠΌΠ°ΠΊΠ΅Ρ‚ своСй ΠΊΡƒΡ…Π½ΠΈ, схСматично ΠΎΠ±ΠΎΠ·Π½Π°Ρ‡ΠΈΠ»ΠΈ порядок всСх ΠΏΡ€Π΅Π΄ΠΌΠ΅Ρ‚ΠΎΠ² ΠΈ заставили своих сотрудников Π΄Π²ΠΈΠ³Π°Ρ‚ΡŒΡΡ Ρ‚Π°ΠΊ, ΠΊΠ°ΠΊ Π±ΡƒΠ΄Ρ‚ΠΎ ΠΎΠ½ΠΈ находятся Π½Π° настоящСй ΠΊΡƒΡ…Π½Π΅. Π’Π°ΠΊΠΈΠΌ ΠΎΠ±Ρ€Π°Π·ΠΎΠΌ, ΠΎΠ½ΠΈ смогли Π²Ρ‹ΡΠ²ΠΈΡ‚ΡŒ ΠΎΠΏΡ‚ΠΈΠΌΠ°Π»ΡŒΠ½ΡƒΡŽ Ρ‚Ρ€Π°Π΅ΠΊΡ‚ΠΎΡ€ΠΈΡŽ для ΠΊΠ°ΠΆΠ΄ΠΎΠ³ΠΎ Ρ€Π°Π±ΠΎΡ‚Π½ΠΈΠΊΠ° Π² соотвСтствии с выполняСмыми ΠΈΠΌ Π·Π°Π΄Π°Ρ‡Π°ΠΌΠΈ. Π­Ρ‚ΠΎ Π±Ρ‹Π» ΠΏΠ΅Ρ€Π²Ρ‹ΠΉ случай, ΠΊΠΎΠ³Π΄Π° Π΄ΠΈΠ·Π°ΠΉΠ½ ΠΏΠΎΠΌΠΎΠ³ ΡΠΎΠΊΡ€Π°Ρ‚ΠΈΡ‚ΡŒ врСмя приготовлСния ΠΏΠΈΡ‰ΠΈ с 10 ΠΌΠΈΠ½ΡƒΡ‚ Π΄ΠΎ 30 сСкунд.

Π­Ρ‚Π° история ΡƒΡ‡ΠΈΡ‚ нас Ρ‚ΠΎΠΌΡƒ, насколько Π΄ΠΈΠ·Π°ΠΉΠ½ Π²Π°ΠΆΠ΅Π½ для ΠΏΡ€ΠΎΠΈΠ·Π²ΠΎΠ΄ΠΈΡ‚Π΅Π»ΡŒΠ½ΠΎΡΡ‚ΠΈ. ΠŸΠΎΡ€ΡΠ΄ΠΎΠΊ размСщСния ΠΊΠ½ΠΎΠΏΠΎΠΊ, Π° Ρ‚Π°ΠΊΠΆΠ΅ ΠΈΡ… Ρ€Π°Π·ΠΌΠ΅Ρ€Ρ‹ Π΄ΠΎΠ»ΠΆΠ½Ρ‹ Π±Ρ‹Ρ‚ΡŒ Π½Π΅ Ρ‚ΠΎΠ»ΡŒΠΊΠΎ красивыми, Π½ΠΎ ΠΈ ΡƒΠ΄ΠΎΠ±Π½Ρ‹ΠΌΠΈ Π² использовании.

Π‘Ρ‹Π²Π°Π΅Ρ‚ Ρ‚Π°ΠΊ, Ρ‡Ρ‚ΠΎ Π²Ρ‹ ΠΎΡ‚ΠΊΡ€Ρ‹Π²Π°Π΅Ρ‚Π΅ Π²Π΅Π»ΠΈΠΊΠΎΠ»Π΅ΠΏΠ½Ρ‹ΠΉ сайт, Π½ΠΎ Π½Π΅ ΠΌΠΎΠΆΠ΅Ρ‚Π΅ Π½Π°ΠΉΡ‚ΠΈ Π½ΡƒΠΆΠ½ΡƒΡŽ ΠΊΠ½ΠΎΠΏΠΊΡƒ ΠΈΠ»ΠΈ Π΄Π°ΠΆΠ΅ Π½Π΅ ΠΏΠΎΠ½ΠΈΠΌΠ°Π΅Ρ‚Π΅ Π΅Π³ΠΎ Ρ†Π΅Π»ΠΈ. Когда Π²Ρ‹ Π³ΠΎΡ‚ΠΎΠ²ΠΈΡ‚Π΅ Π²Π΅Π±-ΠΌΠ°ΠΊΠ΅Ρ‚, ΠΎΠ½ ΠΏΠΎΠΌΠΎΠ³Π°Π΅Ρ‚ Π²Ρ‹ΡΠ²ΠΈΡ‚ΡŒ всС ΠΏΠΎΠ΄ΠΎΠ±Π½Ρ‹Π΅ ΠΏΡ€ΠΎΠ±Π»Π΅ΠΌΡ‹ ΠΈ ΠΎΠΏΡ€Π΅Π΄Π΅Π»ΠΈΡ‚ΡŒ, являСтся Π»ΠΈ Π΄ΠΈΠ·Π°ΠΉΠ½ ΡƒΠ΄ΠΎΠ±Π½Ρ‹ΠΌ для ΠΏΠΎΡ‚Π΅Π½Ρ†ΠΈΠ°Π»ΡŒΠ½Ρ‹Ρ… ΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚Π΅Π»Π΅ΠΉ.

Π§Ρ‚ΠΎΠ±Ρ‹ ΡΠ΄Π΅Π»Π°Ρ‚ΡŒ ΠΌΠ°ΠΊΠ΅Ρ‚ (ΠΌΠΎΠΊΠ°ΠΏ) сайта, ΠΊΠΎΡ‚ΠΎΡ€Ρ‹ΠΉ ΠΏΠΎΠ·Π²ΠΎΠ»ΠΈΡ‚ ΠΎΡ†Π΅Π½ΠΈΡ‚ΡŒ всС Ρ„ΡƒΠ½ΠΊΡ†ΠΈΠΈ ΠΈ удобство использования, Π½ΡƒΠΆΠ½ΠΎ ΡΠΎΠ±Ρ€Π°Ρ‚ΡŒ ΠΌΠ½ΠΎΠ³ΠΎ Ρ€Π°Π·Π»ΠΈΡ‡Π½ΠΎΠΉ ΠΈΠ½Ρ„ΠΎΡ€ΠΌΠ°Ρ†ΠΈΠΈ ΠΎ Π±ΡƒΠ΄ΡƒΡ‰Π΅ΠΌ ΠΏΡ€ΠΎΠ΄ΡƒΠΊΡ‚Π΅:

  • Какова идСя сайта, ΠΊΠ°ΠΊΠΈΠ΅ Ρ„ΡƒΠ½ΠΊΡ†ΠΈΠΈ ΠΎΠ½ Π±ΡƒΠ΄Π΅Ρ‚ Π²ΠΊΠ»ΡŽΡ‡Π°Ρ‚ΡŒ Π² сСбя?
  • КакиС услуги Π±ΡƒΠ΄Π΅Ρ‚ ΠΏΡ€Π΅Π΄ΠΎΡΡ‚Π°Π²Π»ΡΡ‚ΡŒ сайт?
  • ΠšΡ‚ΠΎ являСтся ΠΏΠΎΡ‚Π΅Π½Ρ†ΠΈΠ°Π»ΡŒΠ½Ρ‹ΠΌ ΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚Π΅Π»Π΅ΠΌ Π±ΡƒΠ΄ΡƒΡ‰Π΅Π³ΠΎ ΠΏΡ€ΠΎΠ΄ΡƒΠΊΡ‚Π°?
  • Каков срСдний возраст ΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚Π΅Π»Ρ, Π° Ρ‚Π°ΠΊΠΆΠ΅ сфСра интСрСсов?
  • Π˜Π½Ρ„ΠΎΡ€ΠΌΠ°Ρ†ΠΈΡ ΠΈ Ρ„ΠΎΡ€ΠΌΠ°, Π² ΠΊΠΎΡ‚ΠΎΡ€ΠΎΠΉ сайт Π±ΡƒΠ΄Π΅Ρ‚ Π΅Π΅ ΠΏΡ€Π΅Π΄ΠΎΡΡ‚Π°Π²Π»ΡΡ‚ΡŒ. Какой ΠΊΠΎΠ½Ρ‚Π΅Π½Ρ‚ Π±ΡƒΠ΄Π΅Ρ‚ Ρ€Π°Π·ΠΌΠ΅Ρ‰Π°Ρ‚ΡŒΡΡ Π½Π° сайтС?

Π­Ρ‚ΠΈ Π΄Π°Π½Π½Ρ‹Π΅ Π½Π΅ΠΎΠ±Ρ…ΠΎΠ΄ΠΈΠΌΡ‹ Π½Π΅ Ρ‚ΠΎΠ»ΡŒΠΊΠΎ Ρ€Π°Π·Ρ€Π°Π±ΠΎΡ‚Ρ‡ΠΈΠΊΠ°ΠΌ, Π½ΠΎ ΠΈ Π΄ΠΈΠ·Π°ΠΉΠ½Π΅Ρ€Π°ΠΌ. Π”ΠΈΠ·Π°ΠΉΠ½Π΅Ρ€Ρ‹ ΠΏΠΎ достоинству оцСнят Ρ‚ΠΎ, Ρ‡Ρ‚ΠΎ ΠΊΠ»ΠΈΠ΅Π½Ρ‚ ΠΏΠΎΠΊΠ°Π·Ρ‹Π²Π°Π΅Ρ‚ ΠΈΠΌ ΠΏΠΎΡ…ΠΎΠΆΠΈΠ΅ сайты, Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΠΏΠΎΠ½ΡΡ‚ΡŒ ΠΎΠ±Ρ‰ΡƒΡŽ идСю ΠΏΡ€ΠΎΠ΅ΠΊΡ‚Π°.

ПослС Ρ‚ΠΎΠ³ΠΎ, ΠΊΠ°ΠΊ эта информация Π±ΡƒΠ΄Π΅Ρ‚ собрана, ΠΊΠΎΠΌΠ°Π½Π΄Π° Ρ€Π°Π·Ρ€Π°Π±ΠΎΡ‚Ρ‡ΠΈΠΊΠΎΠ² Π½Π°Ρ‡Π½Π΅Ρ‚ ΠΏΠ»Π°Π½ΠΈΡ€ΠΎΠ²Π°Π½ΠΈΠ΅. Π§Π΅ΠΌ Ρ‚Ρ‰Π°Ρ‚Π΅Π»ΡŒΠ½Π΅Π΅ ΠΎΠ½ΠΈ это ΡΠ΄Π΅Π»Π°ΡŽΡ‚, Ρ‚Π΅ΠΌ Π»ΡƒΡ‡ΡˆΠ΅ для процСсса Ρ€Π°Π·Ρ€Π°Π±ΠΎΡ‚ΠΊΠΈ. Π₯ΠΎΡ€ΠΎΡˆΠΎ ΠΏΡ€ΠΎΠ΄ΡƒΠΌΠ°Π½Π½Ρ‹Π΅ ΠΌΠ°ΠΊΠ΅Ρ‚Ρ‹ (ΠΌΠΎΠΊΠ°ΠΏΡ‹) сайта ΡƒΠΌΠ΅Π½ΡŒΡˆΠ°ΡŽΡ‚ ΠΊΠΎΠ½Π΅Ρ‡Π½ΡƒΡŽ ΡΡ‚ΠΎΠΈΠΌΠΎΡΡ‚ΡŒ Ρ€Π°Π·Ρ€Π°Π±ΠΎΡ‚ΠΊΠΈ ΠΏΡ€ΠΎΠ΄ΡƒΠΊΡ‚Π°.

На этом этапС ΠΊΠΎΠΌΠ°Π½Π΄Π° Π΄ΠΎΠ»ΠΆΠ½Π° ΠΎΡ‚Π²Π΅Ρ‚ΠΈΡ‚ΡŒ Π½Π° вопрос ΠΎ Ρ‚ΠΎΠΌ, Π±ΡƒΠ΄Π΅Ρ‚ Π»ΠΈ Π΄ΠΈΠ·Π°ΠΉΠ½ Π°Π΄Π°ΠΏΡ‚ΠΈΠ²Π½Ρ‹ΠΌ, плоским ΠΈΠ»ΠΈ Π²Ρ‹ΠΏΠΎΠ»Π½Π΅Π½Π½Ρ‹ΠΌ Π² стилС material ?

Π”Ρ€ΡƒΠ³ΠΎΠΉ Π²Π°ΠΆΠ½Ρ‹ΠΉ вопрос, ΠΊΠΎΡ‚ΠΎΡ€Ρ‹ΠΉ Π΄ΠΎΠ»ΠΆΠ΅Π½ Π±Ρ‹Ρ‚ΡŒ спланирован Π·Π°Ρ€Π°Π½Π΅Π΅ β€” ΠΊΠ°ΠΊ Π±ΡƒΠ΄Π΅Ρ‚ Π²Ρ‹Π³Π»ΡΠ΄Π΅Ρ‚ΡŒ мобильная вСрсия сайта. Какой ΠΊΠΎΠ½Ρ‚Π΅Π½Ρ‚ Π±ΡƒΠ΄Π΅Ρ‚ ΠΎΡ‚ΠΎΠ±Ρ€Π°ΠΆΠ°Ρ‚ΡŒΡΡ Π½Π° мобильном устройствС, Π° ΠΊΠ°ΠΊΠΎΠΉ Π½Π΅ Π±ΡƒΠ΄Π΅Ρ‚?

Π‘ ΠΏΠΎΠΌΠΎΡ‰ΡŒΡŽ Π³ΠΎΡ‚ΠΎΠ²ΠΎΠ³ΠΎ ΠΌΠ°ΠΊΠ΅Ρ‚Π° сайта Π΄ΠΈΠ·Π°ΠΉΠ½Π΅Ρ€ смоТСт ΠΎΠ±ΡŠΡΡΠ½ΠΈΡ‚ΡŒ ΠΊΠ»ΠΈΠ΅Π½Ρ‚Ρƒ, ΠΏΠΎΡ‡Π΅ΠΌΡƒ Π½Π΅ΠΊΠΎΡ‚ΠΎΡ€Ρ‹Π΅ элСмСнты Π±Ρ‹Π»ΠΈ сТаты ΠΈΠ»ΠΈ ΡƒΠ΄Π°Π»Π΅Π½Ρ‹, дСмонстрируя наглядныС Π²ΠΈΠ·ΡƒΠ°Π»ΡŒΠ½Ρ‹Π΅ Π΄ΠΎΠΊΠ°Π·Π°Ρ‚Π΅Π»ΡŒΡΡ‚Π²Π°.

КакиС шаги Π½ΡƒΠΆΠ½ΠΎ ΠΏΡ€ΠΎΠ΄ΡƒΠΌΠ°Ρ‚ΡŒ ΠΏΡ€ΠΈ создании ΠΌΠ°ΠΊΠ΅Ρ‚ΠΎΠ² сайта

Π‘ΡƒΡ‰Π΅ΡΡ‚Π²ΡƒΡŽΡ‚ Π½Π΅ΠΊΠΎΡ‚ΠΎΡ€Ρ‹Π΅ Π±Π°Π·ΠΎΠ²Ρ‹Π΅ ΠΏΡ€Π°Π²ΠΈΠ»Π°, ΠΊΠΎΡ‚ΠΎΡ€Ρ‹ΠΌΠΈ Π΄ΠΎΠ»ΠΆΠ½Ρ‹ Ρ€ΡƒΠΊΠΎΠ²ΠΎΠ΄ΡΡ‚Π²ΠΎΠ²Π°Ρ‚ΡŒΡΡ всС Π΄ΠΈΠ·Π°ΠΉΠ½Π΅Ρ€Ρ‹, Ссли ΠΎΠ½ΠΈ хотят ΡΠΎΠ·Π΄Π°Ρ‚ΡŒ простой ΠΌΠ°ΠΊΠ΅Ρ‚ (ΠΌΠΎΠΊΠ°ΠΏ) Π΄ΠΈΠ·Π°ΠΉΠ½Π° сайта, ΠΊΠΎΡ‚ΠΎΡ€Ρ‹ΠΉ ΠΏΡ€ΠΈΠ²Π»Π΅Ρ‡Π΅Ρ‚, ΡƒΠ΄Π΅Ρ€ΠΆΠΈΡ‚ ΠΈ Π½Π°ΠΏΡ€Π°Π²ΠΈΡ‚ Π²Π½ΠΈΠΌΠ°Π½ΠΈΠ΅ ΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚Π΅Π»Π΅ΠΉ Π² Π½ΡƒΠΆΠ½ΠΎΠ΅ Π½Π°ΠΏΡ€Π°Π²Π»Π΅Π½ΠΈΠ΅.


ΠžΡΠ½ΠΎΠ²Π½Ρ‹Π΅ элСмСнты Ρ€Π°Π·Ρ€Π°Π±ΠΎΡ‚ΠΊΠΈ ΠΌΠ°ΠΊΠ΅Ρ‚Π°

Π‘Ρ‚ΠΈΠ»ΡŒ

ПослС Ρ‚ΠΎΠ³ΠΎ, ΠΊΠ°ΠΊ Π²Ρ‹ Π²Ρ‹Π±Ρ€Π°Π»ΠΈ ΡΡ‚ΠΈΠ»ΡŒ, слСдуйтС Π΅ΠΌΡƒ. НСприСмлСмо ΡΠΌΠ΅ΡˆΠΈΠ²Π°Ρ‚ΡŒ элСмСнты ΠΈΠ· Ρ€Π°Π·Π½Ρ‹Ρ… Ρ†Π²Π΅Ρ‚ΠΎΠ²Ρ‹Ρ… ΠΏΠ°Π»ΠΈΡ‚Ρ€. ΠŸΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚Π΅Π»ΡŒ Π·Π°ΠΌΠ΅Ρ‚ΠΈΡ‚ это.

Π›ΠΎΠ³ΠΎΡ‚ΠΈΠΏ

Π”ΠΈΠ·Π°ΠΉΠ½Π΅Ρ€ Π΄ΠΎΠ»ΠΆΠ΅Π½ ΡΠΎΠ·Π΄Π°Ρ‚ΡŒ, Ρ€Π°Π·ΠΌΠ΅ΡΡ‚ΠΈΡ‚ΡŒ ΠΈ ΡΠΊΠΎΡ€Ρ€Π΅ΠΊΡ‚ΠΈΡ€ΠΎΠ²Π°Ρ‚ΡŒ Ρ€Π°Π·ΠΌΠ΅Ρ€ Π»ΠΎΠ³ΠΎΡ‚ΠΈΠΏΠ° Ρ‚Π°ΠΊΠΈΠΌ ΠΎΠ±Ρ€Π°Π·ΠΎΠΌ, Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΠΎΠ½ сразу Π±Ρ‹Π» Π·Π°ΠΌΠ΅Ρ‚Π΅Π½, Π½ΠΎ ΠΏΡ€ΠΈ этом Π½Π΅ выглядСл, ΠΊΠ°ΠΊ бСльмо Π½Π° Π³Π»Π°Π·Ρƒ.

Π‘Ρ‚Ρ€ΡƒΠΊΡ‚ΡƒΡ€Π°

Π˜ΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠΉΡ‚Π΅ сСтку, Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΡΠ΄Π΅Π»Π°Ρ‚ΡŒ ΠΊΠΎΠ½Ρ‚Π΅Π½Ρ‚ Π·Π°ΠΌΠ΅Ρ‚Π½Ρ‹ΠΌ ΠΈ простым. Π₯ΠΎΡ€ΠΎΡˆΠΎ ΡΡ‚Ρ€ΡƒΠΊΡ‚ΡƒΡ€ΠΈΡ€ΠΎΠ²Π°Π½Π½ΡƒΡŽ ΠΈΠ½Ρ„ΠΎΡ€ΠΌΠ°Ρ†ΠΈΡŽ Π²ΠΎΡΠΏΡ€ΠΈΠ½ΠΈΠΌΠ°Ρ‚ΡŒ Π³ΠΎΡ€Π°Π·Π΄ΠΎ Π»Π΅Π³Ρ‡Π΅.

Π­Π»Π΅ΠΌΠ΅Π½Ρ‚Ρ‹ ΠΏΡ€ΠΈΠ·Ρ‹Π²Π° ΠΊ Π΄Π΅ΠΉΡΡ‚Π²ΠΈΡŽ

Кнопки, ΠΊΠΎΡ‚ΠΎΡ€Ρ‹Π΅ Ρ€Π΅ΠΊΠΎΠΌΠ΅Π½Π΄ΡƒΡŽΡ‚ ΡΠΎΠ²Π΅Ρ€ΡˆΠΈΡ‚ΡŒ ΠΏΠΎΠΊΡƒΠΏΠΊΡƒ, ΠΎΡ„ΠΎΡ€ΠΌΠΈΡ‚ΡŒ подписку ΠΈΠ»ΠΈ ΡΠ²ΡΠ·Π°Ρ‚ΡŒΡΡ с ΠΊΠΎΠΌΠΏΠ°Π½ΠΈΠ΅ΠΉ, Π΄ΠΎΠ»ΠΆΠ½Ρ‹ Π²Ρ‹Π΄Π΅Π»ΡΡ‚ΡŒΡΡ. Они Π΄ΠΎΠ»ΠΆΠ½Ρ‹ Π²Ρ‹Π³Π»ΡΠ΄Π΅Ρ‚ΡŒ ΠΏΡ€ΠΈΠ²Π»Π΅ΠΊΠ°Ρ‚Π΅Π»ΡŒΠ½ΠΎ, Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚Π΅Π»ΡŒ Π½Π΅ Ρ‚ΠΎΠ»ΡŒΠΊΠΎ ΠΌΠΎΠ³, Π½ΠΎ ΠΈ Π·Π°Ρ…ΠΎΡ‚Π΅Π» Π²Ρ‹ΠΏΠΎΠ»Π½ΠΈΡ‚ΡŒ ΠΎΠΏΡ€Π΅Π΄Π΅Π»Π΅Π½Π½ΠΎΠ΅ дСйствиС.

Π’Ρ‹Π±ΠΎΡ€ ΠΌΠ°ΠΊΠ΅Ρ‚Π°

Π‘ΠΎΠ²Ρ€Π΅ΠΌΠ΅Π½Π½Ρ‹ΠΉ Π΄ΠΈΠ·Π°ΠΉΠ½ ΠΏΡ€Π΅Π΄Π»Π°Π³Π°Π΅Ρ‚ Ρ‚Ρ€ΠΈ основных Π²ΠΈΠ΄Π° ΠΌΠ°ΠΊΠ΅Ρ‚ΠΎΠ² для размСщСния Π²Π°ΠΆΠ½Ρ‹Ρ… элСмСнтов Π² соотвСтствии с Ρ‚Π΅ΠΌ, ΠΊΠ°ΠΊ ΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚Π΅Π»ΡŒ просматриваСт Π²Π΅Π±-страницу. Π’Ρ‹ ΠΌΠΎΠΆΠ΅Ρ‚Π΅ Π²Ρ‹Π±ΠΈΡ€Π°Ρ‚ΡŒ ΠΌΠ΅ΠΆΠ΄Ρƒ Z-шаблоном , F-шаблоном ΠΈ структурой Π΄ΠΈΠ°Π³Ρ€Π°ΠΌΠΌΡ‹ Π“ΡƒΡ‚Π΅Π½Π±Π΅Ρ€Π³Π°. Π’Π°Ρˆ Π²Ρ‹Π±ΠΎΡ€ Π΄ΠΎΠ»ΠΆΠ΅Π½ ΠΎΡΠ½ΠΎΠ²Ρ‹Π²Π°Ρ‚ΡŒΡΡ Π½Π° Ρ‚ΠΈΠΏΠ΅ сайта, ΠΊΠΎΡ‚ΠΎΡ€Ρ‹ΠΉ Π²Ρ‹ создаСтС, Π° Ρ‚Π°ΠΊΠΆΠ΅ вашСм ΠΊΠΎΠ½Ρ‚Π΅Π½Ρ‚Π΅.

Π’ΠΈΠΏΠΈΡ‡Π½Ρ‹Π΅ ошибки ΠΏΡ€ΠΈ создании ΠΌΠ°ΠΊΠ΅Ρ‚Π° Π²Π΅Π±-страницы

Как ΠΈ Π² случаС с Π±Π°Π·ΠΎΠ²Ρ‹ΠΌΠΈ ΠΊΠ»ΡŽΡ‡Π΅Π²Ρ‹ΠΌΠΈ элСмСнтами, Π΅ΡΡ‚ΡŒ ΠΈ Ρ‚ΠΈΠΏΠΈΡ‡Π½Ρ‹Π΅ ΠΏΠΎΠ΄Π²ΠΎΠ΄Π½Ρ‹Π΅ ΠΊΠ°ΠΌΠ½ΠΈ, ΠΊΠΎΡ‚ΠΎΡ€Ρ‹Π΅ Π½ΡƒΠΆΠ½ΠΎ ΡƒΡ‡ΠΈΡ‚Ρ‹Π²Π°Ρ‚ΡŒ ΠΏΡ€ΠΈ Ρ€Π°Π·Ρ€Π°Π±ΠΎΡ‚ΠΊΠ΅ ΠΌΠ°ΠΊΠ΅Ρ‚Π° Π΄ΠΈΠ·Π°ΠΉΠ½Π° вашСго сайта:

Блишком ΠΌΠ½ΠΎΠ³ΠΎ Π΄Π΅Ρ‚Π°Π»Π΅ΠΉ. ΠŸΠΎΠΌΠ½ΠΈΡ‚Π΅ ΠΏΡ€Π°Π²ΠΈΠ»ΠΎ β€” Ρ‡Π΅ΠΌ мСньшС, Ρ‚Π΅ΠΌ Π»ΡƒΡ‡ΡˆΠ΅. Если Π²Ρ‹ ΡΠΎΠΌΠ½Π΅Π²Π°Π΅Ρ‚Π΅ΡΡŒ Π² Ρ‚ΠΎΠΌ ΠΈΠ»ΠΈ ΠΈΠ½ΠΎΠΌ элСмСнтС β€” ΠΈΠ·Π±Π°Π²ΠΈΡ‚Π΅ΡΡŒ ΠΎΡ‚ Π½Π΅Π³ΠΎ, ΠΎΠ½ Π²Π°ΠΌ Π½Π΅ Π½ΡƒΠΆΠ΅Π½. Π’Π΅Π±-страница Π΄ΠΎΠ»ΠΆΠ½Π° Π²ΠΊΠ»ΡŽΡ‡Π°Ρ‚ΡŒ Π² сСбя Ρ‚ΠΎΠ»ΡŒΠΊΠΎ Π½Π΅ΠΎΠ±Ρ…ΠΎΠ΄ΠΈΠΌΡ‹Π΅ элСмСнты, Π±Π΅Π· ΠΊΠΎΡ‚ΠΎΡ€Ρ‹Ρ… Π²Ρ‹ Π½Π΅ смоТСтС Ρ€Π°Π±ΠΎΡ‚Π°Ρ‚ΡŒ. НС Π΄Π΅Π»Π°ΠΉΡ‚Π΅ Ρ‚Ρƒ ΠΆΠ΅ ΠΎΡˆΠΈΠ±ΠΊΡƒ, Ρ‡Ρ‚ΠΎ ΠΈ создатСли страницы, ΡΠΊΡ€ΠΈΠ½ΡˆΠΎΡ‚ ΠΊΠΎΡ‚ΠΎΡ€ΠΎΠΉ ΠΏΡ€ΠΈΠ²Π΅Π΄Π΅Π½ Π½ΠΈΠΆΠ΅.


Ошибка ΠΌΠ°ΠΊΠ΅Ρ‚Π° β€” слишком ΠΌΠ½ΠΎΠ³ΠΎ элСмСнтов

ΠΠ΅ΠΏΡ€Π°Π²ΠΈΠ»ΡŒΠ½Ρ‹Π΅ Ρ†Π²Π΅Ρ‚Π°. ВсСгда ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠΉΡ‚Π΅ Ρ†Π²Π΅Ρ‚ΠΎΠ²ΡƒΡŽ схСму, Ρ‡Ρ‚ΠΎΠ±Ρ‹ Π²Ρ‹Π±Ρ€Π°Ρ‚ΡŒ Ρ‚ΠΎΠ»ΡŒΠΊΠΎ ΡΠΎΠΎΡ‚Π²Π΅Ρ‚ΡΡ‚Π²ΡƒΡŽΡ‰ΠΈΠ΅ ΠΎΡ‚Ρ‚Π΅Π½ΠΊΠΈ. Π‘ΠΎΠ»ΡŒΡˆΠΈΠ½ΡΡ‚Π²ΠΎ соврСмСнных инструмСнтов для создания ΠΌΠ°ΠΊΠ΅Ρ‚ΠΎΠ² Π²ΠΊΠ»ΡŽΡ‡Π°ΡŽΡ‚ Π² сСбя Ρ„ΡƒΠ½ΠΊΡ†ΠΈΡŽ ΠΏΠΎΠ΄Π±ΠΎΡ€Π° ΠΏΡ€Π°Π²ΠΈΠ»ΡŒΠ½Ρ‹Ρ… Ρ†Π²Π΅Ρ‚ΠΎΠ².

Однако Ссли Π²Ρ‹ ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠ΅Ρ‚Π΅ ΠΏΡ€ΠΎΠ³Ρ€Π°ΠΌΠΌΠ½ΠΎΠ΅ обСспСчСниС для создания ΠΌΠ°ΠΊΠ΅Ρ‚Π°, ΠΊΠΎΡ‚ΠΎΡ€ΠΎΠ΅ Π½Π΅ прСдусматриваСт возмоТности Π²Ρ‹Π±ΠΎΡ€Π° Ρ†Π²Π΅Ρ‚ΠΎΠ²ΠΎΠΉ ΠΏΠ°Π»ΠΈΡ‚Ρ€Ρ‹, Π²Ρ‹ рискуСтС ΡΠΎΠ·Π΄Π°Ρ‚ΡŒ Ρ‡Ρ‚ΠΎ-Ρ‚ΠΎ ΠΏΠΎΡ…ΠΎΠΆΠ΅Π΅ Π½Π° это:


Ошибка ΠΌΠ°ΠΊΠ΅Ρ‚Π° β€” Π½Π΅ΠΏΡ€Π°Π²ΠΈΠ»ΡŒΠ½Ρ‹Π΅ Ρ†Π²Π΅Ρ‚Π°

И это относится Π½Π΅ Ρ‚ΠΎΠ»ΡŒΠΊΠΎ ΠΊ Ρ†Π²Π΅Ρ‚Π°ΠΌ. Π― знаю, Ρ‡Ρ‚ΠΎ ΠΌΠ½ΠΎΠ³ΠΈΠ΅ Π½Π°Ρ‡ΠΈΠ½Π°ΡŽΡ‰ΠΈΠ΅ Π΄ΠΈΠ·Π°ΠΉΠ½Π΅Ρ€Ρ‹ ΡΡ‡ΠΈΡ‚Π°ΡŽΡ‚, Ρ‡Ρ‚ΠΎ Photoshop β€” ΠΎΡ‚Π»ΠΈΡ‡Π½Ρ‹ΠΉ инструмСнт для создания ΠΌΠ°ΠΊΠ΅Ρ‚Π° сайта. Однако, это Π½Π΅ совсСм Π²Π΅Ρ€Π½ΠΎ, ΠΏΠΎΡ‚ΠΎΠΌΡƒ Ρ‡Ρ‚ΠΎ Photoshop Π½Π΅ ΠΌΠΎΠΆΠ΅Ρ‚ ΠΏΠΎΠΊΠ°Π·Π°Ρ‚ΡŒ Ρ‚Π°ΠΊΠΈΠ΅ эффСкты, ΠΊΠ°ΠΊ анимация ΠΈΠ»ΠΈ Π΄Ρ€ΡƒΠ³ΠΈΠ΅. ΠŸΠΎΡΡ‚ΠΎΠΌΡƒ ΠΊ вопросу ΠΎ Ρ‚ΠΎΠΌ, ΠΊΠ°ΠΊΠΎΠΉ инструмСнт Π²Ρ‹Π±Ρ€Π°Ρ‚ΡŒ для Ρ€Π΅ΡˆΠ΅Π½ΠΈΡ этой Π·Π°Π΄Π°Ρ‡ΠΈ Π½ΡƒΠΆΠ½ΠΎ ΠΏΠΎΠ΄Ρ…ΠΎΠ΄ΠΈΡ‚ΡŒ ΠΎΡ‡Π΅Π½ΡŒ взвСшСнно.

НСчитаСмый тСкст. Π¦Π²Π΅Ρ‚Π°, ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠ΅ΠΌΡ‹Π΅ для тСкста ΠΈ Ρ„ΠΎΠ½Π°, ΠΎΠΏΡ€Π΅Π΄Π΅Π»ΡΡŽΡ‚ насколько Π»Π΅Π³ΠΊΠΎ Π±ΡƒΠ΄Π΅Ρ‚ Ρ‡ΠΈΡ‚Π°Ρ‚ΡŒΡΡ тСкст. Π›ΡƒΡ‡ΡˆΠΈΠΉ Π²Π°Ρ€ΠΈΠ°Π½Ρ‚ β€” Ρ‚Π΅ΠΌΠ½Ρ‹ΠΉ тСкст Π½Π° свСтлом, ΠΎΠ΄Π½ΠΎΡ‚ΠΎΠ½Π½ΠΎΠΌ Ρ„ΠΎΠ½Π΅. Если ΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚Π΅Π»ΡŽ Ρ‚Ρ€ΡƒΠ΄Π½ΠΎ ΠΏΡ€ΠΎΡ‡ΠΈΡ‚Π°Ρ‚ΡŒ тСкст, ΠΎΠ½ Π½Π΅ΠΌΠ΅Π΄Π»Π΅Π½Π½ΠΎ Π·Π°ΠΊΡ€ΠΎΠ΅Ρ‚ Π²Π΅Π±-страницу. Π―Ρ€ΠΊΠΈΠΉ Ρ†Π²Π΅Ρ‚ тСкстов ΠΈΠ»ΠΈ экстравагантныС ΡˆΡ€ΠΈΡ„Ρ‚Ρ‹ ΠΌΠΎΠ³ΡƒΡ‚ ΠΏΡ€Π΅Π²Ρ€Π°Ρ‚ΠΈΡ‚ΡŒ ваш Π΄ΠΈΠ·Π°ΠΉΠ½ Π² Π½Π΅Ρ‡Ρ‚ΠΎ ΠΏΠΎΠ΄ΠΎΠ±Π½ΠΎΠ΅:


Ошибка ΠΌΠ°ΠΊΠ΅Ρ‚Π° β€” Π½Π΅Ρ‡ΠΈΡ‚Π°Π΅ΠΌΡ‹ΠΉ тСкст

Π§Ρ‚ΠΎ Π΅Ρ‰Π΅ Π½ΡƒΠΆΠ½ΠΎ ΡƒΡ‡Π΅ΡΡ‚ΡŒ ΠΏΡ€ΠΈ создании ΠΌΠ°ΠΊΠ΅Ρ‚Π° сайта, Ρ‚Π°ΠΊ это Ρ‚ΠΎ, ΠΊΠ°ΠΊ сайт Π΄ΠΎΠ»ΠΆΠ΅Π½ Π²Ρ‹Π³Π»ΡΠ΄Π΅Ρ‚ΡŒ Π½Π° Ρ€Π°Π·Π½Ρ‹Ρ… экранах. ΠŸΡ€Π΅Π΄ΡΡ‚Π°Π²ΡŒΡ‚Π΅, Ρ‡Ρ‚ΠΎ ваш сайт Π±ΡƒΠ΄ΡƒΡ‚ ΠΏΡ€ΠΎΡΠΌΠ°Ρ‚Ρ€ΠΈΠ²Π°Ρ‚ΡŒ Π½Π° смартфонС, ΠΏΠ»Π°Π½ΡˆΠ΅Ρ‚Π΅, ΠΊΠΎΠΌΠΏΡŒΡŽΡ‚Π΅Ρ€Π΅ ΠΈ Π΄Π°ΠΆΠ΅ Π½Π° Ρ‚Π΅Π»Π΅Π²ΠΈΠ·ΠΎΡ€Π΅. И Π²Π°ΠΌ Π½ΡƒΠΆΠ½ΠΎ ΠΏΠΎΠ΄ΡƒΠΌΠ°Ρ‚ΡŒ ΠΎ Ρ‚ΠΎΠΌ, ΠΊΠ°ΠΊ ΠΎΠ½ Π±ΡƒΠ΄Π΅Ρ‚ Π²Ρ‹Π³Π»ΡΠ΄Π΅Ρ‚ΡŒ Π²ΠΎ всСх случаях, ΠΊΠ°ΠΊ ΠΎΡ€Π³Π°Π½ΠΈΠ·ΠΎΠ²Π°Ρ‚ΡŒ тСкст ΠΈ Ρ‡Ρ‚ΠΎ ΠΏΡ€ΠΎΠΈΠ·ΠΎΠΉΠ΄Π΅Ρ‚ с Ρ„ΠΎΠ½ΠΎΠΌ.

Π˜ΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠΉΡ‚Π΅ сСнсорныС Ρ„ΡƒΠ½ΠΊΡ†ΠΈΠΈ. Π‘ΠΏΠΎΡΠΎΠ±Π½ΠΎΡΡ‚ΡŒ соврСмСнных устройств Ρ€Π΅Π°Π³ΠΈΡ€ΠΎΠ²Π°Ρ‚ΡŒ Π½Π° прикосновСниС β€” это фантастичСский шанс ΡΠ΄Π΅Π»Π°Ρ‚ΡŒ Π΄ΠΈΠ·Π°ΠΉΠ½ сайта Π΅Ρ‰Π΅ Π±ΠΎΠ»Π΅Π΅ ΠΈΠ½Ρ‚Π΅Ρ€Π°ΠΊΡ‚ΠΈΠ²Π½Ρ‹ΠΌ. Π’ мобильном Π΄ΠΈΠ·Π°ΠΉΠ½Π΅ ΠΊΠ»ΠΈΠΊΠ°Π±Π΅Π»ΡŒΠ½Ρ‹Π΅ элСмСнты находятся Π² Π½ΠΈΠΆΠ½Π΅ΠΉ ΠΏΠΎΠ»ΠΎΠ²ΠΈΠ½Π΅ экрана. Π’ ΠΌΠ°ΠΊΠ΅Ρ‚Π΅ сайта, ΠΏΡ€Π΅Π΄Π½Π°Π·Π½Π°Ρ‡Π΅Π½Π½ΠΎΠΌ для отобраТСния Π½Π° ΠΏΠ»Π°Π½ΡˆΠ΅Ρ‚Π°Ρ…, эти элСмСнты Π΄ΠΎΠ»ΠΆΠ½Ρ‹ Π±Ρ‹Ρ‚ΡŒ упорядочСны ΠΏΠΎ-Π΄Ρ€ΡƒΠ³ΠΎΠΌΡƒ, ΠΈ Ρ€Π°ΡΠΏΠΎΠ»Π°Π³Π°Ρ‚ΡŒΡΡ Π² Ρ‚ΠΎΠΌ мСстС, Π³Π΄Π΅ ΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚Π΅Π»ΡŒ ΠΌΠΎΠΆΠ΅Ρ‚ Π»Π΅Π³ΠΊΠΎ Π΄ΠΎΡ‚ΡΠ½ΡƒΡ‚ΡŒΡΡ Π΄ΠΎ Π½ΠΈΡ… большими ΠΏΠ°Π»ΡŒΡ†Π°ΠΌΠΈ.

Π’ этом ΡƒΡ€ΠΎΠΊΠ΅ ΠΌΡ‹ научимся ΡΠΎΠ·Π΄Π°Π²Π°Ρ‚ΡŒ ΠΌΠ°ΠΊΠ΅Ρ‚ Π±Π»ΠΎΠ³Π° Π² минималистичном стилС, ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΡ Π½ΠΎΠ²Ρ‹Π΅ Ρ‚Π΅Ρ…Π½ΠΎΠ»ΠΎΠ³ΠΈΠΈ Photoshop. Π’ этом Π½Π°ΠΌ ΠΏΠΎΠΌΠΎΠ³ΡƒΡ‚ Π½ΠΎΠ²Ρ‹Π΅ возмоТности создания ΠΈ сохранСния стилСй Character Styles ΠΈ Paragraph Styles.

Π”Π°Π²Π°ΠΉΡ‚Π΅ посмотрим, Ρ‡Ρ‚ΠΎ ΠΌΡ‹ Π±ΡƒΠ΄Π΅ΠΌ ΡΠΎΠ·Π΄Π°Π²Π°Ρ‚ΡŒ Π² этом ΡƒΡ€ΠΎΠΊΠ΅.

Для выполнСния ΡƒΡ€ΠΎΠΊΠ°, Π²Π°ΠΌ понадобится ΡΠ»Π΅Π΄ΡƒΡŽΡ‰ΠΈΠ΅ рСсурсы:

  • БСсплатный ΡˆΡ€ΠΈΡ„Ρ‚ Free Font Sansation .
  • ВСкстура 26 Repeatable Pixel Pattern
  • Набор ΡΠΎΡ†ΠΈΠ°Π»ΡŒΠ½Ρ‹Ρ… ΠΈΠΊΠΎΠ½ΠΎΠΊ Free Social Media Icons
  • Иконка Ρ€ΡƒΠΊΠΈ Hand Cursor Icon
  • Π‘Ρ‚ΠΎΠΊΠΎΠ²ΠΎΠ΅ ΠΈΠ·ΠΎΠ±Ρ€Π°ΠΆΠ΅Π½ΠΈΠ΅ Stock photo: Harvest 1
  • Π‘Ρ‚ΠΎΠΊΠΎΠ²ΠΎΠ΅ ΠΈΠ·ΠΎΠ±Ρ€Π°ΠΆΠ΅Π½ΠΈΠ΅ Stock photo: New York Streets 3
  • Π‘Ρ‚ΠΎΠΊΠΎΠ²ΠΎΠ΅ ΠΈΠ·ΠΎΠ±Ρ€Π°ΠΆΠ΅Π½ΠΈΠ΅ Stock photo: Daisy Age
  • Π‘Ρ‚ΠΎΠΊΠΎΠ²ΠΎΠ΅ ΠΈΠ·ΠΎΠ±Ρ€Π°ΠΆΠ΅Π½ΠΈΠ΅ Stock photo: A tree on the horizon
  • Π‘Ρ‚ΠΎΠΊΠΎΠ²ΠΎΠ΅ ΠΈΠ·ΠΎΠ±Ρ€Π°ΠΆΠ΅Π½ΠΈΠ΅ Stock photo: Sales figures
  • Π‘Ρ‚ΠΎΠΊΠΎΠ²ΠΎΠ΅ ΠΈΠ·ΠΎΠ±Ρ€Π°ΠΆΠ΅Π½ΠΈΠ΅ Stock photo: Time is Money!

ΠŸΠΎΠ΄Π³ΠΎΡ‚ΠΎΠ²ΠΊΠ° холста

Π¨Π°Π³ 1

Π’ этом ΡƒΡ€ΠΎΠΊΠ΅ ΠΌΡ‹ Π±ΡƒΠ΄Π΅ΠΌ ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚ΡŒ Ρ„Ρ€Π΅ΠΉΠΌΠ²ΠΎΡ€ΠΊ 960 GS . НуТно с ΠΊΠ°Ρ‡Π°Ρ‚ΡŒ шаблон с Π΅Π³ΠΎ Π³Π»Π°Π²Π½ΠΎΠΉ страницы ΠΈ Π½Π°ΠΉΡ‚ΠΈ Π²Π½ΡƒΡ‚Ρ€ΠΈ Π°Ρ€Ρ…ΠΈΠ²Π° Ρ„Π°ΠΉΠ» «12 Column Grid».

НаТмитС Π½Π° ΠΈΠΊΠΎΠ½ΠΊΡƒ Π³Π»Π°Π·Π° Π²ΠΎΠ·Π»Π΅ слоя 12 Col Grid, Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΡΠΊΡ€Ρ‹Ρ‚ΡŒ Π΅Π³ΠΎ Π²ΠΈΠ΄ΠΈΠΌΠΎΡΡ‚ΡŒ β€” ΠΏΠΎΠΊΠ° ΠΎΠ½ Π½Π°ΠΌ Π½Π΅ понадобится.

Π¨Π°Π³ 2

Пока Ρ€Π°Π·ΠΌΠ΅Ρ€ нашСго холста достаточно ΠΌΠ°Π». НаТимаСм Image> Canvas Size (ΠΈΠ»ΠΈ Ctrl +Alt + C), Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΡΠ΄Π΅Π»Π°Ρ‚ΡŒ Ρ€Π°Π·ΠΌΠ΅Ρ€ Π½Π΅ΠΌΠ½ΠΎΠ³ΠΎ большС ΠΈ устанавливаСм ΠΎΠΏΠΎΡ€Π½ΡƒΡŽ Ρ‚ΠΎΡ‡ΠΊΡƒ Π² Ρ†Π΅Π½Ρ‚Ρ€Π΅.

Π¨Π°Π³ 3

НаТмитС Ctrl + R , Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΠΏΠΎΠΊΠ°Π·Π°Ρ‚ΡŒ Π»ΠΈΠ½Π΅ΠΉΠΊΡƒ. НаТмитС View> New Guide (ΠŸΡ€ΠΎΡΠΌΠΎΡ‚Ρ€ β€” Новая Π½Π°ΠΏΡ€Π°Π²Π»ΡΡŽΡ‰Π°Ρ), Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΡΠΎΠ·Π΄Π°Ρ‚ΡŒ Π½ΠΎΠ²ΡƒΡŽ Π½Π°ΠΏΡ€Π°Π²Π»ΡΡŽΡ‰ΡƒΡŽ. Π’Ρ‹Π±Π΅Ρ€ΠΈΡ‚Π΅ Vertical ΠΈ Position (ПолоТСниС): 185 px , Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΡΠΎΠ·Π΄Π°Ρ‚ΡŒ Π²Π΅Ρ€Ρ‚ΠΈΠΊΠ°Π»ΡŒΠ½ΡƒΡŽ Π½Π°ΠΏΡ€Π°Π²Π»ΡΡŽΡ‰ΡƒΡŽ, которая Π±ΡƒΠ΄Π΅Ρ‚ сдвинута Π½Π° 185 px ΠΎΡ‚ Π»Π΅Π²ΠΎΠ³ΠΎ края.

Π¨Π°Π³ 4

Π‘ΠΎΠ·Π΄Π°ΠΉΡ‚Π΅ Π΅Ρ‰Π΅ β€‹β€‹Π²Π΅Ρ€Ρ‚ΠΈΠΊΠ°Π»ΡŒΠ½Ρ‹Π΅ Π½Π°ΠΏΡ€Π°Π²Π»ΡΡŽΡ‰ΠΈΠ΅ Π½Π° расстоянии Π² 150 , 1095 ΠΈ 1130 пиксСлСй .

ΠŸΠΎΠ΄Π³ΠΎΡ‚ΠΎΠ²ΠΊΠ° Color Theme

Π¨Π°Π³ 5

Π’ нашСм Π΄ΠΈΠ·Π°ΠΉΠ½Π΅ ΠΌΡ‹ собираСмся ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚ΡŒ ΡΠ»Π΅Π΄ΡƒΡŽΡ‰ΡƒΡŽ Ρ†Π²Π΅Ρ‚ΠΎΠ²ΡƒΡŽ ΠΊΠΎΠΌΠ±ΠΈΠ½Π°Ρ†ΠΈΡŽ — Colorlouver . НаТмитС Π½Π° ΠΈΠ·ΠΎΠ±Ρ€Π°ΠΆΠ΅Π½ΠΈΠ΅, Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΠΎΡ‚ΠΊΡ€Ρ‹Ρ‚ΡŒ Ρ†Π²Π΅Ρ‚ΠΎΠ²ΡƒΡŽ ΠΊΠΎΠΌΠ±ΠΈΠ½Π°Ρ†ΠΈΡŽ ΠΈ ΡΠΎΡ…Ρ€Π°Π½ΠΈΡ‚ΡŒ Π² Ρ„ΠΎΡ€ΠΌΠ°Ρ‚Π΅ JPEG.

РазмСститС Ρ†Π²Π΅Ρ‚ΠΎΠ²ΡƒΡŽ схСму Π²Π½ΡƒΡ‚Ρ€ΠΈ Ρ„Π°ΠΉΠ»Π° Photoshop. РазмСщая изобраТСния нСпосрСдствСнно Π²Π½ΡƒΡ‚Ρ€ΠΈ нашСго шаблона, ΠΏΠΎΠ»ΡƒΡ‡ΠΈΡ‚ΡŒ доступ ΠΊ Π½Π΅ΠΌΡƒ Π±ΡƒΠ΄Π΅Ρ‚ Π½Π°ΠΌΠ½ΠΎΠ³ΠΎ быстрСС ΠΈ Π»Π΅Π³Ρ‡Π΅.

ΠŸΠΎΠ΄Π³ΠΎΡ‚ΠΎΠ²ΠΊΠ° Ρ„ΠΎΠ½Π°

Π¨Π°Π³ 6

Π’Ρ‹Π±Π΅Ρ€ΠΈΡ‚Π΅ слой Background ΠΈ Π½Π°ΠΆΠΌΠΈΡ‚Π΅ Π½Π° Π·Π½Π°Ρ‡ΠΎΠΊ Π·Π°ΠΌΠΊΠ°, Ρ‡Ρ‚ΠΎΠ±Ρ‹ Ρ€Π°Π·Π±Π»ΠΎΠΊΠΈΡ€ΠΎΠ²Π°Ρ‚ΡŒ этот слой. Π”Π²Π°ΠΆΠ΄Ρ‹ Ρ‰Π΅Π»ΠΊΠ°Π΅ΠΌ ΠΏΠΎ ΠΈΠ·ΠΎΠ±Ρ€Π°ΠΆΠ΅Π½ΠΈΡŽ, Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΠΈΠ·ΠΌΠ΅Π½ΠΈΡ‚ΡŒ Ρ†Π²Π΅Ρ‚ Ρ„ΠΎΠ½Π°.

Π‘ ΠΏΠΎΠΌΠΎΡ‰ΡŒΡŽ ΠΏΠΈΠΏΠ΅Ρ‚ΠΊΠΈ Π²Ρ‹Π±Π΅Ρ€ΠΈΡ‚Π΅ Π²Ρ‚ΠΎΡ€ΠΎΠΉ Ρ†Π²Π΅Ρ‚ нашСй Ρ†Π²Π΅Ρ‚ΠΎΠ²ΠΎΠΉ схСмы (# 948371) .

Π¨Π°Π³ 7

НарисуйтС ΠΏΡ€ΡΠΌΠΎΡƒΠ³ΠΎΠ»ΡŒΠ½ΡƒΡŽ Ρ„ΠΎΡ€ΠΌΡƒ Π² Π²Π΅Ρ€Ρ…Π½Π΅ΠΉ части холста. Π­Ρ‚ΠΎ Π±ΡƒΠ΄Π΅Ρ‚ Π²Ρ‚ΠΎΡ€ΠΎΠΉ Ρ„ΠΎΠ½.

Π¨Π°Π³ 8

Π’Ρ‹Π±Π΅Ρ€ΠΈΡ‚Π΅ ΡΠΎΠ·Π΄Π°Π½Π½ΡƒΡŽ Ρ„ΠΎΡ€ΠΌΡƒ ΠΈ ΠΏΠ΅Ρ€Π΅ΠΉΠ΄ΠΈΡ‚Π΅ Π² панСль Option Bar. ΠΎΡ‚ΠΊΡ€ΠΎΠΉΡ‚Π΅ Fill Color ΠΈ Π½Π°ΠΆΠΌΠΈΡ‚Π΅ ΠΈΠΊΠΎΠ½ΠΊΡƒ Π²Ρ‹Π±ΠΎΡ€Π° Ρ†Π²Π΅Ρ‚Π°. Когда появится Π΄ΠΈΠ°Π»ΠΎΠ³ΠΎΠ²ΠΎΠ΅ ΠΎΠΊΠ½ΠΎ Color Picker, Π²Ρ‹Π±Π΅Ρ€ΠΈΡ‚Π΅ ΠΏΠ΅Ρ€Π²Ρ‹ΠΉ Ρ†Π²Π΅Ρ‚. Π’ ΠΏΠΎΠ»Π΅ Stroke Π²Ρ‹Π±Π΅Ρ€ΠΈΡ‚Π΅ None

Π¨Π°Π³ 9

Π‘ΠΎΠ·Π΄Π°ΠΉΡ‚Π΅ Π½ΠΎΠ²Ρ‹ΠΉ слой ΠΈ с ΠΏΠΎΠΌΠΎΡ‰ΡŒΡŽ Rectangular Marquee Tool Π²Ρ‹Π΄Π΅Π»ΠΈΡ‚Π΅ Π²Π΅Ρ€Ρ…Π½ΠΈΠΉ ΠΏΡ€ΡΠΌΠΎΡƒΠ³ΠΎΠ»ΡŒΠ½ΠΈΠΊ. АктивируйтС инструмСнт Π³Ρ€Π°Π΄ΠΈΠ΅Π½Ρ‚Π½ΠΎΠΉ Π·Π°Π»ΠΈΠ²ΠΊΠΈ ΠΈ Π·Π°Π»Π΅ΠΉΡ‚Π΅ Π²Ρ‹Π΄Π΅Π»Π΅Π½Π½ΡƒΡŽ ΠΎΠ±Π»Π°ΡΡ‚ΡŒ Ρ€Π°Π΄ΠΈΠ°Π»ΡŒΠ½Ρ‹ΠΌ Π³Ρ€Π°Π΄ΠΈΠ΅Π½Ρ‚ΠΎΠΌ ΠΎΡ‚ Π±Π΅Π»ΠΎΠ³ΠΎ ΠΊ Ρ‡Π΅Ρ€Π½ΠΎΠΌΡƒ.

Π˜Π·ΠΌΠ΅Π½ΠΈΡ‚Π΅ Π΅Π³ΠΎ Ρ€Π΅ΠΆΠΈΠΌ Blend mode Π½Π° Screen ΠΈ ΡƒΠΌΠ΅Π½ΡŒΡˆΠΈΡ‚Π΅ Π½Π΅ΠΏΡ€ΠΎΠ·Ρ€Π°Ρ‡Π½ΠΎΡΡ‚ΡŒ Opacity Π΄ΠΎ 37% .

Π¨Π°Π³ 10

Π‘ΠΎΠ·Π΄Π°ΠΉΡ‚Π΅ Π½ΠΎΠ²Ρ‹ΠΉ слой ΠΈ Π½Π°Π·ΠΎΠ²ΠΈΡ‚Π΅ Π΅Π³ΠΎ Β«Ρ‚Π΅Π½ΡŒΒ».

НарисуйтС ΠΏΡ€ΡΠΌΠΎΡƒΠ³ΠΎΠ»ΡŒΠ½ΠΎΠ΅ Π²Ρ‹Π΄Π΅Π»Π΅Π½ΠΈΠ΅ Π² Π½ΠΈΠΆΠ½Π΅ΠΉ части Π²Ρ‚ΠΎΡ€ΠΎΠ³ΠΎ Ρ„ΠΎΠ½Π°, ΠΊΠ°ΠΊ ΠΏΠΎΠΊΠ°Π·Π°Π½ΠΎ Π½Π° рисункС Π½ΠΈΠΆΠ΅. НаТмитС Edit: Fill . Π£ΡΡ‚Π°Π½ΠΎΠ²ΠΈΡ‚ΡŒ Use Black . НаТмитС OK , Ρ‡Ρ‚ΠΎΠ±Ρ‹ Π·Π°ΠΏΠΎΠ»Π½ΠΈΡ‚ΡŒ Π²Ρ‹Π΄Π΅Π»Π΅Π½ΠΈΠ΅ Ρ‡Π΅Ρ€Π½Ρ‹ΠΌ.

Π¨Π°Π³ 11

Π Π°Π·ΠΌΠΎΠΉΡ‚Π΅ Π΅Π³ΠΎ с ΠΏΠΎΠΌΠΎΡ‰ΡŒΡŽ Gaussian Blur. НаТмитС Filter> Blur> Gaussian Blur .

Π¨Π°Π³ 12

УдСрТивая Π½Π°ΠΆΠ°Ρ‚ΠΎΠΉ Alt , помСститС курсор ΠΌΠ΅ΠΆΠ΄Ρƒ Ρ‚Π΅Π½ΡŒΡŽ ΠΈ слоСм со Π²Ρ‚ΠΎΡ€Ρ‹ΠΌ Ρ„ΠΎΠ½ΠΎΠΌ. НС отпуская Al , Π½Π°ΠΆΠΌΠΈΡ‚Π΅, Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΠΏΡ€Π΅ΠΎΠ±Ρ€Π°Π·ΠΎΠ²Π°Ρ‚ΡŒ слой Π² ΠΎΠ±Ρ‚Ρ€Π°Π²ΠΎΡ‡Π½ΡƒΡŽ маску . ΠŸΡ€Π΅ΠΎΠ±Ρ€Π°Π·ΠΎΠ²Π°Π² Π΅Π³ΠΎ Π² Clipping Mask, Ρ‚Π΅Π½ΠΈ сСйчас Ρ€Π°Π·ΠΌΠ΅Ρ‰Π΅Π½Ρ‹ Π²Π½ΡƒΡ‚Ρ€ΠΈ Π²Π΅Ρ€Ρ…Π½Π΅Π³ΠΎ Ρ„ΠΎΠ½Π°.

Π¨Π°Π³ 13

Π˜Π·ΠΌΠ΅Π½ΠΈΡ‚Π΅ ΠΏΡ€ΠΎΠ·Ρ€Π°Ρ‡Π½ΠΎΡΡ‚ΡŒ Ρ‚Π΅Π½ΠΈ Opacity Π΄ΠΎ 50% . НиТС Π²Ρ‹ ΠΌΠΎΠΆΠ΅Ρ‚Π΅ ΡƒΠ²ΠΈΠ΄Π΅Ρ‚ΡŒ Ρ€Π΅Π·ΡƒΠ»ΡŒΡ‚Π°Ρ‚ ΠΏΡ€ΠΈ 100% ΡƒΠ²Π΅Π»ΠΈΡ‡Π΅Π½ΠΈΠΈ.

Π¨Π°Π³ 14

ΠŸΡ€ΠΈΡˆΠ»ΠΎ врСмя, Ρ‡Ρ‚ΠΎΠ±Ρ‹ Ρ€Π°Π·ΠΌΠ΅ΡΡ‚ΠΈΡ‚ΡŒ всС слои Π² ΠΎΠ΄Π½Ρƒ Π³Ρ€ΡƒΠΏΠΏΡƒ. Π§Ρ‚ΠΎΠ±Ρ‹ ΡΠ΄Π΅Π»Π°Ρ‚ΡŒ это, Π²Ρ‹Π±Π΅Ρ€ΠΈΡ‚Π΅ всС слои ΠΈ Π½Π°ΠΆΠΌΠΈΡ‚Π΅ Ctrl + G .

Header

Π¨Π°Π³ 15

НарисуйтС ΠΏΡ€ΡΠΌΠΎΡƒΠ³ΠΎΠ»ΡŒΠ½ΠΈΠΊ Π² Π²Π΅Ρ€Ρ…Π½Π΅ΠΉ части холста, ΠΊΠ°ΠΊ ΠΏΠΎΠΊΠ°Π·Π°Π½ΠΎ Π½Π° рисункС.

Π¨Π°Π³ 16

Π’ ΠΏΠ°Π½Π΅Π»ΠΈ Option Bar , установитС Ρ†Π²Π΅Ρ‚ Stroke — # af9f8e .

Π¨Π°Π³ 17

Для Π·Π°Π»ΠΈΠ²ΠΊΠΈ Π²Ρ‹Π±Π΅Ρ€ΠΈΡ‚Π΅ ΡΠ»Π΅Π΄ΡƒΡŽΡ‰ΠΈΠ΅ Ρ†Π²Π΅Ρ‚Π° Π»ΠΈΠ½Π΅ΠΉΠ½ΠΎΠ³ΠΎ Π³Ρ€Π°Π΄ΠΈΠ΅Π½Ρ‚Π° β€” ΠΎΡ‚ # d0c4b9 ΠΊ #a89c91 .

НазваниС сайта

Π¨Π°Π³ 18

Π’ Π»Π΅Π²ΠΎΠΉ сторонС шаблона добавляСм Π½Π°Π·Π²Π°Π½ΠΈΠ΅ нашСго сайта. ΠžΠ±Ρ€Π°Ρ‚ΠΈΡ‚Π΅ Π²Π½ΠΈΠΌΠ°Π½ΠΈΠ΅, Ρ‡Ρ‚ΠΎΠ±Ρ‹ Ρ€Π°Π·ΠΌΠ΅Ρ‰Π΅Π½ΠΈΠ΅ соотвСтствовало рисунку Π½ΠΈΠΆΠ΅. Π”Π²Π°ΠΆΠ΄Ρ‹ Ρ‰Π΅Π»ΠΊΠ½ΠΈΡ‚Π΅ тСкст ΠΈ Π΄ΠΎΠ±Π°Π²ΡŒΡ‚Π΅ Drop Shadow . Π’ ΡƒΡ€ΠΎΠΊΠ΅ Π±Ρ‹Π» использован ΡˆΡ€ΠΈΡ„Ρ‚ Sansation .

МСню

Π¨Π°Π³ 19

Π˜ΡΠΏΠΎΠ»ΡŒΠ·ΡƒΡ ΡˆΡ€ΠΈΡ„Ρ‚ Sansation 14 ΠΏΡ‚, создаСм мСню. ΠžΠΏΡΡ‚ΡŒ ΠΎΠ±Ρ€Π°Ρ‚ΠΈΡ‚Π΅ Π²Π½ΠΈΠΌΠ°Π½ΠΈΠ΅ Π½Π° мСсто размСщСния.

Π¨Π°Π³ 20

Для Π°ΠΊΡ‚ΠΈΠ²Π½ΠΎΠ³ΠΎ ΠΊΠ½ΠΎΠΏΠΊΠΈ мСню установитС Ρ‚ΠΈΠΏ ΡˆΡ€ΠΈΡ„Ρ‚Π° β€” bold.

Π¨Π°Π³ 21

АктивируйтС инструмСнт создания ΠΌΠ½ΠΎΠ³ΠΎΡƒΠ³ΠΎΠ»ΡŒΠ½ΠΈΠΊΠ° Polygon tool ΠΈ установитС количСство сторон — 3 . НарисуйтС Ρ‚Ρ€Π΅ΡƒΠ³ΠΎΠ»ΡŒΠ½ΠΈΠΊ с Ρ†Π²Π΅Ρ‚ΠΎΠΌ Π·Π°Π»ΠΈΠ²ΠΊΠΈ Fill: # 3d3123 ΠΈ Π·Π½Π°Ρ‡Π΅Π½ΠΈΠ΅ ΠΎΠ±Π²ΠΎΠ΄ΠΊΠΈ Stroke : None . ДобавляСм ΠΊ слою Ρ‚Π΅Π½ΡŒ — Layer Style > Drop Shadow .

Π¨Π°Π³ 22

ΠŸΠΎΠ΄Ρ‡Π΅Ρ€ΠΊΠ½Π΅ΠΌ Π°ΠΊΡ‚ΠΈΠ²Π½ΡƒΡŽ ΠΊΠ½ΠΎΠΏΠΊΡƒ мСню. АктивируйтС инструмСнт Линия ΠΈ ΡƒΡΡ‚Π°Π½ΠΎΠ²ΠΈΡ‚ΡŒ Π΅Π΅ Ρ€Π°Π·ΠΌΠ΅Ρ€ weight — 5 пиксСлСй . Π’Ρ‹Π±Π΅Ρ€ΠΈΡ‚Π΅ Ρ†Π²Π΅Ρ‚ # f76b6a ΠΈ линия Π΄ΠΎΠ»ΠΆΠ½Π° Π±Ρ‹Ρ‚ΡŒ Π±Π΅Π· ΠΎΠ±Π²ΠΎΠ΄ΠΊΠΈ.

РазмСститС линию ΠΏΠΎΠ΄ Π°ΠΊΡ‚ΠΈΠ²Π½Ρ‹ΠΌ мСню ΠΈ Π΄ΠΎΠ±Π°Π²ΡŒΡ‚Π΅ расстояния ΠΌΠ΅ΠΆΠ΄Ρƒ Π»ΠΈΠ½ΠΈΠ΅ΠΉ ΠΈ ΠΏΡ€ΡΠΌΠΎΡƒΠ³ΠΎΠ»ΡŒΠ½ΠΎΠΉ Ρ„ΠΎΡ€ΠΌΠΎΠΉ Π² 1 пиксСль.

ИспользованиС стилСй символа

Π¨Π°Π³ 23

Π”Π°Π²Π°ΠΉΡ‚Π΅ сохраним настройки стилСй для тСкста. Π­Ρ‚Π° Ρ‡Ρ‚ΠΎ-Ρ‚ΠΎ ΠΏΠΎΡ…ΠΎΠΆΠ΅Π΅ Π½Π° ΡƒΠΏΡ€ΠΎΡ‰Π΅Π½Π½ΡƒΡŽ Π²Π΅Ρ€ΡΠΈΡŽ стилСй символов Π² InDesign. Π§Ρ‚ΠΎΠ±Ρ‹ сохраним ΠΈΡ…, Π½ΡƒΠΆΠ½ΠΎ Π°ΠΊΡ‚ΠΈΠ²ΠΈΡ€ΠΎΠ²Π°Ρ‚ΡŒ тСкст, Π° Π·Π°Ρ‚Π΅ΠΌ Π½Π°ΠΆΠ°Ρ‚ΡŒ Π½Π° ΠΈΠΊΠΎΠ½ΠΊΠ΅ «New Character Style».

Π”Π²Π°ΠΆΠ΄Ρ‹ Ρ‰Π΅Π»ΠΊΠ½ΠΈΡ‚Π΅ Π½Π° Π½ΠΎΠ²Ρ‹ΠΉ ΡΡ‚ΠΈΠ»ΡŒ ΠΈ Π²Ρ‹Π±Π΅Ρ€Π΅Ρ‚Π΅ ΡΠ»Π΅Π΄ΡƒΡŽΡ‰ΠΈΠ΅ настройки.

Π¨Π°Π³ 24

Π’Ρ‹Π±Π΅Ρ€ΠΈΡ‚Π΅ ΡΠ»Π΅Π΄ΡƒΡŽΡ‰ΠΈΠΉ ΠΏΡƒΠ½ΠΊΡ‚ мСню, Π° Π·Π°Ρ‚Π΅ΠΌ Π½Π°ΠΆΠΌΠΈΡ‚Π΅ ΠΊΠ½ΠΎΠΏΠΊΡƒ Character Style для примСнСния настроСк стиля. Если Π²Ρ‹ нашли Π·Π½Π°ΠΊ плюс Π²ΠΎΠ·Π»Π΅ стилСй, это ΠΎΠ·Π½Π°Ρ‡Π°Π΅Ρ‚, Ρ‡Ρ‚ΠΎ ΠΎΠ½ΠΈ ΠΈΠΌΠ΅ΡŽΡ‚ Ρ€Π°Π·Π½Ρ‹Π΅ настройки.

Π¨Π°Π³ 25

ΠŸΠΎΠ²Ρ‚ΠΎΡ€ΠΈΡ‚Π΅ ΠΏΡ€Π΅Π΄Ρ‹Π΄ΡƒΡ‰ΠΈΠΉ шаг, Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΠΏΡ€ΠΈΠΌΠ΅Π½ΠΈΡ‚ΡŒ созданный ΡΡ‚ΠΈΠ»ΡŒ для Π°ΠΊΡ‚ΠΈΠ²Π½ΠΎΠ³ΠΎ мСню.

Π¨Π°Π³ 26

Π’Π°ΠΊ Π² Ρ‡Π΅ΠΌ ΠΆΠ΅ прСимущСство использования стилСй символов? Они ΠΏΠΎΠΌΠΎΠ³ΡƒΡ‚ Π½Π°ΠΌ Ρ†Π΅Π½Ρ‚Ρ€Π°Π»ΠΈΠ·ΠΎΠ²Π°Ρ‚ΡŒ настройки тСкста. ΠœΡ‹ ΠΌΠΎΠΆΠ΅ΠΌ просто ΠΈΠ·ΠΌΠ΅Π½ΠΈΡ‚ΡŒ ΡΡ‚ΠΈΠ»ΡŒ символа, Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΠΎΡ‚Ρ€Π΅Π΄Π°ΠΊΡ‚ΠΈΡ€ΠΎΠ²Π°Ρ‚ΡŒ любой тСкст. НапримСр, Ссли ΠΈΠ·ΠΌΠ΅Π½ΠΈΡ‚ΡŒ ΡΡ‚ΠΈΠ»ΡŒ Top Menu – Normal Π½Π° Corbel, всС элСмСнты мСню автоматичСски измСнятся Π½Π° Corbel.

Π¨Π°Π³ 27

Π‘ΠΎΠ·Π΄Π°ΠΉΡ‚Π΅ Π½ΠΎΠ²Ρ‹ΠΉ слой ΠΈ помСститС Π΅Π³ΠΎ ΠΏΠΎΠ΄ элСмСнтами мСню. НаТмитС Ctrl ΠΈ ΠΊΠ»ΠΈΠΊΠ½ΠΈΡ‚Π΅ ΠΏΠΎ мСню, Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΡΠ΄Π΅Π»Π°Ρ‚ΡŒ ΡΠ»Π΅Π΄ΡƒΡŽΡ‰Π΅Π΅ Π²Ρ‹Π΄Π΅Π»Π΅Π½ΠΈΠ΅. Π—Π°Π»Π΅ΠΉΡ‚Π΅ Π΅Π³ΠΎ Ρ‡Π΅Ρ€Π½Ρ‹ΠΌ.

Π¨Π°Π³ 28

Π£Π΄Π°Π»ΠΈΡ‚Π΅ Π²Ρ‹Π΄Π΅Π»Π΅Π½ΠΈΠ΅, Π½Π°ΠΆΠ°Π² Ctrl + D. Π Π°Π·ΠΌΠΎΠΉΡ‚Π΅ Ρ‡Π΅Ρ€Π½ΡƒΡŽ ΠΎΠ±Π»Π°ΡΡ‚ΡŒ, ΠΏΡ€ΠΈΠΌΠ΅Π½ΠΈΠ² Ρ„ΠΈΠ»ΡŒΡ‚Ρ€ Filter> Blur> Gaussian Blur .

Π‘Π»Π°ΠΉΠ΄Π΅Ρ€

Π¨Π°Π³ 29

НарисуйтС ΠΏΡ€ΡΠΌΠΎΡƒΠ³ΠΎΠ»ΡŒΠ½ΡƒΡŽ Ρ„ΠΎΡ€ΠΌΡƒ ΡˆΠΈΡ€ΠΈΠ½ΠΎΠΉ Π² столбцов (см. Π½ΠΈΠΆΠ΅).

Для Ρ†Π²Π΅Ρ‚Π° Π·Π°Π»ΠΈΠ²ΠΊΠΈ Π²Ρ‹Π±Π΅Ρ€ΠΈΡ‚Π΅ # dfd1c2 . Π¦Π²Π΅Ρ‚ Stroke β€” # c8baac, Ρ€Π°Π·ΠΌΠ΅Ρ€ 10 pt . НаТмитС Π½Π° ΠΌΠ°Π»Π΅Π½ΡŒΠΊΡƒΡŽ стрСлку рядом с Π»ΠΈΠ½ΠΈΠ΅ΠΉ, Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΡƒΠ±Π΅Π΄ΠΈΡ‚ΡŒΡΡ, Ρ‡Ρ‚ΠΎ Π²Ρ‹Π±Ρ€Π°Π½Π° опция Align Insid.

Π¨Π°Π³ 30

ВставляСм ΠΈΠ·ΠΎΠ±Ρ€Π°ΠΆΠ΅Π½ΠΈΠ΅, ΠΊΠ°ΠΊ ΠΏΠΎΠΊΠ°Π·Π°Π½ΠΎ Π½Π° рисункС Π½ΠΈΠΆΠ΅. ΠšΠΎΠ½Π²Π΅Ρ€Ρ‚ΠΈΡ€ΡƒΠΉΡ‚Π΅ Π΅Π³ΠΎ Π² Clipping Mask, Π½Π°ΠΆΠ°Π² Ctrl + Alt + G . Π˜Π·ΠΎΠ±Ρ€Π°ΠΆΠ΅Π½ΠΈΠ΅ Π±ΡƒΠ΄Π΅Ρ‚ автоматичСски Ρ€Π°Π·ΠΌΠ΅Ρ‰Π΅Π½ΠΎ Π²Π½ΡƒΡ‚Ρ€ΠΈ Π±Π»ΠΎΠΊΠ° слайдСра. ΠŸΡ€ΠΈ нСобходимости, Π²Ρ‹ ΠΌΠΎΠΆΠ΅Ρ‚Π΅ ΠΈΠ·ΠΌΠ΅Π½ΡΡ‚ΡŒ Ρ€Π°Π·ΠΌΠ΅Ρ€ ΠΈ ΠΏΠ΅Ρ€Π΅ΠΌΠ΅Ρ‰Π°Ρ‚ΡŒ Π΅Π³ΠΎ, Π½ΠΈΠΊΠ°ΠΊ Π½Π΅ влияя Π½Π° Π΅Π³ΠΎ Ρ€Π°ΠΌΠΊΡƒ.

Π¨Π°Π³ 31

НарисуйтС Π΅Ρ‰Π΅ ​​одну ΠΏΡ€ΡΠΌΠΎΡƒΠ³ΠΎΠ»ΡŒΠ½ΡƒΡŽ Ρ„ΠΎΡ€ΠΌΡƒ Π²ΠΎΠ·Π»Π΅ слайдСр Ρ‚Π°ΠΊΠΈΠΌ ΠΆΠ΅ Ρ†Π²Π΅Ρ‚ΠΎΠΌ. Π£Π±Π΅Π΄ΠΈΡ‚Π΅ΡΡŒ Π² Ρ‚ΠΎΠΌ, Ρ‡Ρ‚ΠΎ Ρ„ΠΎΡ€ΠΌΠ° Π±ΡƒΠ΄Π΅Ρ‚ привязана ΠΊ ΠΊΡ€Π°ΠΉΠ½Π΅ΠΉ Π½Π°ΠΏΡ€Π°Π²Π»ΡΡŽΡ‰Π΅ΠΉ. ДобавляСм стили Layer Style> Pattern Overlay, ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΡ тСкстуру

Как Π½Π°Ρ€ΠΈΡΠΎΠ²Π°Ρ‚ΡŒ пятый Π² этом Π³ΠΎΠ΄Ρƒ сайт ΡΡ‚Ρ€ΠΎΠΈΡ‚Π΅Π»ΡŒΠ½ΠΎΠΉ ΠΊΠΎΠΌΠΏΠ°Π½ΠΈΠΈ ΠΈ ΡΠΎΡ…Ρ€Π°Π½ΠΈΡ‚ΡŒ интСрСс ΠΊ Ρ€Π°Π±ΠΎΡ‚Π΅.

Π’Π΅ΠΌ ΠΊΡ‚ΠΎ Π½Π°Π±Π»ΡŽΠ΄Π°Π΅Ρ‚ Π·Π°Β Ρ€Π°Π±ΠΎΡ‚ΠΎΠΉ Π΄ΠΈΠ·Π°ΠΉΠ½Π΅Ρ€Π° со стороны, часто каТСтся β€” уТ эта ΡΠΏΠ΅Ρ†ΠΈΠ°Π»ΡŒΠ½ΠΎΡΡ‚ΡŒ интСрСснСй самых интСрСсных. Π˜ΠΌΒ Ρ‚ΠΎ, скучно Π½Π΅Β Π±Ρ‹Π²Π°Π΅Ρ‚! В самом Π΄Π΅Π»Π΅, язык ΠΊΠ°ΠΊ-Ρ‚ΠΎ нС поворачиваСтся Π½Π°Π·Π²Π°Ρ‚ΡŒ Π΄ΠΈΠ·Π°ΠΉΠ½Π΅Ρ€Π°Β β€” Π·Π°Π½ΡƒΠ΄Π½Ρ‹ΠΌ офисным ΠΏΠ»Π°Π½ΠΊΡ‚ΠΎΠ½ΠΎΠΌ…

Но мы то с Π²Π°ΠΌΠΈ Π·Π½Π°Π΅ΠΌ, сколько Ρ€Π°Π±ΠΎΡ‡Π΅Π³ΠΎ Π²Ρ€Π΅ΠΌΠ΅Π½ΠΈ, на самом Π΄Π΅Π»Π΅, Π·Π°Π½ΠΈΠΌΠ°Π΅Ρ‚ творчСский процСсс… Π‘ΠΎΠ»ΡŒΡˆΠ°Ρ Ρ‡Π°ΡΡ‚ΡŒ Β«ΠΆΠΈΠ·Π½ΠΈΒ» ΡƒΡ…ΠΎΠ΄ΠΈΡ‚ на отрисовку бСсконСчного количСства Π²Π°Ρ€ΠΈΠ°Π½Ρ‚ΠΎΠ², поиска СдинствСнно Π²ΠΎΠ·ΠΌΠΎΠΆΠ½ΠΎΠΉ Ρ„ΠΎΡ€ΠΌΡ‹, ΠΏΡ€ΠΎΡ€Π°Π±ΠΎΡ‚ΠΊΡƒ дСсятков Π΄ΠΎΠΏΠΎΠ»Π½ΠΈΡ‚Π΅Π»ΡŒΠ½Ρ‹Ρ… ΠΌΠ°ΠΊΠ΅Ρ‚ΠΎΠ², Ρ‚ΠΈΠΏΠΎΠ²Ρ‹Ρ… элСмСнтов ΠΈΒ Ρ‚.Β Π΄. А Ссли ΠΏΡ€Π΅Π΄ΡΡ‚Π°Π²ΠΈΡ‚ΡŒ, Ρ‡Ρ‚ΠΎ это пятый ΠΌΠ°ΠΊΠ΅Ρ‚ Π΄ΠΈΠ·Π°ΠΉΠ½Π° сайта ΡΡ‚Ρ€ΠΎΠΈΡ‚Π΅Π»ΡŒΠ½ΠΎΠΉ ΠΊΠΎΠΌΠΏΠ°Π½ΠΈΠΈ Ρ‚ΠΎΠ»ΡŒΠΊΠΎ в этом Π³ΠΎΠ΄Ρƒ, становится совсСм грустно. Π˜Β Ρ€Π°Π±ΠΎΡ‚Π° прСвращаСтся Π²Β ΡΠ΅Ρ€ΡƒΡŽ Ρ€ΡƒΡ‚ΠΈΠ½Ρƒ.

Как ΠΏΠΎΠΊΠ°Π·Ρ‹Π²Π°Π΅Ρ‚ ΠΏΡ€Π°ΠΊΡ‚ΠΈΠΊΠ°, Ссли это ΡΠ»ΡƒΡ‡ΠΈΠ»ΠΎΡΡŒΒ β€” Ρ…ΠΎΡ€ΠΎΡˆΠ΅Π³ΠΎ, ΠΊΡ€Π΅Π°Ρ‚ΠΈΠ²Π½ΠΎΠ³ΠΎ Ρ€Π΅Π·ΡƒΠ»ΡŒΡ‚Π°Ρ‚Π° ΠΎΡ‚Β Π΄ΠΈΠ·Π°ΠΉΠ½Π΅Ρ€Π° Π½Π΅Β ΠΆΠ΄ΠΈ. Π‘Π°ΠΉΡ‚ пятой ΡΡ‚Ρ€ΠΎΠΈΡ‚Π΅Π»ΡŒΠ½ΠΎΠΉ ΠΊΠΎΠΌΠΏΠ°Π½ΠΈΠΈ Π±ΡƒΠ΄Π΅Ρ‚ Ρ‚Π°ΠΊΠΈΠΌΒ ΠΆΠ΅ прСсным и скучным, ΠΊΠ°ΠΊ ΠΎΡ‚Ρ€Π°ΠΆΠ΅Π½ΠΈΠ΅ Π»ΠΈΡ†Π° Π²Β ΠΌΠΎΠ½ΠΈΡ‚ΠΎΡ€Π΅ Π΄ΠΈΠ·Π°ΠΉΠ½Π΅Ρ€Π°.


Для Ρ‚ΠΎΠ³ΠΎ Ρ‡Ρ‚ΠΎΠ±Ρ‹ Π½Π°Ρ€ΠΈΡΠΎΠ²Π°Ρ‚ΡŒ Ρ‚Π°ΠΊΡƒΡŽ ΠΊΠ°Ρ€Ρ‚ΠΈΠ½ΠΊΡƒ с нуля Π²Β Ρ„ΠΎΡ‚ΠΎΡˆΠΎΠΏΠ΅, ΠΎΠΏΡ‹Ρ‚Π½ΠΎΠΌΡƒ тСхничСскому Π΄ΠΈΠ·Π°ΠΉΠ½Π΅Ρ€Ρƒ потрСбуСтся Π΄Π²Π°-Ρ‚Ρ€ΠΈ часа… Но вСдь Π³ΠΎΡ€Π°Π·Π΄ΠΎ приятнСй, ΠΏΠΎΡ‚Ρ€Π°Ρ‚ΠΈΡ‚ΡŒ ΠΏΡΡ‚Π½Π°Π΄Ρ†Π°Ρ‚ΡŒ ΠΌΠΈΠ½ΡƒΡ‚ Π½Π°Β ΠΏΠΎΡ…ΠΎΠ΄ в блиТайший ΠΌΠ°Π³Π°Π·ΠΈΠ½ Π·Π°Β ΠΏΠΎΠΊΡƒΠΏΠΊΠΎΠΉ, принСсти в офис ΠΏΠΎΠ» ΠΊΠΈΠ»ΠΎ Π°Ρ€ΠΎΠΌΠ°Ρ‚Π½ΠΎΠ³ΠΎ, сдобного ΠΏΠ΅Ρ‡Π΅Π½ΡŒΡ, ΡΡ„ΠΎΡ‚ΠΎΠ³Ρ€Π°Ρ„ΠΈΡ€ΠΎΠ²Π°Ρ‚ΡŒ всС Ρ†ΠΈΡ„Ρ€ΠΎ-ΠΌΡ‹Π»ΡŒΠ½ΠΈΡ†Π΅ΠΉ, ΠΏΠΎΡ‚ΠΎΠΌ Π½Π΅ΠΌΠ½ΠΎΠ³ΠΎ довСсти в извСстной всСм ΠΏΡ€ΠΎΠ³Ρ€Π°ΠΌΠΌΠ΅. Π—Π°Ρ‚Π΅ΠΌ, Π·Π°Β Ρ‡Π°Π΅ΠΌ, Ρ€Π°Π·Π΄Π΅Π»ΠΈΡ‚ΡŒ с коллСктивом остатки сдобной фотосСссии :).

ΠšΠ°ΠΊΠΈΡ…-Ρ‚ΠΎ Ρ€Π°Π΄ΠΈΠΊΠ°Π»ΡŒΠ½Ρ‹Ρ… способов Π±ΠΎΡ€ΡŒΠ±Ρ‹ с подобными кризисами Π½Π°Π²Π΅Ρ€Π½ΠΎΠ΅ нС сущСствуСт. Π Π°Π·Π²Π΅ Ρ‡Ρ‚ΠΎ ΡƒΡΡ‚Ρ€ΠΎΠΈΡ‚ΡŒ Ρ‚Π΅ΠΌΠ½ΡƒΡŽ ΠΌΠ΅Π½Π΅Π΄ΠΆΠ΅Ρ€Ρƒ :), ΠΊΠΎΡ‚ΠΎΡ€ΠΎΠΌΡƒ всСгда ΠΌΠ°Π»ΠΎΒ β€” но это ΠΊΠ°ΠΊ-Ρ‚ΠΎΒ Π½Π΅Β Π³ΡƒΠΌΠ°Π½Π½ΠΎ, Π΄Π°Β ΠΈΒ ΠΏΡ€ΠΎΡ‚ΠΈΠ²ΠΎΡ€Π΅Ρ‡ΠΈΡ‚ Π³Π»ΠΎΠ±Π°Π»ΡŒΠ½Ρ‹ΠΌ интСрСсам ΠΊΠΎΠΌΠΏΠ°Π½ΠΈΠΈ.

Если Π³ΠΎΠ²ΠΎΡ€ΠΈΡ‚ΡŒ ΠΎΒ ΠΏΡ€ΠΈΡ‡ΠΈΠ½Π°Ρ…, то Сй нС всСгда являСтся «пятый в этом Π³ΠΎΠ΄Ρƒ Π΄ΠΈΠ·Π°ΠΉΠ½ сайта ΡΡ‚Ρ€ΠΎΠΈΡ‚Π΅Π»ΡŒΠ½ΠΎΠΉ ΠΊΠΎΠΌΠΏΠ°Π½ΠΈΠΈΒ». ΠžΡ‡Π΅Π½ΡŒ ΠΌΠ½ΠΎΠ³ΠΎ зависит ΠΎΡ‚Β ΠΏΠΎΠ΄Ρ…ΠΎΠ΄Π° ΠΊΒ Ρ€Π°Π±ΠΎΡ‚Π΅. ВсС ΠΌΡ‹Β Π·Π½Π°Π΅ΠΌ, Ρ‡Ρ‚ΠΎ ΠΏΠΎΡ‡Ρ‚ΠΈ Π»ΡŽΠ±ΡƒΡŽ Π½Π΅ΠΎΠ±Ρ…ΠΎΠ΄ΠΈΠΌΡƒΡŽ Ρ„ΠΎΡ‚ΠΎΠ³Ρ€Π°Ρ„ΠΈΡŽ ΠΌΠΎΠΆΠ½ΠΎ Π½Π°ΠΉΡ‚ΠΈ Π²Β ΠΈΠ½Ρ‚Π΅Ρ€Π½Π΅Ρ‚Π΅, ΠΏΠΎΡ‡Ρ‚ΠΈ всё ΠΌΠΎΠΆΠ½ΠΎ Π½Π°Ρ€ΠΈΡΠΎΠ²Π°Ρ‚ΡŒ ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΡ Ρ‚ΠΎΠ»ΡŒΠΊΠΎ Ρ„ΠΎΡ‚ΠΎΡˆΠΎΠΏ, Π°Β Ρ‚ΠΎΒ Ρ‡Ρ‚ΠΎ нСльзя, нарисуСм в максС.

ВсС Π²Π΅Ρ€Π½ΠΎ, Ρ‚ΠΎΠ»ΡŒΠΊΠΎ это бСсконСчноС ΠΏΠΎΠ³Ρ€ΡƒΠΆΠ΅Π½ΠΈΠ΅ в экран ΠΌΠΎΠ½ΠΈΡ‚ΠΎΡ€Π°Β β€” самый Π½Π°Π΄Π΅ΠΆΠ½Ρ‹ΠΉ Ρ€Π΅Ρ†Π΅ΠΏΡ‚ Β«ΠΎΡ‚Π²ΠΎΡ€ΠΎΡ‚Π½ΠΎΠ³ΠΎ зСлья» Π΄Π°ΠΆΠ΅ для ΠΎΡ‡Π΅Π½ΡŒ ΡƒΠ²Π»Π΅Ρ‡Π΅Π½Π½ΠΎΠ³ΠΎ прСдставитСля профСссии. Π Π°Π±ΠΎΡ‚Π°Π΅Ρ‚ нС всСгда быстро, но с почти стопроцСнтным Ρ€Π΅Π·ΡƒΠ»ΡŒΡ‚Π°Ρ‚ΠΎΠΌ Π½Π°Β Π²Ρ‹Ρ…ΠΎΠ΄Π΅.

ΠŸΠΎΡΡ‚ΠΎΠΌΡƒ Ссли у мСня Π΅ΡΡ‚ΡŒ Π²ΠΎΠ·ΠΌΠΎΠΆΠ½ΠΎΡΡ‚ΡŒ ΠΎΡ‚ΠΎΡ€Π²Π°Ρ‚ΡŒΡΡ от экрана, я всСгда ΡΡ‚Π°Ρ€Π°ΡŽΡΡŒ Π΅Π΅Β ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚ΡŒ ΠΈΒ Ρ‚ΠΎΠΆΠ΅ самоС Ρ€Π΅ΠΊΠΎΠΌΠ΅Π½Π΄ΡƒΡŽ всСм ΠΊΡ‚ΠΎ Ρ€Π°Π±ΠΎΡ‚Π°Π΅Ρ‚ у нас Π²Β ΠΊΠΎΠΌΠΏΠ°Π½ΠΈΠΈ.

Π•Π·ΠΆΠ°ΠΉΡ‚Π΅ ΠΏΠΎΠ±Ρ€ΠΎΠ΄ΠΈΡ‚ΡŒ по стройкС, устройтС Ρ„ΠΎΡ‚ΠΎΡΠ΅ΡΡΠΈΡŽ в сосСднСм Π΄Π²ΠΎΡ€Π΅, слСпитС ΠΈΠ»ΠΈ Π²Ρ‹Ρ€Π΅ΠΆΡŒΡ‚Π΅ Ρ‡Ρ‚ΠΎ-Π½ΠΈΠ±ΡƒΠ΄ΡŒ ΠΈΠ·Β Π±ΡƒΠΌΠ°Π³ΠΈ, ΠΏΠΎΠΌΠΎΠ³ΠΈΡ‚Π΅ Ρ€Π°Π·Π³Ρ€ΡƒΠ·ΠΈΡ‚ΡŒ Ρ„ΡƒΡ€Ρƒ с конфСтами, ΠΏΡ€ΠΈΠΌΠ΅Ρ€ΡŒΡ‚Π΅ Ρ€ΠΎΡΡ‚ΠΎΠ²ΡƒΡŽ ΠΊΡƒΠΊΠ»Ρƒ, посСтитС колбасный Π·Π°Π²ΠΎΠ΄, ΠΏΠΎΠ³ΠΎΠ²ΠΎΡ€ΠΈΡ‚Π΅ «за Тизнь» с муТиками из сборочного Ρ†Π΅Ρ…Π°, ΠΏΠΎΠΏΡ€ΠΎΠ±ΡƒΠΉΡ‚Π΅ ΡΠΊΠ°Ρ‚Π°Ρ‚ΡŒ Ρ€ΠΎΠ» Π½Π°Β ΠΊΡƒΡ…Π½Π΅ ΡΡƒΡˆΠΈ-Π±Π°Ρ€Π°… ΠΎΠ΄Π½ΠΈΠΌ словом Π½Π΅Β Π±ΠΎΠΉΡ‚Π΅ΡΡŒ ΠΏΠΎΠ³Ρ€ΡƒΠΆΠ°Ρ‚ΡŒΡΡ в срСду! ВсС это сдСлаСт Π²Π°ΡˆΡƒ Ρ€Π°Π±ΠΎΡ‚Ρƒ Π³ΠΎΡ€Π°Π·Π΄ΠΎ интСрСснСй, ΠΊΠ»ΠΈΠ΅Π½Ρ‚Π° лояльнСй ΠΈΒ Π²Β ΠΊΠΎΠ½Ρ†Π΅ ΠΊΠΎΠ½Ρ†ΠΎΠ² Π½Π°ΠΏΠΎΠ»Π½ΠΈΡ‚ пятый в этом Π³ΠΎΠ΄Ρƒ ΠΌΠ°ΠΊΠ΅Ρ‚ сайта ΡΡ‚Ρ€ΠΎΠΈΡ‚Π΅Π»ΡŒΠ½ΠΎΠΉ ΠΊΠΎΠΌΠΏΠ°Π½ΠΈΠΈ ΠΆΠΈΠ²Ρ‹ΠΌΠΈ красками.

Π£Ρ€ΠΎΠΊ: Π€ΠΎΡ‚ΠΎΡˆΠΎΠΏ-ΠΌΠ°ΠΊΠ΅Ρ‚ для сайта — Π£Ρ€ΠΎΠΊΠΈ Photoshop — ΠŸΠΎΠ»Π΅Π·Π½Ρ‹Π΅ ΡΡ‚Π°Ρ‚ΡŒΠΈ

Π’ этом Π€ΠΎΡ‚ΠΎΡˆΠΎΠΏ ΡƒΡ€ΠΎΠΊΠ΅ Π±ΡƒΠ΄Π΅ΠΌ ΡƒΡ‡ΠΈΡ‚ΡŒΡΡ Ρ€ΠΈΡΠΎΠ²Π°Ρ‚ΡŒ Π»ΠΈΡ†ΠΎ Π²Π°ΡˆΠ΅ΠΌΡƒ сайту.

Π’ΠΎΡ‚ Ρ‚Π°ΠΊΠΎΠΉ ΠΌΠ°ΠΊΠ΅Ρ‚ получится Π² ΠΊΠΎΠ½Ρ†Π΅ ΡƒΡ€ΠΎΠΊΠ°.

НачнитС с создания Π½ΠΎΠ²ΠΎΠ³ΠΎ Π΄ΠΎΠΊΡƒΠΌΠ΅Π½Ρ‚Π° Ρ€Π°Π·ΠΌΠ΅Ρ€ΠΎΠΌ 650 * 550 px.
Π—Π°Π»Π΅ΠΉΡ‚Π΅ Π΅Π³ΠΎ Ρ‚Π°ΠΊΠΈΠΌ Ρ†Π²Π΅Ρ‚ΠΎΠΌ #e6f2e6

Π‘ΠΎΠ·Π΄Π°ΠΉΡ‚Π΅ Π½ΠΎΠ²Ρ‹ΠΉ слой. НарисуйтС ΠΏΡ€ΡΠΌΠΎΡƒΠ³ΠΎΠ»ΡŒΠ½ΠΈΠΊ Π²Π½ΡƒΡ‚Ρ€ΠΈ, отступив ΠΏΡ€ΠΈΠΌΠ΅Ρ€Π½ΠΎ ΠΏΠΎ 30 px с ΠΊΠ°ΠΆΠ΄ΠΎΠΉ стороны. Π’Π°ΠΊΠΆΠ΅ Π·Π°Π»Π΅ΠΉΡ‚Π΅ ΠΊΠ°ΠΊΠΈΠΌ-Π½ΠΈΠ±ΡƒΠ΄ΡŒ Ρ†Π²Π΅Ρ‚ΠΎΠΌ.

НаТмитС Π½Π° ΠΊΠ½ΠΎΠΏΠΊΡƒ Π²Π½ΠΈΠ·Ρƒ ΠΏΠ°Π»ΠΈΡ‚Ρ€Ρ‹ слоСв ΠΈ Π΄ΠΎΠ±Π°Π²ΡŒΡ‚Π΅ стили:

Обводка, ΡˆΠΈΡ€ΠΈΠ½Π° 5 px, Π²Π½ΡƒΡ‚Ρ€ΠΈ, Ρ†Π²Π΅Ρ‚ #296750

ΠŸΡ€ΠΎΠΌΠ΅ΠΆΡƒΡ‚ΠΎΡ‡Π½Ρ‹ΠΉ Ρ€Π΅Π·ΡƒΠ»ΡŒΡ‚Π°Ρ‚:

ΠŸΡ€ΠΈΡΡ‚ΡƒΠΏΠΈΠΌ ΠΊ Ρ€ΠΈΡΠΎΠ²Π°Π½ΠΈΡŽ Π½Π°Π²ΠΈΠ³Π°Ρ†ΠΈΠΈ сайта.

Π‘ ΠΏΠΎΠΌΠΎΡ‰ΡŒΡŽ , нарисуйтС ΠΏΡ€ΡΠΌΠΎΡƒΠ³ΠΎΠ»ΡŒΠ½ΠΎΠ΅ Π²Ρ‹Π΄Π΅Π»Π΅Π½ΠΈΠ΅ Π² ΠΏΡ€Π°Π²ΠΎΠΌ Π²Π΅Ρ€Ρ…Π½Π΅ΠΌ ΡƒΠ³Π»Ρƒ нашСго ΠΌΠ°ΠΊΠ΅Ρ‚Π°.
ΠŸΠ΅Ρ€Π΅ΠΉΠ΄ΠΈΡ‚Π΅ Π² мСню Select >> Modify >> Smooth selection (Π’Ρ‹Π΄Π΅Π»Π΅Π½ΠΈΠ΅ — ΠœΠΎΠ΄ΠΈΡ„ΠΈΠΊΠ°Ρ†ΠΈΡ — ΠžΠΏΡ‚ΠΈΠΌΠΈΠ·ΠΈΡ€ΠΎΠ²Π°Ρ‚ΡŒ) , Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΡΠ³Π»Π°Π΄ΠΈΡ‚ΡŒ края.

Π‘ΠΎΠ·Π΄Π°ΠΉΡ‚Π΅ Π½ΠΎΠ²Ρ‹ΠΉ слой, Π·Π°Π»Π΅ΠΉΡ‚Π΅ Π²Ρ‹Π΄Π΅Π»Π΅Π½ΠΈΠ΅ Ρ†Π²Π΅Ρ‚ΠΎΠΌ #3b9710.

А Ρ‚Π΅ΠΏΠ΅Ρ€ΡŒ ΠΏΡ€ΠΈΠΌΠ΅Π½ΠΈΡ‚Π΅ стили:

1) ВнутрСнняя Ρ‚Π΅Π½ΡŒ:

Π˜ΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠΉΡ‚Π΅ Ρ†Π²Π΅Ρ‚ #184702 для Ρ‚Π΅Π½ΠΈ

2) Обводка, Ρ€Π°Π·ΠΌΠ΅Ρ€ 3 px, Π²Π½ΡƒΡ‚Ρ€ΠΈ, Ρ†Π²Π΅Ρ‚ #FFFFFF, Ρ‚ΠΎ Π΅ΡΡ‚ΡŒ Π±Π΅Π»Ρ‹ΠΉ.

Когда Π²Ρ‹ Π·Π°ΠΊΠΎΠ½Ρ‡ΠΈΡ‚Π΅, слСйтС всС слои ΠΊΠ½ΠΎΠΏΠΊΠΈ. Π”ΡƒΠ±Π»ΠΈΡ€ΡƒΠΉΡ‚Π΅ слой нСсколько Ρ€Π°Π· ΠΈ размСститС ΠΊΠ½ΠΎΠΏΠΊΠΈ Π½Π° ΠΎΠ΄ΠΈΠ½Π°ΠΊΠΎΠ²ΠΎΠΌ расстоянии Π΄Ρ€ΡƒΠ³ ΠΎΡ‚ Π΄Ρ€ΡƒΠ³Π°.

Π‘ΠΎΠ·Π΄Π°ΠΉΡ‚Π΅ Π½ΠΎΠ²Ρ‹ΠΉ слой.

Π‘ ΠΏΠΎΠΌΠΎΡ‰ΡŒΡŽ нарисуйтС ΠΏΡ€ΡΠΌΠΎΡƒΠ³ΠΎΠ»ΡŒΠ½ΠΈΠΊ, ΠΊΠΎΡ‚ΠΎΡ€Ρ‹ΠΉ Π±ΡƒΠ΄Π΅Ρ‚ Π·Π°ΠΊΡ€Ρ‹Π²Π°Ρ‚ΡŒ ниТнюю Ρ‡Π°ΡΡ‚ΡŒ ΠΊΠ½ΠΎΠΏΠΎΠΊ. Π—Π°Π»Π΅ΠΉΡ‚Π΅ Π½ΠΎΠ²ΠΎΠ΅ Π²Ρ‹Π΄Π΅Π»Π΅Π½ΠΈΠ΅ Ρ‚Π°ΠΊΠΈΠΌ Ρ†Π²Π΅Ρ‚ΠΎΠΌ #8fd2fd

ΠŸΡ€ΠΈΠΌΠ΅Π½ΠΈΡ‚Π΅ ΡΡ‚ΠΈΠ»ΡŒ ВСнь:

И сдСлайтС Π±Π΅Π»ΡƒΡŽ ΠΎΠ±Π²ΠΎΠ΄ΠΊΡƒ Ρ€Π°Π·ΠΌΠ΅Ρ€ΠΎΠΌ 3 px.

Π’Π΅ΠΏΠ΅Ρ€ΡŒ Π½Π°ΠΉΠ΄ΠΈΡ‚Π΅ Ρ„ΠΎΡ‚ΠΎ с ΠΏΠ΅ΠΉΠ·Π°ΠΆΠ΅ΠΌ… Ρ‡Ρ‚ΠΎ-Π½ΠΈΠ±ΡƒΠ΄ΡŒ Π½Π΅ΠΉΡ‚Ρ€Π°Π»ΡŒΠ½ΠΎΠ΅, Π½Π°ΠΏΡ€ΠΈΠΌΠ΅Ρ€ Ρ‚Π°ΠΊΠΎΠ΅:

ΠŸΠ΅Ρ€Π΅Ρ‚Π°Ρ‰ΠΈΡ‚Π΅ Ρ„ΠΎΡ‚ΠΎ с ΠΏΠ΅ΠΉΠ·Π°ΠΆΠ΅ΠΌ Π½Π° ваш Ρ€Π°Π±ΠΎΡ‡ΠΈΠΉ Π΄ΠΎΠΊΡƒΠΌΠ΅Π½Ρ‚.
РасполоТитС слой ΠΏΠΎΠ΄ ΠΊΠ½ΠΎΠΏΠΊΠ°ΠΌΠΈ ΠΈ Π³ΠΎΠ»ΡƒΠ±Ρ‹ΠΌ ΠΏΡ€ΡΠΌΠΎΡƒΠ³ΠΎΠ»ΡŒΠ½ΠΈΠΊΠΎΠΌ. Π£Π΄Π°Π»ΠΈΡ‚Π΅ Π½Π΅Π½ΡƒΠΆΠ½Ρ‹Π΅ части.

Π’ΠΎΡ‚, ΠΊ Ρ‡Π΅ΠΌΡƒ Π²Π°ΠΌ Π½ΡƒΠΆΠ½ΠΎ ΡΡ‚Ρ€Π΅ΠΌΠΈΡ‚ΡŒΡΡ…

Π’ΠΎΠ·ΡŒΠΌΠΈΡ‚Π΅ Ρ‚ΠΎ ΠΆΠ΅ самоС Ρ„ΠΎΡ‚ΠΎ, сдСлайтС Π΅Π³ΠΎ мСньшС, размСститС Π² Π»Π΅Π²ΠΎΠΉ сторонС Ρ…Π΅Π΄Π΅Ρ€Π°.

Π˜ΡΠΏΠΎΠ»ΡŒΠ·ΡƒΡ ластик с мягкими краями, ΠΏΡ€ΠΎΠΉΠ΄ΠΈΡ‚Π΅ΡΡŒ ΠΏΠΎ ΠΊΡ€Π°ΡŽ изобраТСния, Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΡΠ΄Π΅Π»Π°Ρ‚ΡŒ ΠΏΠ΅Ρ€Π΅Ρ…ΠΎΠ΄ мягчС.

Π’ΠΎΠ·ΡŒΠΌΠΈΡ‚Π΅ инструмСнт ВСкст, ΡˆΡ€ΠΈΡ„Ρ‚ Arial, Ρ†Π²Π΅Ρ‚ Π±Π΅Π»Ρ‹ΠΉ, Ρ€Π°Π·ΠΌΠ΅Ρ€ 11-12 px, ΠΈ Π½Π°ΠΏΠΈΡˆΠΈΡ‚Π΅ названия ссылок.

На Π΄Π°Π½Π½Ρ‹ΠΉ ΠΌΠΎΠΌΠ΅Π½Ρ‚, Π²ΠΎΡ‚ Ρ‡Ρ‚ΠΎ Ρƒ нас ΠΏΠΎΠ»ΡƒΡ‡ΠΈΠ»ΠΎΡΡŒ.

На пустом Π³ΠΎΠ»ΡƒΠ±ΠΎΠΌ пространствС Π½Π°ΠΏΠΈΡˆΠΈΡ‚Π΅ Π½Π°Π·Π²Π°Π½ΠΈΠ΅ вашСго сайта.

Π›ΠΎΠ³ΠΎΡ‚ΠΈΠΏΡƒ сайта ΠΌΠΎΠΆΠ½ΠΎ Π΄ΠΎΠ±Π°Π²ΠΈΡ‚ΡŒ Π»Π΅Π³ΠΊΠΈΠΉ эффСкт объСма.

Π‘ΠΎΠ·Π΄Π°ΠΉΡ‚Π΅ Π΅Ρ‰Π΅ ΠΎΠ΄ΠΈΠ½ слой. НарисуйтС ΠΏΡ€ΡΠΌΠΎΡƒΠ³ΠΎΠ»ΡŒΠ½ΠΎΠ΅ Π²Ρ‹Π΄Π΅Π»Π΅Π½ΠΈΠ΅ Π² основном ΠΎΠΊΠ½Π΅ ΠΌΠ°ΠΊΠ΅Ρ‚Π° ΠΏΠΎΠ΄ Ρ…Π΅Π΄Π΅Ρ€ΠΎΠΌ (Π·Π°Π³ΠΎΠ»ΠΎΠ²ΠΊΠΎΠΌ)

Π”ΠΎΠ±Π°Π²ΡŒΡ‚Π΅ Π±Π΅Π»ΡƒΡŽ ΠΎΠ±Π²ΠΎΠ΄ΠΊΡƒ снаруТи.

И Π³Ρ€Π°Π΄ΠΈΠ΅Π½Ρ‚: ΠΎΡ‚ #68b13a (свСрху) ΠΊ #2c7e0e (Π²Π½ΠΈΠ·Ρƒ)

ΠŸΡ€ΡΠΌΠΎ ΠΏΠΎΠ²Π΅Ρ€Ρ… Π·Π΅Π»Π΅Π½ΠΎΠ³ΠΎ ΠΏΡ€ΡΠΌΠΎΡƒΠ³ΠΎΠ»ΡŒΠ½ΠΈΠΊΠ° нарисуйтС Π΅Ρ‰Π΅ ΠΎΠ΄ΠΈΠ½ с ΠΏΠΎΠΌΠΎΡ‰ΡŒΡŽ нашСго любимого выдСлСния ΠΈ Π½Π°ΠΆΠΌΠΈΡ‚Π΅ «Delete».

Π’Π°ΠΊΠΈΠΌ ΠΎΠ±Ρ€Π°Π·ΠΎΠΌ, Π²Ρ‹ Π²Ρ‹Ρ€Π΅ΠΆΠ΅Ρ‚Π΅ Π΄Ρ‹Ρ€ΠΊΡƒ Π² Π·Π΅Π»Π΅Π½ΠΎΠΌ ΠΊΠ²Π°Π΄Ρ€Π°Ρ‚Π΅.

Π”ΠΎΠ±Π°Π²ΡŒΡ‚Π΅ тСкст Π² этот ΠΏΡ€ΡΠΌΠΎΡƒΠ³ΠΎΠ»ΡŒΠ½ΠΈΠΊ…

Π’ΠΎ ΠΆΠ΅ самоС ΠΏΠΎΠ²Ρ‚ΠΎΡ€ΠΈΡ‚Π΅ ΠΈ сдСлайтС Π²Ρ‚ΠΎΡ€ΠΎΠ΅ ΠΎΠΊΠ½ΠΎ Π² Π·Π΅Π»Π΅Π½ΠΎΠΌ ΠΊΠ²Π°Π΄Ρ€Π°Ρ‚Π΅. Π­Ρ‚ΠΎ Π±ΡƒΠ΄Π΅Ρ‚ основноС тСкстовоС ΠΎΠΊΠ½ΠΎ.

И Π²ΠΎΡ‚ ваш Ρ€Π΅Π·ΡƒΠ»ΡŒΡ‚Π°Ρ‚!

Π’Π΅Π± ΠΈ Π΄ΠΈΠ·Π°ΠΉΠ½Π΅Ρ€Ρ‹ | Полная ΠΏΠ»Π°Ρ‚Ρ„ΠΎΡ€ΠΌΠ° рСсурсов для Π²Π΅Π±-Π΄ΠΈΠ·Π°ΠΉΠ½Π΅Ρ€ΠΎΠ² ΠΈ Ρ€Π°Π·Ρ€Π°Π±ΠΎΡ‚Ρ‡ΠΈΠΊΠΎΠ² — Π‘ΠΎΠ·Π΄Π°Π½ΠΈΠ΅ ΠΌΠ°ΠΊΠ΅Ρ‚Π° Π²Π΅Π±-сайта Π² Photoshop — ΠŸΠžΠ Π’Π€ΠžΠ›Π˜Π―

объявлСниС

Π’ этом ΡƒΡ€ΠΎΠΊΠ΅ ΠΏΠΎ Ρ„ΠΎΡ‚ΠΎΡˆΠΎΠΏΡƒ ΠΌΡ‹ научимся ΡΠΎΠ·Π΄Π°Π²Π°Ρ‚ΡŒ чистый ΠΌΠ°ΠΊΠ΅Ρ‚ Π²Π΅Π±-сайта. БистСма сСтки 960 — это Ρ‚ΠΎ, Ρ‡Ρ‚ΠΎ ΠΌΡ‹ собираСмся ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚ΡŒ Π² этом ΡƒΡ€ΠΎΠΊΠ΅, ΠΈ мноТСство Ρ‚Π΅Ρ…Π½ΠΈΠΊ Ρ„ΠΎΡ‚ΠΎΡˆΠΎΠΏΠ° Π±ΡƒΠ΄ΡƒΡ‚ рассмотрСны ΠΏΠΎ ΠΌΠ΅Ρ€Π΅ прохоТдСния. ΠŸΠ΅Ρ€Π΅Π΄ Ρ‚Π΅ΠΌ, ΠΊΠ°ΠΊ Π½Π°Ρ‡Π°Ρ‚ΡŒ, Π²ΠΎΡ‚ ΠΎΠΊΠΎΠ½Ρ‡Π°Ρ‚Π΅Π»ΡŒΠ½Ρ‹ΠΉ ΠΏΡ€Π΅Π΄Π²Π°Ρ€ΠΈΡ‚Π΅Π»ΡŒΠ½Ρ‹ΠΉ просмотр ΠΌΠ°ΠΊΠ΅Ρ‚Π° Ρ„ΠΎΡ‚ΠΎΡˆΠΎΠΏΠ°.

Π’Π²Π΅Π΄ΠΈΡ‚Π΅ адрСс элСктронной ΠΏΠΎΡ‡Ρ‚Ρ‹ ΠΈ скачайтС Π΅Π³ΠΎ сСйчас!

Π’Π²Π΅Π΄ΠΈΡ‚Π΅ свой адрСс элСктронной ΠΏΠΎΡ‡Ρ‚Ρ‹, ΠΈ ссылка для Π·Π°Π³Ρ€ΡƒΠ·ΠΊΠΈ Π±ΡƒΠ΄Π΅Ρ‚ ΠΎΡ‚ΠΏΡ€Π°Π²Π»Π΅Π½Π° ​​прямо Π½Π° ваш ΠΏΠΎΡ‡Ρ‚ΠΎΠ²Ρ‹ΠΉ ящик.

Π¨Π°Π³ 1: Π”ΠΎΠ±Π°Π²ΡŒΡ‚Π΅ сСтку 960

Π’Ρ‹Ρ€Π°Π²Π½ΠΈΠ²Π°Π½ΠΈΠ΅ Π½Π΅ΠΎΠ±Ρ…ΠΎΠ΄ΠΈΠΌΠΎ для любого Π΄ΠΈΠ·Π°ΠΉΠ½Π°. ΠœΡ‹ Π±ΡƒΠ΄Π΅ΠΌ ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚ΡŒ систСму 960s Grid, ΠΊΠΎΡ‚ΠΎΡ€ΡƒΡŽ Π²Ρ‹ ΠΌΠΎΠΆΠ΅Ρ‚Π΅ ΡΠΊΠ°Ρ‡Π°Ρ‚ΡŒ здСсь. ПослС Π·Π°Π³Ρ€ΡƒΠ·ΠΊΠΈ Ρ„Π°ΠΉΠ»Π° ΠΎΡ‚ΠΊΡ€ΠΎΠΉΡ‚Π΅ 960_grid_12_col.psd, ΠΊΠΎΡ‚ΠΎΡ€Ρ‹ΠΉ находится Π² ΠΏΠ°ΠΏΠΊΠ΅ Ρ„ΠΎΡ‚ΠΎΡˆΠΎΠΏΠ°. ΠžΠ±Ρ‹Ρ‡Π½ΠΎ Ρ€Π°Π·ΠΌΠ΅Ρ€ Π΄ΠΎΠΊΡƒΠΌΠ΅Π½Ρ‚Π° составляСт 1080 X 1080 пиксСлСй, Π½ΠΎ для нашСго шаблона Π½Π°ΠΌ Π½ΡƒΠΆΠ½ΠΎ 1200 X 1100 пиксСлСй. Π§Ρ‚ΠΎΠ±Ρ‹ ΠΈΠ·ΠΌΠ΅Π½ΠΈΡ‚ΡŒ Ρ€Π°Π·ΠΌΠ΅Ρ€ шаблона, ΠΏΠ΅Ρ€Π΅ΠΉΠ΄ΠΈΡ‚Π΅ Π² мСню Β«Π˜Π·ΠΎΠ±Ρ€Π°ΠΆΠ΅Π½ΠΈΠ΅Β» -> Β«Π Π°Π·ΠΌΠ΅Ρ€ холста», Π²Π²Π΅Π΄ΠΈΡ‚Π΅ ΡˆΠΈΡ€ΠΈΠ½Ρƒ 180 ΠΈ высоту 80 ΠΈ Π½Π°ΠΆΠΌΠΈΡ‚Π΅ стрСлку Π²Π²Π΅Ρ€Ρ…. Π­Ρ‚ΠΎ сдСлаСт шаблон 1200 X 1100 пиксСлСй. Π§Ρ‚ΠΎΠ±Ρ‹ Π·Π°Π»ΠΈΡ‚ΡŒ Ρ„ΠΎΠ½ΠΎΠ²Ρ‹ΠΉ слой Π±Π΅Π»Ρ‹ΠΌ Ρ†Π²Π΅Ρ‚ΠΎΠΌ, Π²Ρ‹Π±Π΅Ρ€ΠΈΡ‚Π΅ Ρ„ΠΎΠ½ΠΎΠ²Ρ‹ΠΉ слой, Π½Π°ΠΆΠΌΠΈΡ‚Π΅ Shift + Backspace ΠΈ Π·Π°Π»Π΅ΠΉΡ‚Π΅ Π΅Π³ΠΎ Π±Π΅Π»Ρ‹ΠΌ Ρ†Π²Π΅Ρ‚ΠΎΠΌ.

Π¨Π°Π³ 2: Π‘Ρ‚Ρ€ΡƒΠΊΡ‚ΡƒΡ€Π° ΠΏΠ°ΠΏΠΊΠΈ

МнС нравится ΡΠΎΡ…Ρ€Π°Π½ΡΡ‚ΡŒ структуру ΠΏΡ€ΠΈ ΠΏΡ€ΠΎΠ΅ΠΊΡ‚ΠΈΡ€ΠΎΠ²Π°Π½ΠΈΠΈ Ρ‡Π΅Π³ΠΎ-Π»ΠΈΠ±ΠΎ, ΠΈ ΠΌΠ½Π΅ нравится, ΠΊΠΎΠ³Π΄Π° Π²Ρ‹ это Π΄Π΅Π»Π°Π΅Ρ‚Π΅. Π Π°Π·Π΄Π΅Π»ΠΈΡ‚Π΅ этот Π΄ΠΈΠ·Π°ΠΉΠ½ Π½Π° 3 части (Π²Π΅Ρ€Ρ…Π½ΠΈΠΉ ΠΊΠΎΠ»ΠΎΠ½Ρ‚ΠΈΡ‚ΡƒΠ», основной тСкст ΠΈ Π½ΠΈΠΆΠ½ΠΈΠΉ ΠΊΠΎΠ»ΠΎΠ½Ρ‚ΠΈΡ‚ΡƒΠ»). Π§Ρ‚ΠΎΠ±Ρ‹ Ρ€Π΅Π°Π»ΠΈΠ·ΠΎΠ²Π°Ρ‚ΡŒ это, создайтС Ρ‚Ρ€ΠΈ ΠΏΠ°ΠΏΠΊΠΈ с ΠΈΠΌΠ΅Π½Π°ΠΌΠΈ Header, Body ΠΈ Footer Π² ΠΏΠ°Π»ΠΈΡ‚Ρ€Π΅ слоСв. ΠœΡ‹ Π±ΡƒΠ΄Π΅ΠΌ Ρ€Π°Π±ΠΎΡ‚Π°Ρ‚ΡŒ Π½Π°Π΄ ΠΊΠ°ΠΆΠ΄Ρ‹ΠΌ Ρ€Π°Π·Π΄Π΅Π»ΠΎΠΌ шаг Π·Π° шагом: сначала Π½Π°Π΄ Π·Π°Π³ΠΎΠ»ΠΎΠ²ΠΊΠΎΠΌ, Π·Π°Ρ‚Π΅ΠΌ Π½Π°Π΄ Ρ‚Π΅Π»ΠΎΠΌ ΠΈ, Π½Π°ΠΊΠΎΠ½Π΅Ρ†, Π½Π°Π΄ Π½ΠΈΠΆΠ½ΠΈΠΌ ΠΊΠΎΠ»ΠΎΠ½Ρ‚ΠΈΡ‚ΡƒΠ»ΠΎΠΌ.

Π¨Π°Π³ 3. Π”ΠΎΠ±Π°Π²ΡŒΡ‚Π΅ Π³Ρ€Π°Π΄ΠΈΠ΅Π½Ρ‚Π½Ρ‹ΠΉ Ρ„ΠΎΠ½ Π² Π·Π°Π³ΠΎΠ»ΠΎΠ²ΠΎΠΊ

ΠŸΠ΅Ρ€Π΅Π΄ Π΄ΠΎΠ±Π°Π²Π»Π΅Π½ΠΈΠ΅ΠΌ Π³Ρ€Π°Π΄ΠΈΠ΅Π½Ρ‚Π½ΠΎΠ³ΠΎ Ρ„ΠΎΠ½Π° ΠΌΡ‹ Π΄ΠΎΠ±Π°Π²ΠΈΠΌ Π½Π°ΠΏΡ€Π°Π²Π»ΡΡŽΡ‰ΠΈΠ΅ Π»ΠΈΠ½ΠΈΠΈ.НаТмитС View -> New Guide, Π²Ρ‹Π±Π΅Ρ€ΠΈΡ‚Π΅ Π³ΠΎΡ€ΠΈΠ·ΠΎΠ½Ρ‚Π°Π»ΡŒΠ½Ρ‹ΠΉ ΠΈ Π²Π²Π΅Π΄ΠΈΡ‚Π΅ 100 для ΠΏΠΎΠ·ΠΈΡ†ΠΈΠΈ. ΠŸΠΎΠ²Ρ‚ΠΎΡ€ΠΈΡ‚Π΅ Ρ‚ΠΎΡ‚ ΠΆΠ΅ шаг, Ρ‡Ρ‚ΠΎΠ±Ρ‹ Π΄ΠΎΠ±Π°Π²ΠΈΡ‚ΡŒ Π½Π°ΠΏΡ€Π°Π²Π»ΡΡŽΡ‰ΡƒΡŽ линию 140 пиксСлСй ΠΈ 180 пиксСлСй.

Π§Ρ‚ΠΎΠ±Ρ‹ Π΄ΠΎΠ±Π°Π²ΠΈΡ‚ΡŒ Π³Ρ€Π°Π΄ΠΈΠ΅Π½Ρ‚Π½Ρ‹ΠΉ Ρ„ΠΎΠ½ Π² Ρ€Π°Π·Π΄Π΅Π» Π·Π°Π³ΠΎΠ»ΠΎΠ²ΠΊΠ°, создайтС Π½ΠΎΠ²Ρ‹ΠΉ слой ΠΏΠΎΠ΄ Π½Π°Π·Π²Π°Π½ΠΈΠ΅ΠΌ Header bg. Π˜ΡΠΏΠΎΠ»ΡŒΠ·ΡƒΡ инструмСнт выдСлСния, создайтС Π²Ρ‹Π΄Π΅Π»Π΅Π½ΠΈΠ΅ Ρ€Π°Π·ΠΌΠ΅Ρ€ΠΎΠΌ 1200×140 пиксСлСй, Π·Π°Ρ‚Π΅ΠΌ Π½Π°ΠΆΠΌΠΈΡ‚Π΅ Shift + Backspace ΠΈ Π·Π°Π»Π΅ΠΉΡ‚Π΅ Π΅Π³ΠΎ Π»ΡŽΠ±Ρ‹ΠΌ Ρ†Π²Π΅Ρ‚ΠΎΠΌ. Π—Π°Ρ‚Π΅ΠΌ Ρ‰Π΅Π»ΠΊΠ½ΠΈΡ‚Π΅ ΠΏΡ€Π°Π²ΠΎΠΉ ΠΊΠ½ΠΎΠΏΠΊΠΎΠΉ ΠΌΡ‹ΡˆΠΈ слой Header bg ΠΈ Π²Ρ‹Π±Π΅Ρ€ΠΈΡ‚Π΅ ΠΏΠ°Ρ€Π°ΠΌΠ΅Ρ‚Ρ€Ρ‹ налоТСния. ΠŸΡ€ΠΈΠΌΠ΅Π½ΠΈΡ‚Π΅ ΡΠ»Π΅Π΄ΡƒΡŽΡ‰ΠΈΠ΅ настройки для налоТСния Π³Ρ€Π°Π΄ΠΈΠ΅Π½Ρ‚Π° Π² соотвСтствии со ΡΠ»Π΅Π΄ΡƒΡŽΡ‰ΠΈΠΌ ΠΈΠ·ΠΎΠ±Ρ€Π°ΠΆΠ΅Π½ΠΈΠ΅ΠΌ.

Π¨Π°Π³ 4. Π”ΠΎΠ±Π°Π²ΡŒΡ‚Π΅ Π΄Π²Π΅ ΠΏΠΈΠΊΡΠ΅Π»ΡŒΠ½Ρ‹Π΅ Π»ΠΈΠ½ΠΈΠΈ

Около 80 пиксСлСй свСрху Π΄ΠΎΠ±Π°Π²ΡŒΡ‚Π΅ Π΄Π²Π΅ Π»ΠΈΠ½ΠΈΠΈ Π² ΠΎΠ΄ΠΈΠ½ пиксСль.Π‘ΠΎΠ·Π΄Π°ΠΉΡ‚Π΅ Π½ΠΎΠ²Ρ‹ΠΉ слой ΠΏΠΎΠ΄ Π½Π°Π·Π²Π°Π½ΠΈΠ΅ΠΌ Line 1px dark, Π²Ρ‹Π±Π΅Ρ€ΠΈΡ‚Π΅ инструмСнт Marquee Tool ΠΈ Π²Ρ‹Π±Π΅Ρ€ΠΈΡ‚Π΅ 940 x 1 px, ΠΊΠ°ΠΊ ΠΏΠΎΠΊΠ°Π·Π°Π½ΠΎ Π½Π° ΠΈΠ·ΠΎΠ±Ρ€Π°ΠΆΠ΅Π½ΠΈΠΈ Π½ΠΈΠΆΠ΅.

Π—Π°Π»Π΅ΠΉΡ‚Π΅ слой Ρ†Π²Π΅Ρ‚ΠΎΠΌ # A54E0F, ΠΏΠΎΠ²Ρ‚ΠΎΡ€ΠΈΡ‚Π΅ Ρ‚ΠΎ ΠΆΠ΅ самоС для Π΄Ρ€ΡƒΠ³ΠΎΠΉ Π»ΠΈΠ½ΠΈΠΈ 1px, Π½Π°Π·ΠΎΠ²ΠΈΡ‚Π΅ Π΅Π³ΠΎ Line 1px dark ΠΈ Π·Π°Π»Π΅ΠΉΡ‚Π΅ Π΅Π³ΠΎ Ρ†Π²Π΅Ρ‚ΠΎΠΌ # E37D1E.

Π¨Π°Π³ 5: врСмя очистки

Π­Ρ‚ΠΎ Ρ…ΠΎΡ€ΠΎΡˆΠ°Ρ ΠΏΡ€ΠΈΠ²Ρ‹Ρ‡ΠΊΠ° Π½Π°Ρ‡ΠΈΠ½Π°Ρ‚ΡŒ ΡΠΈΡΡ‚Π΅ΠΌΠ°Ρ‚ΠΈΠ·ΠΈΡ€ΠΎΠ²Π°Ρ‚ΡŒ Ρ„Π°ΠΉΠ» с самого Π½Π°Ρ‡Π°Π»Π°. Если Π²Ρ‹ Ρ€Π°Π±ΠΎΡ‚Π°Π»ΠΈ с ΠΎΠ΄Π½ΠΎΠΉ ΠΈ Ρ‚ΠΎΠΉ ΠΆΠ΅ ΠΏΠ°ΠΏΠΊΠΎΠΉ (Header bg), вСсь слой, ΠΊΠΎΡ‚ΠΎΡ€Ρ‹ΠΉ ΠΌΡ‹ создали Π΄ΠΎ сих ΠΏΠΎΡ€, Π΄ΠΎΠ»ΠΆΠ΅Π½ Π½Π°Ρ…ΠΎΠ΄ΠΈΡ‚ΡŒΡΡ Π² Π½Π΅ΠΉ. Π”Π°ΠΆΠ΅ Ссли Ρ‚Π΅Π±Π΅ Π½Π΅ ΠΎ Ρ‡Π΅ΠΌ Π²ΠΎΠ»Π½ΠΎΠ²Π°Ρ‚ΡŒΡΡ. Π—Π°Π±Π»ΠΎΠΊΠΈΡ€ΡƒΠΉΡ‚Π΅ свой Ρ„ΠΎΠ½ΠΎΠ²Ρ‹ΠΉ слой.

Π˜ΡΠΏΠΎΠ»ΡŒΠ·ΡƒΡ инструмСнт выдСлСния, ΠΏΠ΅Ρ€Π΅Ρ‚Π°Ρ‰ΠΈΡ‚Π΅ Π²Ρ‹Π΄Π΅Π»Π΅Π½ΠΈΠ΅ Π·Π° ΠΏΡ€Π΅Π΄Π΅Π»Ρ‹ Π΄ΠΎΠΊΡƒΠΌΠ΅Π½Ρ‚Π° Ρ‚Π°ΠΊ, Ρ‡Ρ‚ΠΎΠ±Ρ‹ Π±Ρ‹Π»ΠΈ Π²Ρ‹Π±Ρ€Π°Π½Ρ‹ Ρ‚Ρ€ΠΈ слоя Header bg, Line 1px light ΠΈ Line 1px dark. Π’Π΅ΠΏΠ΅Ρ€ΡŒ Π² ΠΏΠ°Π»ΠΈΡ‚Ρ€Π΅ слоСв ΠΏΠ΅Ρ€Π΅Ρ‚Π°Ρ‰ΠΈΡ‚Π΅ Π²Ρ‹Π±Ρ€Π°Π½Π½Ρ‹Π΅ слои Π² ΠΏΠ°ΠΏΠΊΡƒ Background. Π‘ этого ΠΌΠΎΠΌΠ΅Π½Ρ‚Π° я Π½Π΅ Π±ΡƒΠ΄Ρƒ ΠΎΠ±ΡŠΡΡΠ½ΡΡ‚ΡŒ этот шаг для ΠΎΡ€Π³Π°Π½ΠΈΠ·Π°Ρ†ΠΈΠΈ Ρ„Π°ΠΉΠ»Π°, Π° просто ΠΎΠ±Ρ€Π°Ρ‚ΠΈΡ‚Π΅ΡΡŒ ΠΊ ΡˆΠ°Π³Ρƒ 5.

Π¨Π°Π³ 6. Π’ΡΡ‚Π°Π²ΡŒΡ‚Π΅ свой Π»ΠΎΠ³ΠΎΡ‚ΠΈΠΏ

Π’Π²Π΅Π΄ΠΈΡ‚Π΅ PORTFOLIA Ρ‡ΡƒΡ‚ΡŒ Π²Ρ‹ΡˆΠ΅ 1px Π»ΠΈΠ½ΠΈΠΉ, Ρ‰Π΅Π»ΠΊΠ½ΠΈΡ‚Π΅ ΠΏΡ€Π°Π²ΠΎΠΉ ΠΊΠ½ΠΎΠΏΠΊΠΎΠΉ ΠΌΡ‹ΡˆΠΈ слой portfolia ΠΈ Π΄ΠΎΠ±Π°Π²ΡŒΡ‚Π΅ ΠΏΠ°Ρ€Π°ΠΌΠ΅Ρ‚Ρ€ смСшивания со ΡΠ»Π΅Π΄ΡƒΡŽΡ‰ΠΈΠΌΠΈ настройками.

Π’Π΅ΠΏΠ΅Ρ€ΡŒ ΠΌΡ‹ Π΄ΠΎΠ±Π°Π²ΠΈΠΌ Π·Π°Ρ‚ΡƒΡ…Π°ΡŽΡ‰ΠΈΠΉ свСт Π·Π° Π»ΠΎΠ³ΠΎΡ‚ΠΈΠΏΠΎΠΌ, Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΡΠΎΠ·Π΄Π°Ρ‚ΡŒ Π½ΠΎΠ²Ρ‹ΠΉ слой с ΠΈΠΌΠ΅Π½Π΅ΠΌ Fade, ΡƒΡΡ‚Π°Π½ΠΎΠ²ΠΈΡ‚ΡŒ Ρ€Π΅ΠΆΠΈΠΌ слоя Π½Π° Overlay.Π˜ΡΠΏΠΎΠ»ΡŒΠ·ΡƒΡ инструмСнт Rectangle Marquee Tool, Π²Ρ‹Π±Π΅Ρ€ΠΈΡ‚Π΅ ΠΏΡ€ΡΠΌΠΎΡƒΠ³ΠΎΠ»ΡŒΠ½ΠΈΠΊ, Ρ‡Ρ‚ΠΎΠ±Ρ‹ Π·Π°ΠΊΡ€Ρ‹Ρ‚ΡŒ Π»ΠΎΠ³ΠΎΡ‚ΠΈΠΏ, Π·Π°Ρ‚Π΅ΠΌ Π²Ρ‹Π±Π΅Ρ€ΠΈΡ‚Π΅ ΠΌΡΠ³ΠΊΡƒΡŽ ΠΊΠΈΡΡ‚ΡŒ 175 пиксСлСй ΠΈ установитС Ρ†Π²Π΅Ρ‚ Π½Π° #FFFFFF. ΠšΠ»ΠΈΠΊΠ½ΠΈΡ‚Π΅ ΠΏΠΎ слою нСсколько Ρ€Π°Π·, Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΠΏΡ€ΠΈΠ΄Π°Ρ‚ΡŒ Π΅ΠΌΡƒ эффСкт затухания. Π£ вас Π΄ΠΎΠ»ΠΆΠ΅Π½ Π±Ρ‹Ρ‚ΡŒ свСтовой эффСкт ΠΏΠΎΠ·Π°Π΄ΠΈ Π»ΠΎΠ³ΠΎΡ‚ΠΈΠΏΠ°.

Π¨Π°Π³ 7. Кнопка ΠΏΡ€ΠΈΠ·Ρ‹Π²Π° ΠΊ Π΄Π΅ΠΉΡΡ‚Π²ΠΈΡŽ

Π’Ρ‹Π±Π΅Ρ€ΠΈΡ‚Π΅ инструмСнт ΠŸΡ€ΡΠΌΠΎΡƒΠ³ΠΎΠ»ΡŒΠ½ΠΈΠΊ со скруглСнными ΡƒΠ³Π»Π°ΠΌΠΈ ΠΈ установитС радиус 15 пиксСлСй. ΠŸΠ΅Ρ€Π΅Ρ‚Π°Ρ‰ΠΈΡ‚Π΅, Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΡΠΎΠ·Π΄Π°Ρ‚ΡŒ ΠΊΡ€ΡƒΠ³Π»Ρ‹ΠΉ ΠΏΡ€ΡΠΌΠΎΡƒΠ³ΠΎΠ»ΡŒΠ½ΠΈΠΊ 225 Ρ… 30 пиксСлСй, Π½Π°Π·ΠΎΠ²ΠΈΡ‚Π΅ Π΅Π³ΠΎ ΠžΡ€Π°Π½ΠΆΠ΅Π²Ρ‹ΠΉ ΠΏΡ€ΡΠΌΠΎΡƒΠ³ΠΎΠ»ΡŒΠ½ΠΈΠΊ. Π”ΠΎΠ±Π°Π²ΡŒΡ‚Π΅ ΡΡ‚ΠΈΠ»ΡŒ слоя со ΡΠ»Π΅Π΄ΡƒΡŽΡ‰ΠΈΠΌΠΈ настройками.

Нам Π½ΡƒΠΆΠ½ΠΎ Π΄ΠΎΠ±Π°Π²ΠΈΡ‚ΡŒ ΠΊΡ€ΡƒΠ³Π»Ρ‹ΠΉ ΠΏΡ€ΡΠΌΠΎΡƒΠ³ΠΎΠ»ΡŒΠ½ΠΈΠΊ с Π±Π΅Π»ΠΎ-сСрым Π³Ρ€Π°Π΄ΠΈΠ΅Π½Ρ‚ΠΎΠΌ справа ΠΎΡ‚ ΠΊΠ½ΠΎΠΏΠΊΠΈ ΠΏΡ€ΠΈΠ·Ρ‹Π²Π° ΠΊ Π΄Π΅ΠΉΡΡ‚Π²ΠΈΡŽ.Π’ этой ситуации ΠΌΡ‹ Π½Π΅ ΠΌΠΎΠΆΠ΅ΠΌ ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚ΡŒ инструмСнт Β«ΠŸΡ€ΡΠΌΠΎΡƒΠ³ΠΎΠ»ΡŒΠ½ΠΈΠΊΒ», поэтому ΠΌΡ‹ Π²ΠΎΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠ΅ΠΌΡΡ инструмСнтом Β«ΠŸΠ΅Ρ€ΠΎΒ», Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΡΠΎΠ·Π΄Π°Ρ‚ΡŒ собствСнный ΠΊΡ€ΡƒΠ³Π»Ρ‹ΠΉ ΠΏΡ€ΡΠΌΠΎΡƒΠ³ΠΎΠ»ΡŒΠ½ΠΈΠΊ. Π’Ρ‹Π±Π΅Ρ€ΠΈΡ‚Π΅ инструмСнт Β«ΠŸΠ΅Ρ€ΠΎΒ» нарисуйтС Ρ„ΠΎΡ€ΠΌΡƒ ΠΏΠΎΠ»ΡƒΠΊΡ€ΡƒΠ³Π°, ΠΊΠ°ΠΊ ΠΏΠΎΠΊΠ°Π·Π°Π½ΠΎ Π½ΠΈΠΆΠ΅.

Π”ΠΎΠ±Π°Π²ΡŒΡ‚Π΅ ΠΊ слою ΡΠ»Π΅Π΄ΡƒΡŽΡ‰ΠΈΠ΅ настройки слоя.

ΠΠ°ΠΏΠΈΡˆΠΈΡ‚Π΅ Π½ΠΎΠΌΠ΅Ρ€ Ρ‚Π΅Π»Π΅Ρ„ΠΎΠ½Π° ΠΈ сдСлайтС внСшний Π²ΠΈΠ΄ яркости Π² настройках стиля слоя.

Π”ΠΎΠ±Π°Π²ΡŒΡ‚Π΅ тСкст Β«ΠŸΠΎΠ·Π²ΠΎΠ½ΠΈΡ‚Π΅ Π½Π°ΠΌΒ» ΠΈ ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠΉΡ‚Π΅ ΡΠ»Π΅Π΄ΡƒΡŽΡ‰ΡƒΡŽ настройку.

ΠœΡ‹ ΠΏΠΎΡ‡Ρ‚ΠΈ Π·Π°ΠΊΠΎΠ½Ρ‡ΠΈΠ»ΠΈ с ΠΊΠ½ΠΎΠΏΠΊΠΎΠΉ ΠΏΡ€ΠΈΠ·Ρ‹Π²Π° ΠΊ Π΄Π΅ΠΉΡΡ‚Π²ΠΈΡŽ πŸ™‚, Π½ΠΎ Π½ΡƒΠΆΠ½ΠΎ Π΄ΠΎΠ±Π°Π²ΠΈΡ‚ΡŒ послСдний Π±ΠΈΡ‚. Π”ΠΎΠ±Π°Π²ΡŒΡ‚Π΅ Π΄Π²Π΅ Π»ΠΈΠ½ΠΈΠΈ Ρ€Π°Π·ΠΌΠ΅Ρ€ΠΎΠΌ 1 пиксСль ΠΌΠ΅ΠΆΠ΄Ρƒ тСкстом Β«ΠŸΠΎΠ·Π²ΠΎΠ½ΠΈΡ‚Π΅ Π½Π°ΠΌΒ» ΠΈ Π½ΠΎΠΌΠ΅Ρ€ΠΎΠΌ Ρ‚Π΅Π»Π΅Ρ„ΠΎΠ½Π°.

Π‘ΠΎΠ·Π΄Π°ΠΉΡ‚Π΅ ΠΏΠ°ΠΏΠΊΡƒ с Π½Π°Π·Π²Π°Π½ΠΈΠ΅ΠΌ «Кнопка ΠΏΡ€ΠΈΠ·Ρ‹Π²Π° ΠΊ Π΄Π΅ΠΉΡΡ‚Π²ΠΈΡŽΒ» ΠΈ Π²Ρ‹ΠΏΠΎΠ»Π½ΠΈΡ‚Π΅ шаг 5.

Π¨Π°Π³ 8: Π”ΠΎΠ±Π°Π²ΡŒΡ‚Π΅ Π½Π°Π²ΠΈΠ³Π°Ρ†ΠΈΡŽ

Π’Ρ‹Π±Π΅Ρ€ΠΈΡ‚Π΅ инструмСнт Β«ΠšΡ€ΡƒΠ³Π»Ρ‹ΠΉ ΠΏΡ€ΡΠΌΠΎΡƒΠ³ΠΎΠ»ΡŒΠ½ΠΈΠΊΒ» с радиусом 10 пиксСлСй. НарисуйтС ΠΊΡ€ΡƒΠ³Π»Ρ‹ΠΉ ΠΏΡ€ΡΠΌΠΎΡƒΠ³ΠΎΠ»ΡŒΠ½ΠΈΠΊ Ρ€Π°Π·ΠΌΠ΅Ρ€ΠΎΠΌ 100 x 40 пиксСлСй.

Π”ΠΎΠ±Π°Π²ΠΈΡ‚ΡŒ тСкст Π² мСню Π½Π°Π²ΠΈΠ³Π°Ρ†ΠΈΠΈ.

  • БСмСйство ΡˆΡ€ΠΈΡ„Ρ‚ΠΎΠ²: Verdana
  • Π Π°Π·ΠΌΠ΅Ρ€ ΡˆΡ€ΠΈΡ„Ρ‚Π°: 14pt
  • Π‘Ρ‚ΠΈΠ»ΡŒ ΡˆΡ€ΠΈΡ„Ρ‚Π°: ΠžΠ±Ρ‹Ρ‡Π½Ρ‹ΠΉ
  • Π¦Π²Π΅Ρ‚ ΡˆΡ€ΠΈΡ„Ρ‚Π°: #FFFFFF

Π”Π°Π²Π°ΠΉΡ‚Π΅ Π΄ΠΎΠ±Π°Π²ΠΈΠΌ Π½Π΅ΠΌΠ½ΠΎΠ³ΠΎ Ρ‚Π΅Π½ΠΈ ΠΏΠΎΠ΄ мСню, Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΡΠΎΠ·Π΄Π°Ρ‚ΡŒ Π½ΠΎΠ²Ρ‹ΠΉ слой ΠΏΠΎΠ΄ Π½Π°Π·Π²Π°Π½ΠΈΠ΅ΠΌ Nav bottom shadow.Π‘ ΠΏΠΎΠΌΠΎΡ‰ΡŒΡŽ инструмСнта Β«ΠŸΡ€ΡΠΌΠΎΡƒΠ³ΠΎΠ»ΡŒΠ½ΠΈΠΊΒ» нарисуйтС ΠΏΡ€ΡΠΌΠΎΡƒΠ³ΠΎΠ»ΡŒΠ½ΠΈΠΊ Ρ€Π°Π·ΠΌΠ΅Ρ€ΠΎΠΌ 1200×40 пиксСлСй ΠΈ Π΄ΠΎΠ±Π°Π²ΡŒΡ‚Π΅ Ρ‚Π΅Π½ΡŒ со ΡΠ»Π΅Π΄ΡƒΡŽΡ‰ΠΈΠΌΠΈ настройками

.

ΠœΡ‹ Π·Π°ΠΊΠΎΠ½Ρ‡ΠΈΠ»ΠΈ с Ρ€Π°Π·Π΄Π΅Π»ΠΎΠΌ Π·Π°Π³ΠΎΠ»ΠΎΠ²ΠΊΠ°, поэтому помСститС всС слои ΠΈ ΠΏΠ°ΠΏΠΊΠΈ Π² ΠΏΠ°ΠΏΠΊΡƒ Π·Π°Π³ΠΎΠ»ΠΎΠ²ΠΊΠ°, ΠΊΡ€ΠΎΠΌΠ΅ Ρ„ΠΎΠ½ΠΎΠ²ΠΎΠ³ΠΎ слоя.

Π¨Π°Π³ 9. Π‘Π»Π°ΠΉΠ΄Π΅Ρ€ изобраТСния

Π—Π°Π³Ρ€ΡƒΠ·ΠΈΡ‚Π΅ Ρ‚Ρ€ΠΈ изобраТСния ΠΈΠ· SXC

ΠŸΠΎΠΌΠ΅ΡΡ‚ΠΈΡ‚Π΅ Π·Π°Π³Ρ€ΡƒΠΆΠ΅Π½Π½Ρ‹Π΅ изобраТСния Π² Π΄ΠΎΠΊΡƒΠΌΠ΅Π½Ρ‚. Π˜Π·ΠΌΠ΅Π½ΠΈΡ‚Π΅ Ρ€Π°Π·ΠΌΠ΅Ρ€ изобраТСния подсолнуха ΠΈ ΠΊΠΎΡ€ΠΈΠ°Π½Π΄Ρ€Π° Π΄ΠΎ 300×200 пиксСлСй ΠΈ помСститС Π΅Π³ΠΎ Π² сСрСдину Π΄ΠΎΠΊΡƒΠΌΠ΅Π½Ρ‚Π°. Π˜Π·ΠΌΠ΅Π½ΠΈΡ‚Π΅ Ρ€Π°Π·ΠΌΠ΅Ρ€ Π΄Π²ΡƒΡ… Π΄Ρ€ΡƒΠ³ΠΈΡ… ΠΈΠ·ΠΎΠ±Ρ€Π°ΠΆΠ΅Π½ΠΈΠΉ Π΄ΠΎ 240×158 пиксСлСй ΠΈ помСститС ΠΈΡ… слСва ΠΈ справа ΠΎΡ‚ Π΄ΠΎΠΊΡƒΠΌΠ΅Π½Ρ‚Π°.ПослС совмСщСния ΠΈΠ·ΠΎΠ±Ρ€Π°ΠΆΠ΅Π½ΠΈΠΉ Ρ€Π°Π·ΠΌΡ‹Ρ‚Π΅ Π΄Π²Π° Π½Π΅Π±ΠΎΠ»ΡŒΡˆΠΈΡ… изобраТСния. ΠŸΠ΅Ρ€Π΅ΠΉΠ΄ΠΈΡ‚Π΅ Π² Filter-> Blur-> Motion Blur. УстановитС ΡƒΠ³ΠΎΠ» 180 ΠΈ расстояниС 6 пиксСлСй.

Π’Π΅ΠΏΠ΅Ρ€ΡŒ ΠΎΡ‡Π΅Ρ€Π΅Π΄ΡŒ Ρ‚Π΅Π½Π΅ΠΉ. Π˜ΡΠΏΠΎΠ»ΡŒΠ·ΡƒΡ инструмСнт Β«ΠŸΡ€ΡΠΌΠΎΡƒΠ³ΠΎΠ»ΡŒΠ½ΠΈΠΊΒ», создайтС ΠΏΡ€ΡΠΌΠΎΡƒΠ³ΠΎΠ»ΡŒΠ½ΠΈΠΊ Ρ€Π°Π·ΠΌΠ΅Ρ€ΠΎΠΌ 300 x 120 пиксСлСй ΠΈ Π·Π°Π»Π΅ΠΉΡ‚Π΅ Π΅Π³ΠΎ Ρ‡Π΅Ρ€Π½Ρ‹ΠΌ Ρ†Π²Π΅Ρ‚ΠΎΠΌ # 000000.

Π—Π°Ρ‚Π΅ΠΌ Ρ‰Π΅Π»ΠΊΠ½ΠΈΡ‚Π΅ ΠΏΡ€Π°Π²ΠΎΠΉ ΠΊΠ½ΠΎΠΏΠΊΠΎΠΉ ΠΌΡ‹ΡˆΠΈ ΠΏΡ€ΡΠΌΠΎΡƒΠ³ΠΎΠ»ΡŒΠ½ΠΈΠΊ ΠΈ Π²Ρ‹Π±Π΅Ρ€ΠΈΡ‚Π΅ пСрспСктиву.

ΠŸΠ΅Ρ€Π΅Ρ‚Π°Ρ‰ΠΈΡ‚Π΅ ΡΠΊΠΎΡ€ΡŒ с ΠΎΠ΄Π½ΠΎΠ³ΠΎ ΠΈΠ· Π²Π΅Ρ€Ρ…Π½ΠΈΡ… ΠΊΠΎΠ½Ρ†ΠΎΠ², Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΡΠ΄Π΅Π»Π°Ρ‚ΡŒ Π΅Π³ΠΎ ΠΏΠΎΡ…ΠΎΠΆΠΈΠΌ Π½Π° ΠΈΠ·ΠΎΠ±Ρ€Π°ΠΆΠ΅Π½ΠΈΠ΅ Π½ΠΈΠΆΠ΅. Π’Π΅ΠΏΠ΅Ρ€ΡŒ ΠΏΠ΅Ρ€Π΅ΠΉΠ΄ΠΈΡ‚Π΅ Π² Filter-> Blur-> Motion Blur. УстановитС ΡƒΠ³ΠΎΠ» 180 ΠΈ расстояниС 6 пиксСлСй.Π—Π°Ρ‚Π΅ΠΌ ΠΏΠ΅Ρ€Π΅ΠΉΠ΄ΠΈΡ‚Π΅ Π² Π€ΠΈΠ»ΡŒΡ‚Ρ€-> Π Π°Π·ΠΌΡ‹Ρ‚ΠΈΠ΅-> Π Π°Π·ΠΌΡ‹Ρ‚ΠΈΠ΅ ΠΏΠΎ Гауссу, установитС радиус 5,5 пиксСлСй. Π’ΠΎ врСмя размытия изобраТСния Π²ΡΠΏΠ»Ρ‹Π²Π°ΡŽΡ‰Π΅Π΅ ΠΎΠΊΠ½ΠΎ попросит сначала Ρ€Π°ΡΡ‚Ρ€ΠΈΡ€ΠΎΠ²Π°Ρ‚ΡŒ Ρ„ΠΎΡ€ΠΌΡƒ, Π½Π°ΠΆΠΌΠΈΡ‚Π΅ ОК.

ΠŸΠ΅Ρ€Π΅ΠΌΠ΅ΡΡ‚ΠΈΡ‚Π΅ слой Π·Π° ΠΈΠ·ΠΎΠ±Ρ€Π°ΠΆΠ΅Π½ΠΈΠ΅ΠΌ, ΠΈ ΠΎΠ½ Π΄ΠΎΠ»ΠΆΠ΅Π½ Π²Ρ‹Π³Π»ΡΠ΄Π΅Ρ‚ΡŒ, ΠΊΠ°ΠΊ Π½Π° ΠΈΠ·ΠΎΠ±Ρ€Π°ΠΆΠ΅Π½ΠΈΠΈ Π½ΠΈΠΆΠ΅.

ΠŸΠΎΠ²Ρ‚ΠΎΡ€ΠΈΡ‚Π΅ Ρ‚Π΅ ΠΆΠ΅ шаги с мСньшим ΠΏΡ€ΡΠΌΠΎΡƒΠ³ΠΎΠ»ΡŒΠ½ΠΈΠΊΠΎΠΌ для Π΄Π²ΡƒΡ… Π΄Ρ€ΡƒΠ³ΠΈΡ… ΠΈΠ·ΠΎΠ±Ρ€Π°ΠΆΠ΅Π½ΠΈΠΉ.

Π¨Π°Π³ 10: ΠΏΠΎΠ»Π·ΡƒΠ½ΠΎΠΊ

НарисуйтС ΠΏΠΎΠ»Π·ΡƒΠ½ΠΎΠΊ для ΠΏΠΎΠ»Π·ΡƒΠ½ΠΊΠ° с ΠΏΠΎΠΌΠΎΡ‰ΡŒΡŽ инструмСнта Β«ΠŸΡ€ΡΠΌΠΎΡƒΠ³ΠΎΠ»ΡŒΠ½ΠΈΠΊ со скруглСнными ΡƒΠ³Π»Π°ΠΌΠΈΒ» с радиусом 20 пиксСлСй. Π‘Π½ΠΎΠ²Π° ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΡ инструмСнт ΠŸΡ€ΡΠΌΠΎΡƒΠ³ΠΎΠ»ΡŒΠ½ΠΈΠΊ со скруглСнными ΡƒΠ³Π»Π°ΠΌΠΈ с радиусом 8 пиксСлСй, нарисуйтС ΠΏΡ€ΡΠΌΠΎΡƒΠ³ΠΎΠ»ΡŒΠ½ΠΈΠΊ 70 Ρ… 26 пиксСлСй.ΠŸΡ€ΠΈΠΌΠ΅Π½ΠΈΡ‚Π΅ ΠΊ ΠΏΠΎΠ»Π·ΡƒΠ½ΠΊΡƒ ΡΠ»Π΅Π΄ΡƒΡŽΡ‰ΠΈΠ΅ настройки ΠΏΠ°Ρ€Π°ΠΌΠ΅Ρ‚Ρ€ΠΎΠ² налоТСния.

ΠŸΠΎΡ€Π° Π΄ΠΎΠ±Π°Π²ΠΈΡ‚ΡŒ Ρ€ΡƒΡ‡ΠΊΡƒ ΠΏΠΎΠ»Π·ΡƒΠ½ΠΊΠ° ΠΊ ΠΊΠ½ΠΎΠΏΠΊΠ΅ ΠΏΠΎΠ»Π·ΡƒΠ½ΠΊΠ°. Π˜ΡΠΏΠΎΠ»ΡŒΠ·ΡƒΡ инструмСнт Rectangle Marquee Tool, нарисуйтС ΠΎΠ±Π»Π°ΡΡ‚ΡŒ Ρ€Π°Π·ΠΌΠ΅Ρ€ΠΎΠΌ 1 x 13 пиксСлСй ΠΈ Π·Π°Π»Π΅ΠΉΡ‚Π΅ Π΅Π΅ Π±Π΅Π»Ρ‹ΠΌ Ρ†Π²Π΅Ρ‚ΠΎΠΌ. Π—Π°Ρ‚Π΅ΠΌ ΠΏΡ€ΠΈΠΌΠ΅Π½ΠΈΡ‚Π΅ настройку налоТСния Π³Ρ€Π°Π΄ΠΈΠ΅Π½Ρ‚Π° ΠΊ слою, Π½Π°Π·ΠΎΠ²ΠΈΡ‚Π΅ Π΅Π³ΠΎ 1px gradient line. ΠŸΠΎΠ²Ρ‚ΠΎΡ€ΠΈΡ‚Π΅ слой 4 Ρ€Π°Π·Π° ΠΈ пСрСмСститС скопированный слой ΠΊ смСТным сторонам.

Π¨Π°Π³ 11: ΠžΠ±Π»Π°ΡΡ‚ΡŒ содСрТимого

Π”ΠΎΠ±Π°Π²ΡŒΡ‚Π΅ Π΄Π²Π΅ Π½ΠΎΠ²Ρ‹Π΅ Π½Π°ΠΏΡ€Π°Π²Π»ΡΡŽΡ‰ΠΈΠ΅ 480 ΠΈ 520 пиксСлСй. Π—Π°Ρ‚Π΅ΠΌ Π·Π°Π³Ρ€ΡƒΠ·ΠΈΡ‚Π΅ ΠΈΠΊΠΎΠ½ΠΊΠΈ ΠΈΠ· Π±Π°Π·ΠΎΠ²ΠΎΠ³ΠΎ Π½Π°Π±ΠΎΡ€Π° Pixel-Mixer ΠΈ ΠΈΠ· Π±Π°Π·ΠΎΠ²ΠΎΠ³ΠΎ Π½Π°Π±ΠΎΡ€Π° Pixel-Mixer 2.ΠŸΠ΅Ρ€Π΅Ρ‚Π°Ρ‰ΠΈΡ‚Π΅ Π·Π½Π°Ρ‡ΠΎΠΊ инструмСнта настройки ΠΈΠ· Π±Π°Π·ΠΎΠ²ΠΎΠ³ΠΎ Π½Π°Π±ΠΎΡ€Π° 2 ΠΈΠ· Π·Π°Π³Ρ€ΡƒΠΆΠ΅Π½Π½ΠΎΠ³ΠΎ Π·Π½Π°Ρ‡ΠΊΠ°.

ΠΠ°ΠΏΠΈΡˆΠΈΡ‚Π΅ тСкст для Π·Π°Π³ΠΎΠ»ΠΎΠ²ΠΊΠ° со ΡΠ»Π΅Π΄ΡƒΡŽΡ‰ΠΈΠΌΠΈ настройками

  • Π¨Ρ€ΠΈΡ„Ρ‚: Arial
  • Π Π°Π·ΠΌΠ΅Ρ€ ΡˆΡ€ΠΈΡ„Ρ‚Π°: 18px
  • Π¦Π²Π΅Ρ‚: # E5932A
  • Π‘Ρ‚ΠΈΠ»ΡŒ ΡˆΡ€ΠΈΡ„Ρ‚Π°: ΠšΡƒΡ€ΡΠΈΠ²

Π‘Π΄Π΅Π»Π°Ρ‚ΡŒ Ρ‚ΠΎ ΠΆΠ΅ самоС для основного тСкста со ΡΠ»Π΅Π΄ΡƒΡŽΡ‰ΠΈΠΌΠΈ настройками

  • Π¨Ρ€ΠΈΡ„Ρ‚: Arial
  • Π Π°Π·ΠΌΠ΅Ρ€ ΡˆΡ€ΠΈΡ„Ρ‚Π°: 13px
  • .
  • Π¦Π²Π΅Ρ‚: # 79807C
  • Π‘Ρ‚ΠΈΠ»ΡŒ ΡˆΡ€ΠΈΡ„Ρ‚Π°: ΠžΠ±Ρ‹Ρ‡Π½Ρ‹ΠΉ

ΠŸΠΎΠ²Ρ‚ΠΎΡ€ΠΈΡ‚Π΅ этот шаг с Π΄Ρ€ΡƒΠ³ΠΈΠΌ тСкстом ΠΈ Π·Π½Π°Ρ‡ΠΊΠ°ΠΌΠΈ.Π’ΠΎΠ³Π΄Π° это Π΄ΠΎΠ»ΠΆΠ½ΠΎ Π²Ρ‹Π³Π»ΡΠ΄Π΅Ρ‚ΡŒ ΠΊΠ°ΠΊ Π½Π° ΡΠ»Π΅Π΄ΡƒΡŽΡ‰Π΅ΠΌ ΠΈΠ·ΠΎΠ±Ρ€Π°ΠΆΠ΅Π½ΠΈΠΈ.

ΠŸΠΎΡ€Π° снова ΠΎΡ€Π³Π°Π½ΠΈΠ·ΠΎΠ²Π°Ρ‚ΡŒ Ρ„Π°ΠΉΠ». Π‘ΠΎΠ·Π΄Π°ΠΉΡ‚Π΅ ΠΏΠ°ΠΏΠΊΡƒ с Π²Ρ‹Π·ΠΎΠ²ΠΎΠΌ «ОсновноС содСрТимоС» ΠΈ ΠΏΠΎΠ²Ρ‚ΠΎΡ€ΠΈΡ‚Π΅ шаг 5.

Π¨Π°Π³ 12: Π‘Π²ΠΈΠ΄Π΅Ρ‚Π΅Π»ΡŒΡΡ‚Π²ΠΎ

Π”ΠΎΠ±Π°Π²ΡŒΡ‚Π΅ Π΄Π²Π΅ Π½ΠΎΠ²Ρ‹Π΅ Π½Π°ΠΏΡ€Π°Π²Π»ΡΡŽΡ‰ΠΈΠ΅ Π½Π° 620 ΠΈ 660 пиксСлСй. Π˜ΡΠΏΠΎΠ»ΡŒΠ·ΡƒΡ инструмСнт Β«ΠŸΡ€ΡΠΌΠΎΡƒΠ³ΠΎΠ»ΡŒΠ½ΠΈΠΊ со скруглСнными ΡƒΠ³Π»Π°ΠΌΠΈΒ», создайтС ΠΏΡ€ΡΠΌΠΎΡƒΠ³ΠΎΠ»ΡŒΠ½ΠΈΠΊ с радиусом 10 пиксСлСй (ΡˆΠΈΡ€ΠΈΠ½Π°: 940 пиксСлСй ΠΈ высота: 140 пиксСлСй). ΠŸΡ€ΠΈΠΌΠ΅Π½ΠΈΡ‚Π΅ ΠΊ слою ΡΠ»Π΅Π΄ΡƒΡŽΡ‰ΠΈΠ΅ настройки.

Π˜ΡΠΏΠΎΠ»ΡŒΠ·ΡƒΡ инструмСнт Β«ΠŸΠ΅Ρ€ΠΎΒ», Π΄ΠΎΠ±Π°Π²ΡŒΡ‚Π΅ Π΄Π²Π΅ Ρ‚ΠΎΡ‡ΠΊΠΈ Π½Π° ΠΏΡ€ΡΠΌΠΎΡƒΠ³ΠΎΠ»ΡŒΠ½ΠΈΠΊΠ΅, Π·Π°Ρ‚Π΅ΠΌ с ΠΏΠΎΠΌΠΎΡ‰ΡŒΡŽ инструмСнта прямого выдСлСния ΠΏΠ΅Ρ€Π΅Ρ‚Π°Ρ‰ΠΈΡ‚Π΅ ΠΏΡ€Π°Π²ΡƒΡŽ Ρ‚ΠΎΡ‡ΠΊΡƒ, ΠΊΠ°ΠΊ ΠΏΠΎΠΊΠ°Π·Π°Π½ΠΎ Π½Π° ΠΈΠ·ΠΎΠ±Ρ€Π°ΠΆΠ΅Π½ΠΈΠΈ Π½ΠΈΠΆΠ΅, Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΡΠΎΠ·Π΄Π°Ρ‚ΡŒ своСго Ρ€ΠΎΠ΄Π° стрСлку.

Для Ρ‚ΠΈΠΏΠ° Π·Π½Π°ΠΊΠ° Ρ†ΠΈΡ‚Π°Ρ‚Ρ‹ »со ΡΠ»Π΅Π΄ΡƒΡŽΡ‰ΠΈΠΌΠΈ настройками

  • Π¨Ρ€ΠΈΡ„Ρ‚: Arial
  • Π Π°Π·ΠΌΠ΅Ρ€ ΡˆΡ€ΠΈΡ„Ρ‚Π°: 80px
  • Π¦Π²Π΅Ρ‚: # 6E6C6C
  • Π‘Ρ‚ΠΈΠ»ΡŒ ΡˆΡ€ΠΈΡ„Ρ‚Π°: ΠšΡƒΡ€ΡΠΈΠ²

Π‘Π΄Π΅Π»Π°ΠΉΡ‚Π΅ Ρ‚ΠΎ ΠΆΠ΅ самоС для основного ΠΎΡ‚Π·Ρ‹Π²Π° со ΡΠ»Π΅Π΄ΡƒΡŽΡ‰ΠΈΠΌΠΈ настройками

  • Π¨Ρ€ΠΈΡ„Ρ‚: Arial
  • Π Π°Π·ΠΌΠ΅Ρ€ ΡˆΡ€ΠΈΡ„Ρ‚Π°: 13px
  • .
  • Π¦Π²Π΅Ρ‚: # 79807C
  • Π‘Ρ‚ΠΈΠ»ΡŒ ΡˆΡ€ΠΈΡ„Ρ‚Π°: ΠšΡƒΡ€ΡΠΈΠ²

Π—Π°Ρ‚Π΅ΠΌ Π΄ΠΎΠ±Π°Π²ΡŒΡ‚Π΅ имя с Ρ‚Π°ΠΊΠΈΠΌΠΈ ΠΆΠ΅ настройками, ΠΊΡ€ΠΎΠΌΠ΅ стиля ΡˆΡ€ΠΈΡ„Ρ‚Π°: ΠžΠ±Ρ‹Ρ‡Π½Ρ‹ΠΉ, Π° для ссылки Π½Π° Π²Π΅Π±-сайт ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠΉΡ‚Π΅ Π¦Π²Π΅Ρ‚: # E5932A.

Π¨Π°Π³ 13: Π½ΠΈΠΆΠ½ΠΈΠΉ ΠΊΠΎΠ»ΠΎΠ½Ρ‚ΠΈΡ‚ΡƒΠ»

НарисуйтС ΠΏΡ€ΡΠΌΠΎΡƒΠ³ΠΎΠ»ΡŒΠ½ΠΈΠΊ с ΠΏΠΎΠΌΠΎΡ‰ΡŒΡŽ инструмСнта Β«ΠŸΡ€ΡΠΌΠΎΡƒΠ³ΠΎΠ»ΡŒΠ½ΠΈΠΊ со скруглСнными ΡƒΠ³Π»Π°ΠΌΠΈΒ» с радиусом 8 пиксСлСй, Ρ€Π°Π²Π½Ρ‹ΠΌ 920 x 170 пиксСлСй ΠΈ Ρ†Π²Π΅Ρ‚ΠΎΠΌ # E37DLE. ΠŸΡ€ΠΈΠΌΠ΅Π½ΠΈΡ‚Π΅ ΡΠ»Π΅Π΄ΡƒΡŽΡ‰ΠΈΠ΅ настройки ΠΏΠ°Ρ€Π°ΠΌΠ΅Ρ‚Ρ€ΠΎΠ² ΠΎΠ±Π²ΠΎΠ΄ΠΊΠΈ ΠΊ ΠΏΡ€ΡΠΌΠΎΡƒΠ³ΠΎΠ»ΡŒΠ½ΠΈΠΊΡƒ. НазовитС этот слой Β«Π Π°ΠΌΠΊΠ° ΠΊΠΎΡ€ΠΎΠ±ΠΊΠΈΒ».

Π’Π΅ΠΏΠ΅Ρ€ΡŒ Π² Π½ΠΈΠΆΠ½Π΅ΠΉ части ΠΊΡ€ΡƒΠ³Π»ΠΎΠ³ΠΎ ΠΏΡ€ΡΠΌΠΎΡƒΠ³ΠΎΠ»ΡŒΠ½ΠΈΠΊΠ° создайтС ΠΏΡ€ΡΠΌΠΎΡƒΠ³ΠΎΠ»ΡŒΠ½ΠΈΠΊ Ρ€Π°Π·ΠΌΠ΅Ρ€ΠΎΠΌ 940 x 60 пиксСлСй (Π½Π°Π·ΠΎΠ²ΠΈΡ‚Π΅ этот слой Β«ΠŸΠ΅Ρ€Π΅Π΄Π½ΡΡ Ρ„ΠΎΡ€ΠΌΠ°Β» ΠΈ ΠΏΡ€ΠΈΠΌΠ΅Π½ΠΈΡ‚Π΅ Π½Π°Π»ΠΎΠΆΠ΅Π½ΠΈΠ΅ Π³Ρ€Π°Π΄ΠΈΠ΅Π½Ρ‚Π°, ΠΊΠ°ΠΊ ΠΏΠΎΠΊΠ°Π·Π°Π½ΠΎ Π½Π° ΠΈΠ·ΠΎΠ±Ρ€Π°ΠΆΠ΅Π½ΠΈΠΈ Π½ΠΈΠΆΠ΅.

Π­Ρ‚ΠΎ Π΄ΠΎΠ»ΠΆΠ½ΠΎ Π²Ρ‹Π³Π»ΡΠ΄Π΅Ρ‚ΡŒ Ρ‚Π°ΠΊ.

ПослС создания Π±Π°Π·ΠΎΠ²ΠΎΠΉ основы для Π½ΠΈΠΆΠ½Π΅Π³ΠΎ ΠΊΠΎΠ»ΠΎΠ½Ρ‚ΠΈΡ‚ΡƒΠ»Π° Π΄ΠΎΠ±Π°Π²ΡŒΡ‚Π΅ Ρ‚Π΅Π½ΡŒ ΠΏΠΎΠ΄ Π½Π΅ΠΉ.Для этого нарисуйтС ΠΏΡ€ΡΠΌΠΎΡƒΠ³ΠΎΠ»ΡŒΠ½ΠΈΠΊ 850 Ρ… 70 пиксСлСй, Π½Π°Π·ΠΎΠ²ΠΈΡ‚Π΅ Π΅Π³ΠΎ ВСнь. НаТмитС Edit -> Free Transform, Π·Π°Ρ‚Π΅ΠΌ Ρ‰Π΅Π»ΠΊΠ½ΠΈΡ‚Π΅ ΠΏΡ€Π°Π²ΠΎΠΉ ΠΊΠ½ΠΎΠΏΠΊΠΎΠΉ ΠΌΡ‹ΡˆΠΈ ΠΏΡ€ΡΠΌΠΎΡƒΠ³ΠΎΠ»ΡŒΠ½ΠΈΠΊ ΠΈ Π²Ρ‹Π±Π΅Ρ€ΠΈΡ‚Π΅ Perspective. ΠŸΠ΅Ρ€Π΅Ρ‚Π°Ρ‰ΠΈΡ‚Π΅ Π²Π΅Ρ€Ρ…Π½ΡŽΡŽ Ρ‚ΠΎΡ‡ΠΊΡƒ с ΠΎΠ΄Π½ΠΎΠΉ стороны ΠΏΡ€ΡΠΌΠΎΡƒΠ³ΠΎΠ»ΡŒΠ½ΠΈΠΊΠ° ΠΊ Π΄Ρ€ΡƒΠ³ΠΎΠΉ Ρ‚ΠΎΡ‡ΠΊΠ΅, ΠΏΠΎΠΊΠ° ΠΎΠ½Π° Π½Π΅ станСт ΠΏΠΎΡ…ΠΎΠΆΠ΅ΠΉ Π½Π° ΠΈΠ·ΠΎΠ±Ρ€Π°ΠΆΠ΅Π½ΠΈΠ΅ Π½ΠΈΠΆΠ΅.

ΠŸΠ΅Ρ€Π΅ΠΉΠ΄ΠΈΡ‚Π΅ Π² Filter -> Blur -> Motion Blur ΠΈ ΠΏΡ€ΠΈΠΌΠ΅Π½ΠΈΡ‚Π΅ ΡΠ»Π΅Π΄ΡƒΡŽΡ‰ΠΈΠ΅ настройки.

Π‘Π½ΠΎΠ²Π° ΠΏΠ΅Ρ€Π΅ΠΉΠ΄ΠΈΡ‚Π΅ Π² Π€ΠΈΠ»ΡŒΡ‚Ρ€ -> Π Π°Π·ΠΌΡ‹Ρ‚ΠΈΠ΅ -> Π Π°Π·ΠΌΡ‹Ρ‚ΠΈΠ΅ ΠΏΠΎ Гауссу

ΠŸΠ΅Ρ€Π΅ΠΌΠ΅ΡΡ‚ΠΈΡ‚Π΅ слой Shadow ΠΏΠΎΠ΄ Π΄Ρ€ΡƒΠ³ΠΎΠΉ Π½ΠΈΠΆΠ½ΠΈΠΉ ΠΊΠΎΠ»ΠΎΠ½Ρ‚ΠΈΡ‚ΡƒΠ».

Π§Ρ‚ΠΎΠ±Ρ‹ Π΄ΠΎΠ±Π°Π²ΠΈΡ‚ΡŒ Π±ΠΈΡ‚ΠΎΠ²Ρ‹ΠΉ 3D-эффСкт, Π΄ΠΎΠ±Π°Π²ΡŒΡ‚Π΅ Π½ΠΎΠ²Ρ‹ΠΉ слой Β«ΠŸΡ€ΡΠΌΠΎΡƒΠ³ΠΎΠ»ΡŒΠ½Π°Ρ Ρ„ΠΎΡ€ΠΌΠ° слСва» Ρ€Π°Π·ΠΌΠ΅Ρ€ΠΎΠΌ 26 x 60 пиксСлСй, Π·Π°ΠΊΡ€Π°ΡΡŒΡ‚Π΅ Π΅Π³ΠΎ Ρ†Π²Π΅Ρ‚ΠΎΠΌ # B16117.НаТмитС Edit -> Free Transform, Π·Π°Ρ‚Π΅ΠΌ Ρ‰Π΅Π»ΠΊΠ½ΠΈΡ‚Π΅ ΠΏΡ€Π°Π²ΠΎΠΉ ΠΊΠ½ΠΎΠΏΠΊΠΎΠΉ ΠΌΡ‹ΡˆΠΈ ΠΏΡ€ΡΠΌΠΎΡƒΠ³ΠΎΠ»ΡŒΠ½ΠΈΠΊ ΠΈ Π²Ρ‹Π±Π΅Ρ€ΠΈΡ‚Π΅ Skew. УдСрТивая ΠΊΠ»Π°Π²ΠΈΡˆΡƒ Alt, ΠΏΠ΅Ρ€Π΅Ρ‚Π°Ρ‰ΠΈΡ‚Π΅ Π²Π΅Ρ€Ρ…Π½ΡŽΡŽ ΠΏΡ€Π°Π²ΡƒΡŽ Ρ‚ΠΎΡ‡ΠΊΡƒ Π²Π²Π΅Ρ€Ρ….

ΠŸΠ΅Ρ€Π΅ΠΌΠ΅ΡΡ‚ΠΈΡ‚Π΅ слой Ρ‡ΡƒΡ‚ΡŒ Π½ΠΈΠΆΠ΅ ΠΏΡ€ΡΠΌΠΎΡƒΠ³ΠΎΠ»ΡŒΠ½ΠΈΠΊΠ° Π³Ρ€Π°Π΄ΠΈΠ΅Π½Ρ‚Π°. Π‘Π΄Π΅Π»Π°ΠΉΡ‚Π΅ Ρ‚ΠΎ ΠΆΠ΅ самоС для ΠΏΡ€Π°Π²ΠΎΠΉ стороны, Π·Π° ΠΈΡΠΊΠ»ΡŽΡ‡Π΅Π½ΠΈΠ΅ΠΌ Ρ‚ΠΎΠ³ΠΎ, Ρ‡Ρ‚ΠΎ ΠΏΠ΅Ρ€Π΅Ρ‚Π°Ρ‰ΠΈΡ‚Π΅ Π²Π΅Ρ€Ρ…Π½ΡŽΡŽ Π»Π΅Π²ΡƒΡŽ Ρ‚ΠΎΡ‡ΠΊΡƒ Π²Π²Π΅Ρ€Ρ….

Для ΠΏΡ€ΠΎΠΊΡ€ΡƒΡ‚ΠΊΠΈ эскизов Π½Π°Ρ‡Π½ΠΈΡ‚Π΅ с добавлСния Π½ΠΎΠ²ΠΎΠ³ΠΎ скруглСнного ΠΏΡ€ΡΠΌΠΎΡƒΠ³ΠΎΠ»ΡŒΠ½ΠΈΠΊΠ° (Π½Π°Π·ΠΎΠ²ΠΈΡ‚Π΅ Π΅Π³ΠΎ Image shape) Ρ€Π°Π·ΠΌΠ΅Ρ€ΠΎΠΌ 175x100px, Π·Π°Π»Π΅ΠΉΡ‚Π΅ Π΅Π³ΠΎ Ρ†Π²Π΅Ρ‚ΠΎΠΌ #FFFFFF ΠΈ ΠΏΡ€ΠΈΠΌΠ΅Π½ΠΈΡ‚Π΅ ΠΎΠ±Π²ΠΎΠ΄ΠΊΡƒ 1px # 985414. Π—Π°Π³Ρ€ΡƒΠ·ΠΈΡ‚Π΅ ΠΈΠ·ΠΎΠ±Ρ€Π°ΠΆΠ΅Π½ΠΈΠ΅ MAM Chihuly Show 5 с SXC ΠΈ помСститС Π΅Π³ΠΎ Π½Π°Π΄ слоСм Image shape.Π’Ρ‹Π±Π΅Ρ€ΠΈΡ‚Π΅ слой изобраТСния, Π·Π°Ρ‚Π΅ΠΌ ΠΏΠ΅Ρ€Π΅ΠΉΠ΄ΠΈΡ‚Π΅ Π² Π‘Π»ΠΎΠΉ -> Π‘ΠΎΠ·Π΄Π°Ρ‚ΡŒ ΠΎΠ±Ρ‚Ρ€Π°Π²ΠΎΡ‡Π½ΡƒΡŽ маску, это замаскируСт ΠΈΠ·ΠΎΠ±Ρ€Π°ΠΆΠ΅Π½ΠΈΠ΅ со слоСм ΠΏΡ€ΡΠΌΠΎΡƒΠ³ΠΎΠ»ΡŒΠ½ΠΈΠΊΠ° ΠΏΠΎΠ΄ Π½ΠΈΠΌ. ΠŸΡ€ΠΈ нСобходимости ΠΎΡ‚Ρ€Π΅Π³ΡƒΠ»ΠΈΡ€ΡƒΠΉΡ‚Π΅ ΠΈΠ·ΠΎΠ±Ρ€Π°ΠΆΠ΅Π½ΠΈΠ΅. Π§Ρ‚ΠΎΠ±Ρ‹ ΠΏΠΎΠΊΠ°Π·Π°Ρ‚ΡŒ эффСкт приподнятости Π½Π° ΠΌΠΈΠ½ΠΈΠ°Ρ‚ΡŽΡ€Π΅, Π΄ΠΎΠ±Π°Π²ΡŒΡ‚Π΅ слой ВСнь ΠΈ с ΠΏΠΎΠΌΠΎΡ‰ΡŒΡŽ инструмСнта Эллипс создайтС нСбольшой эллипс ΠΈ ΠΏΠ΅Ρ€Π΅ΠΉΠ΄ΠΈΡ‚Π΅ Π² Π€ΠΈΠ»ΡŒΡ‚Ρ€ -> Π Π°Π·ΠΌΡ‹Ρ‚ΠΈΠ΅ ΠΏΠΎ Гауссу с Raidus 1.3px, Ρ‚Π΅ΠΏΠ΅Ρ€ΡŒ Ρƒ вас Π΄ΠΎΠ»ΠΆΠ½ΠΎ Π±Ρ‹Ρ‚ΡŒ ΡƒΠΌΠ΅Π½ΡŒΡˆΠ΅Π½Π½ΠΎΠ΅ ΠΈΠ·ΠΎΠ±Ρ€Π°ΠΆΠ΅Π½ΠΈΠ΅ с Ρ‚Π΅Π½ΡŒΡŽ, ΠΊΠ°ΠΊ Π½Π° ΠΈΠ·ΠΎΠ±Ρ€Π°ΠΆΠ΅Π½ΠΈΠΈ Π½ΠΈΠΆΠ΅.

ΠŸΠΎΠ²Ρ‚ΠΎΡ€ΠΈΡ‚Π΅ Ρ‚Π΅ ΠΆΠ΅ шаги, Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΡΠΎΠ·Π΄Π°Ρ‚ΡŒ Π΅Ρ‰Π΅ Π΄Π²Π° эскиза.

ПослСдний шаг πŸ™‚ этого ΡƒΡ€ΠΎΠΊΠ° — Π΄ΠΎΠ±Π°Π²ΠΈΡ‚ΡŒ стрСлки для ΠΌΠΈΠ½ΠΈΠ°Ρ‚ΡŽΡ€.Π‘ΠΎΠ·Π΄Π°ΠΉΡ‚Π΅ ΠΊΡ€ΡƒΠ³ (Π½Π°Π·ΠΎΠ²ΠΈΡ‚Π΅ Π΅Π³ΠΎ Π‘Ρ‚Ρ€Π΅Π»ΠΊΠ° ΠΊΡ€ΡƒΠ³ Π²Π»Π΅Π²ΠΎ) Ρ€Π°Π·ΠΌΠ΅Ρ€ΠΎΠΌ 19 x 19 пиксСлСй, ΠΏΡ€ΠΈΠΌΠ΅Π½ΠΈΡ‚Π΅ ΡΠ»Π΅Π΄ΡƒΡŽΡ‰ΠΈΠ΅ настройки ΠΊ слою.

Над слоСм с ΠΊΡ€ΡƒΠ³ΠΎΠΌ Π΄ΠΎΠ±Π°Π²ΡŒΡ‚Π΅ Π½ΠΎΠ²Ρ‹ΠΉ слой ΠΈ Π½Π°Π·ΠΎΠ²ΠΈΡ‚Π΅ Π΅Π³ΠΎ Β«Π‘Ρ‚Ρ€Π΅Π»ΠΊΠ° Π²Π»Π΅Π²ΠΎΒ». Π”ΠΎΠ±Π°Π²ΡŒΡ‚Π΅ ΠΌΠ°Π»Π΅Π½ΡŒΠΊΡƒΡŽ стрСлку ΠΈ ΠΏΡ€ΠΈΠΌΠ΅Π½ΠΈΡ‚Π΅ настройку ΠΎΠ±Π²ΠΎΠ΄ΠΊΠΈ, ΠΊΠ°ΠΊ ΠΏΠΎΠΊΠ°Π·Π°Π½ΠΎ Π½ΠΈΠΆΠ΅.

И послСднСС, Π½ΠΎ Π½Π΅ ΠΌΠ΅Π½Π΅Π΅ Π²Π°ΠΆΠ½ΠΎΠ΅: Π½Π΅ Π·Π°Π±ΡƒΠ΄ΡŒΡ‚Π΅ ΠΎΡ€Π³Π°Π½ΠΈΠ·ΠΎΠ²Π°Ρ‚ΡŒ свои слои. Π’Π°ΠΊ выглядит ΠΌΠΎΠΉ.

Π—Π°ΠΊΠ»ΡŽΡ‡Π΅Π½ΠΈΠ΅

Π˜ΡΠΏΠΎΠ»ΡŒΠ·ΡƒΡ простыС ΠΌΠ΅Ρ‚ΠΎΠ΄Ρ‹, ΠΌΡ‹ ΠΌΠΎΠΆΠ΅ΠΌ ΡΠΎΠ·Π΄Π°Π²Π°Ρ‚ΡŒ свСТиС ΠΈ ΠΊΡ€Π΅Π°Ρ‚ΠΈΠ²Π½Ρ‹Π΅ ΡˆΠ°Π±Π»ΠΎΠ½Ρ‹. Π’ΠΎΡ‚ ΠΎΠΊΠΎΠ½Ρ‡Π°Ρ‚Π΅Π»ΡŒΠ½ΠΎΠ΅ ΠΈΠ·ΠΎΠ±Ρ€Π°ΠΆΠ΅Π½ΠΈΠ΅ Ρ‚ΠΎΠ³ΠΎ, ΠΊΠ°ΠΊ Π΄ΠΎΠ»ΠΆΠ΅Π½ Π²Ρ‹Π³Π»ΡΠ΄Π΅Ρ‚ΡŒ шаблон.Если Ρƒ вас Π΅ΡΡ‚ΡŒ ΠΊΠ°ΠΊΠΈΠ΅-Π»ΠΈΠ±ΠΎ вопросы, Π½Π°ΠΏΠΈΡˆΠΈΡ‚Π΅ ваши Π΄Ρ€Π°Π³ΠΎΡ†Π΅Π½Π½Ρ‹Π΅ ΠΊΠΎΠΌΠΌΠ΅Π½Ρ‚Π°Ρ€ΠΈΠΈ Π½ΠΈΠΆΠ΅, Π° ΠΏΠΎΠΊΠ° ΠΌΠΎΠΈ привСтствия.

Π‘ΠΎΠ·Π΄Π°ΠΉΡ‚Π΅ чистый, минималистичный Π΄ΠΈΠ·Π°ΠΉΠ½ Π²Π΅Π±-сайта Π² Photoshop

БСгодня ΠΌΡ‹ собираСмся ΡΠΎΠ·Π΄Π°Ρ‚ΡŒ чистый, минималистичный ΠΌΠ°ΠΊΠ΅Ρ‚ HTML Π² Photoshop, идСально подходящий для любого Ρ„ΠΎΡ‚ΠΎΠ³Ρ€Π°Ρ„Π° ΠΈΠ»ΠΈ творчСского профСссионала. ΠœΡ‹ Π±ΡƒΠ΄Π΅ΠΌ ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚ΡŒ нСсколько простых эффСктов ΠΈ стилСй слоСв, Ρ‡Ρ‚ΠΎΠ±Ρ‹ Π΄ΠΎΠ±ΠΈΡ‚ΡŒΡΡ минимального Π΄ΠΈΠ·Π°ΠΉΠ½Π°.

ΠžΠΊΠΎΠ½Ρ‡Π°Ρ‚Π΅Π»ΡŒΠ½Ρ‹ΠΉ ΠΌΠ°ΠΊΠ΅Ρ‚ Π²Π΅Π±-сайта

ΠŸΡ€Π΅ΠΆΠ΄Π΅ Ρ‡Π΅ΠΌ ΠΌΡ‹ Π½Π°Ρ‡Π½Π΅ΠΌ, Π²Π°ΠΌ Π½ΡƒΠΆΠ½ΠΎ ΡΠΎΠ±Ρ€Π°Ρ‚ΡŒ нСсколько элСмСнтов, Ρ‡Ρ‚ΠΎΠ±Ρ‹ Π·Π°Π²Π΅Ρ€ΡˆΠΈΡ‚ΡŒ это руководство:

Π¨Π°Π³ 1

Π—Π°Π³Ρ€ΡƒΠ·ΠΈΡ‚Π΅ сСтку 960 ΠΈΠ· 960.gs. Π― ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΡŽ ΠΌΠ°ΠΊΠ΅Ρ‚ ΠΈΠ· 12 столбцов.

Π¨Π°Π³ 2

ΠžΡ‚ΠΊΡ€ΠΎΠΉΡ‚Π΅ шаблон Π² Ρ„ΠΎΡ‚ΠΎΡˆΠΎΠΏΠ΅. Π’Π΅ΠΏΠ΅Ρ€ΡŒ Π½Π°ΠΌ Π½ΡƒΠΆΠ½ΠΎ Π½Π΅ΠΌΠ½ΠΎΠ³ΠΎ ΡƒΠ²Π΅Π»ΠΈΡ‡ΠΈΡ‚ΡŒ Ρ€Π°Π·ΠΌΠ΅Ρ€ холста. Π’Ρ‹Π±Π΅Ρ€ΠΈΡ‚Π΅ Ρ€Π°Π·ΠΌΠ΅Ρ€ холста (Π˜Π·ΠΎΠ±Ρ€Π°ΠΆΠ΅Π½ΠΈΠ΅> Π Π°Π·ΠΌΠ΅Ρ€ холста) ΠΈ ΠΈΠ·ΠΌΠ΅Π½ΠΈΡ‚Π΅ ΠΌΠ°ΠΊΠ΅Ρ‚ Π½Π° 1200 Γ— 1200 пиксСлСй. Π£Π±Π΅Π΄ΠΈΡ‚Π΅ΡΡŒ, Ρ‡Ρ‚ΠΎ ΡΠΊΠΎΡ€ΡŒ установлСн Π² Π²Π΅Ρ€Ρ…Π½ΡŽΡŽ сСрСдину, Ρ‡Ρ‚ΠΎΠ±Ρ‹ слои нашСй сСтки ΠΎΡΡ‚Π°Π²Π°Π»ΠΈΡΡŒ ΠΏΠΎ Ρ†Π΅Π½Ρ‚Ρ€Ρƒ.

Π¨Π°Π³ 3

МнС часто нравится ΡΠΎΠ·Π΄Π°Π²Π°Ρ‚ΡŒ ΠΎΠ±Π»Π°ΡΡ‚ΡŒ ΠΎΠ±Ρ€Π°Π·Ρ†ΠΎΠ² для своСго Π΄ΠΈΠ·Π°ΠΉΠ½Π°, Ρ‡Ρ‚ΠΎΠ±Ρ‹ Π»Π΅Π³ΠΊΠΎ ΠΏΠΎΠ΄Π±ΠΈΡ€Π°Ρ‚ΡŒ Ρ†Π²Π΅Ρ‚Π° Π½Π° Π»Π΅Ρ‚Ρƒ. Π― создам Ρ‚Ρ€ΠΈ ΠΏΡ€ΡΠΌΠΎΡƒΠ³ΠΎΠ»ΡŒΠ½ΠΈΠΊΠ° Π² ΠΏΡ€Π°Π²ΠΎΠΌ Π²Π΅Ρ€Ρ…Π½Π΅ΠΌ ΡƒΠ³Π»Ρƒ, Π·Π°Π»ΠΈΡ‚Ρ‹Π΅ ΡΠ»Π΅Π΄ΡƒΡŽΡ‰ΠΈΠΌΠΈ Ρ†Π²Π΅Ρ‚Π°ΠΌΠΈ: # 777777, #DDDDDD ΠΈ # 00aeef.Π’ΠΊΠ»ΡŽΡ‡ΠΈΡ‚Π΅ Π½Π°ΠΏΡ€Π°Π²Π»ΡΡŽΡ‰ΠΈΠ΅ (ярлык: cmd +;), ΠΈ ΠΌΡ‹ Π³ΠΎΡ‚ΠΎΠ²Ρ‹ ΠΊ созданию.

Π¨Π°Π³ 4

НачнСм с названия. Π’ качСствС основного тСкста ΠΌΡ‹ Π±ΡƒΠ΄Π΅ΠΌ ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚ΡŒ Droid Serif. УстановитС Ρ€Π°Π·ΠΌΠ΅Ρ€ ΡˆΡ€ΠΈΡ„Ρ‚Π° Π½Π° 24 пиксСля ΠΈ Ρ†Π²Π΅Ρ‚ Π½Π° # 77777. ВыровняйтС тСкст ΠΏΠΎ Ρ†Π΅Π½Ρ‚Ρ€Ρƒ страницы, ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΡ ΠΌΠ°ΠΊΠ΅Ρ‚ сСтки.

Π¨Π°Π³ 5

Π”Π°Π²Π°ΠΉΡ‚Π΅ Π΄ΠΎΠ±Π°Π²ΠΈΠΌ ΠΊ Π·Π°Π³ΠΎΠ»ΠΎΠ²ΠΊΡƒ Π²Π΅Ρ€Ρ…Π½ΡŽΡŽ ΠΈ ниТнюю Π³Ρ€Π°Π½ΠΈΡ†Ρ‹. ΠžΡ‚ΠΊΡ€ΠΎΠΉΡ‚Π΅ инструмСнт «Линия» ΠΈ установитС Π΅Π³ΠΎ ΡˆΠΈΡ€ΠΈΠ½Ρƒ 1 пиксСль, ΠΌΡ‹ Π±ΡƒΠ΄Π΅ΠΌ ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚ΡŒ Π±ΠΎΠ»Π΅Π΅ свСтлый сСрый Ρ†Π²Π΅Ρ‚ (# 777777). Π”ΠΎΠ±Π°Π²ΡŒΡ‚Π΅ Π²Π΅Ρ€Ρ…Π½ΡŽΡŽ строку ΠΈ ΠΏΡ€ΠΎΠ΄ΡƒΠ±Π»ΠΈΡ€ΡƒΠΉΡ‚Π΅ Π΅Π΅ (alt + пСрСтаскиваниС).Π—Π°Ρ‚Π΅ΠΌ Π²Ρ‹Π±Π΅Ρ€ΠΈΡ‚Π΅ Π΄Π²Π° Π²Π΅Ρ€Ρ…Π½ΠΈΡ… слоя ΠΈ (alt + ΠΏΠ΅Ρ€Π΅Ρ‚Π°Ρ‰ΠΈΡ‚Π΅), Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΡΠΊΠΎΠΏΠΈΡ€ΠΎΠ²Π°Ρ‚ΡŒ ΠΈΡ… ΠΏΠΎΠ΄ Π·Π°Π³ΠΎΠ»ΠΎΠ²ΠΊΠΎΠΌ. НаконСц, Π²ΠΎΠ·ΡŒΠΌΠΈΡ‚Π΅ инструмСнт ΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚Π΅Π»ΡŒΡΠΊΠΎΠΉ Ρ„ΠΎΡ€ΠΌΡ‹ ΠΈ ΠΎΡ‚ΠΊΡ€ΠΎΠΉΡ‚Π΅ Π³Ρ€ΡƒΠΏΠΏΡƒ Ρ„ΠΈΠ³ΡƒΡ€ ΠΎΡ€Π½Π°ΠΌΠ΅Π½Ρ‚ΠΎΠ² (находится Π² нСбольшом мСню Π² ΠΏΡ€Π°Π²ΠΎΠΌ Π²Π΅Ρ€Ρ…Π½Π΅ΠΌ ΡƒΠ³Π»Ρƒ Ρ€Π°ΡΠΊΡ€Ρ‹Π²Π°ΡŽΡ‰Π΅Π³ΠΎΡΡ списка Ρ„ΠΈΠ³ΡƒΡ€). Π― ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΡŽ ΠΎΡ€Π½Π°ΠΌΠ΅Π½Ρ‚ 5 (см. Π˜Π·ΠΎΠ±Ρ€Π°ΠΆΠ΅Π½ΠΈΠ΅) ΠΈ наш Π³ΠΎΠ»ΡƒΠ±ΠΎΠΉ Ρ†Π²Π΅Ρ‚, Ρ‡Ρ‚ΠΎΠ±Ρ‹ Π½Π°Ρ€ΠΈΡΠΎΠ²Π°Ρ‚ΡŒ ΠΎΡ€Π½Π°ΠΌΠ΅Π½Ρ‚ Π½Π°Π΄ Π·Π°Π³ΠΎΠ»ΠΎΠ²ΠΊΠΎΠΌ.

Π¨Π°Π³ 6

ПослСдняя Ρ‡Π°ΡΡ‚ΡŒ нашСго Π»ΠΎΠ³ΠΎΡ‚ΠΈΠΏΠ° Π±ΡƒΠ΄Π΅Ρ‚ нашим ΠΏΠΎΠ΄Π·Π°Π³ΠΎΠ»ΠΎΠ²ΠΊΠΎΠΌ. Π­Ρ‚ΠΎΡ‚ сайт ΠΏΡ€Π΅Π΄Π½Π°Π·Π½Π°Ρ‡Π΅Π½ для студии Π΄ΠΈΠ·Π°ΠΉΠ½Π° / Ρ„ΠΎΡ‚ΠΎΠ³Ρ€Π°Ρ„ΠΈΠΈ, поэтому Π΄Π°Π²Π°ΠΉΡ‚Π΅ Π²ΠΎΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠ΅ΠΌΡΡ ΠΊΡ€ΡƒΠΏΠ½Ρ‹ΠΌ ΡˆΡ€ΠΈΡ„Ρ‚ΠΎΠΌ (я ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΡŽ Zapfino), Ρ‡Ρ‚ΠΎΠ±Ρ‹ Π½Π°ΠΏΠΈΡΠ°Ρ‚ΡŒ Β«Π”ΠΈΠ·Π°ΠΉΠ½ ΠΈ фотография».

Π¨Π°Π³ 7

Π”Π°Π²Π°ΠΉΡ‚Π΅ Π΄ΠΎΠ±Π°Π²ΠΈΠΌ Ρ‚Π΅ΠΊΡΡ‚ΡƒΡ€ΠΈΡ€ΠΎΠ²Π°Π½Π½ΡƒΡŽ ΠΊΠ½ΠΎΠΏΠΊΡƒ ΠΏΡ€ΠΎΠΊΡ€ΡƒΡ‚ΠΊΠΈ Π²Π²Π΅Ρ€Ρ…Ρƒ страницы для ΠΎΡ‡Π΅Π½ΡŒ Π·Π°ΠΌΠ΅Ρ‚Π½ΠΎΠ³ΠΎ ΠΏΡ€ΠΈΠ·Ρ‹Π²Π° ΠΊ Π΄Π΅ΠΉΡΡ‚Π²ΠΈΡŽ. Π’Ρ‹Π±Ρ€Π°Π² наш синий Ρ†Π²Π΅Ρ‚, нарисуйтС ΠΏΡ€ΡΠΌΠΎΡƒΠ³ΠΎΠ»ΡŒΠ½ΠΈΠΊ Π² ΠΏΡ€Π°Π²ΠΎΠΌ Π²Π΅Ρ€Ρ…Π½Π΅ΠΌ ΡƒΠ³Π»Ρƒ Π΄ΠΎΠΊΡƒΠΌΠ΅Π½Ρ‚Π°. ВыровняйтС ΠΏΠΎ сСткС 960.

Π¨Π°Π³ 8

Π’ΠΎΠ·ΡŒΠΌΠΈΡ‚Π΅ инструмСнт Β«ΠŸΠ΅Ρ€ΠΎΒ» ΠΈ Π΄ΠΎΠ±Π°Π²ΡŒΡ‚Π΅ Ρ‚ΠΎΡ‡ΠΊΡƒ Π² Π½ΠΈΠΆΠ½Π΅ΠΉ Ρ†Π΅Π½Ρ‚Ρ€Π°Π»ΡŒΠ½ΠΎΠΉ Π»ΠΈΠ½ΠΈΠΈ. Π’ΠΎΠ·ΡŒΠΌΠΈΡ‚Π΅ инструмСнт Ρ‚ΠΎΡ‡ΠΊΠΈ прСобразования, Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΡƒΠ΄Π°Π»ΠΈΡ‚ΡŒ ΠΊΡ€ΠΈΠ²Ρ‹Π΅ Π‘Π΅Π·ΡŒΠ΅, ΠΈ ΠΏΠ΅Ρ€Π΅Ρ‚Π°Ρ‰ΠΈΡ‚Π΅ Ρ‚ΠΎΡ‡ΠΊΡƒ Π²Π²Π΅Ρ€Ρ…, Ρ‡Ρ‚ΠΎΠ±Ρ‹ Π΄ΠΎΠ±ΠΈΡ‚ΡŒΡΡ Π½ΡƒΠΆΠ½ΠΎΠ³ΠΎ срСза.

Π¨Π°Π³ 9

Π‘ΠΎΠ·Π΄Π°ΠΉΡ‚Π΅ Π½ΠΎΠ²Ρ‹ΠΉ слой ΠΈ с ΠΏΠΎΠΌΠΎΡ‰ΡŒΡŽ инструмСнта выдСлСния Π²Ρ‹Π΄Π΅Π»ΠΈΡ‚Π΅ Π΄Π²Π° выдСлСния ΠΏΠΎ 6 пиксСлСй Π½Π° ΠΊΡ€Π°ΡŽ свитка.Π—Π°Π»Π΅ΠΉΡ‚Π΅ эти области Π±Π΅Π»Ρ‹ΠΌ Ρ†Π²Π΅Ρ‚ΠΎΠΌ, Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΠΏΠΎΠ»ΡƒΡ‡ΠΈΡ‚ΡŒ ΠΊΡ€Π°ΡΠΈΠ²ΡƒΡŽ Ρ‚ΠΎΠ»ΡΡ‚ΡƒΡŽ Π³Ρ€Π°Π½ΠΈΡ†Ρƒ.

Π¨Π°Π³ 10

УдСрТивая Cmd Ρ‰Π΅Π»ΠΊΠ½ΠΈΡ‚Π΅ Π±Π°Π·ΠΎΠ²Ρ‹ΠΉ слой ΠΏΡ€ΠΎΠΊΡ€ΡƒΡ‚ΠΊΠΈ, Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΠΏΡ€Π΅Π²Ρ€Π°Ρ‚ΠΈΡ‚ΡŒ Π΅Π³ΠΎ ΠΎΠ±Π»Π°ΡΡ‚ΡŒ Π² Π²Ρ‹Π΄Π΅Π»Π΅Π½ΠΈΠ΅. Π˜Π½Π²Π΅Ρ€Ρ‚ΠΈΡ€ΡƒΠΉΡ‚Π΅ Π²Ρ‹Π΄Π΅Π»Π΅Π½ΠΈΠ΅ (cmd + shift + i) ΠΈ, Π²Ρ‹Π±Ρ€Π°Π² Π³Ρ€Π°Π½ΠΈΡ‡Π½Ρ‹ΠΉ слой Π² мСню слоСв, Π½Π°ΠΆΠΌΠΈΡ‚Π΅ Β«Π£Π΄Π°Π»ΠΈΡ‚ΡŒΒ», Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΡƒΠ΄Π°Π»ΠΈΡ‚ΡŒ лишниС Π»ΠΈΠ½ΠΈΠΈ Π·Π° ΠΏΡ€Π΅Π΄Π΅Π»Π°ΠΌΠΈ области ΠΏΡ€ΠΎΠΊΡ€ΡƒΡ‚ΠΊΠΈ.

Π¨Π°Π³ 11

Π’Π΅ΠΏΠ΅Ρ€ΡŒ ΠΌΡ‹ ΠΏΡ€Π΅ΠΎΠ±Ρ€Π°Π·ΡƒΠ΅ΠΌ всю ΠΏΡ€ΠΎΠΊΡ€ΡƒΡ‚ΠΊΡƒ Π² смарт-ΠΎΠ±ΡŠΠ΅ΠΊΡ‚, Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΠΏΡ€ΠΈΠΌΠ΅Π½ΠΈΡ‚ΡŒ Π½Π΅ΠΊΠΎΡ‚ΠΎΡ€Ρ‹Π΅ эффСкты. Π’ мСню слоСв Π²Ρ‹Π±Π΅Ρ€ΠΈΡ‚Π΅ слой ΠΏΡ€ΠΎΠΊΡ€ΡƒΡ‚ΠΊΠΈ ΠΈ Π³Ρ€Π°Π½ΠΈΡ†Ρ‹, Ρ‰Π΅Π»ΠΊΠ½ΠΈΡ‚Π΅ ΠΏΡ€Π°Π²ΠΎΠΉ ΠΊΠ½ΠΎΠΏΠΊΠΎΠΉ ΠΌΡ‹ΡˆΠΈ ΠΈ Π²Ρ‹Π±Π΅Ρ€ΠΈΡ‚Π΅ Π² мСню Β«ΠΏΡ€Π΅ΠΎΠ±Ρ€Π°Π·ΠΎΠ²Π°Ρ‚ΡŒ Π² смарт-ΠΎΠ±ΡŠΠ΅ΠΊΡ‚Β».

Π¨Π°Π³ 12

Π”Π°Π²Π°ΠΉΡ‚Π΅ Π΄ΠΎΠ±Π°Π²ΠΈΠΌ Π½Π΅ΠΌΠ½ΠΎΠ³ΠΎ ΡˆΡƒΠΌΠ°, Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΠΏΡ€ΠΈΠ΄Π°Ρ‚ΡŒ тСкстуру. (Π€ΠΈΠ»ΡŒΡ‚Ρ€> Π¨ΡƒΠΌ> Π”ΠΎΠ±Π°Π²ΠΈΡ‚ΡŒ ΡˆΡƒΠΌ). УстановитС Π΅Π³ΠΎ Π½Π° 1,5%.

Π¨Π°Π³ 13

ΠœΡ‹ Ρ‚Π°ΠΊΠΆΠ΅ Π΄ΠΎΠ±Π°Π²ΠΈΠΌ ΠΎΡ‡Π΅Π½ΡŒ Ρ‚ΠΎΠ½ΠΊΡƒΡŽ Ρ‚Π΅Π½ΡŒ. Π”Π²Π°ΠΆΠ΄Ρ‹ Ρ‰Π΅Π»ΠΊΠ½ΠΈΡ‚Π΅ слой ΠΏΡ€ΠΎΠΊΡ€ΡƒΡ‚ΠΊΠΈ, Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΠΎΡ‚ΠΊΡ€Ρ‹Ρ‚ΡŒ Π΅Π³ΠΎ стили слоя ΠΈ ΠΏΡ€ΠΈΠΌΠ΅Π½ΠΈΡ‚ΡŒ ΡΠ»Π΅Π΄ΡƒΡŽΡ‰ΡƒΡŽ Ρ‚Π΅Π½ΡŒ.

Π¨Π°Π³ 14

НаконСц, Π΄ΠΎΠ±Π°Π²ΡŒΡ‚Π΅ тСкст с ΠΏΡ€ΠΈΠ·Ρ‹Π²ΠΎΠΌ ΠΊ Π΄Π΅ΠΉΡΡ‚Π²ΠΈΡŽ, Ρ‡Ρ‚ΠΎΠ±Ρ‹ Π½Π°ΠΆΠ°Ρ‚ΡŒ ΠΊΠ½ΠΎΠΏΠΊΡƒ ΠΏΡ€ΠΎΠΊΡ€ΡƒΡ‚ΠΊΠΈ. Для этого Π΄ΠΈΠ·Π°ΠΉΠ½Π° ΠΌΡ‹ Π±ΡƒΠ΄Π΅ΠΌ ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚ΡŒ Β«ΠΠ°Π½ΡΡ‚ΡŒ нас».

Π¨Π°Π³ 15

ΠŸΡ€Π΅ΠΆΠ΄Π΅ Ρ‡Π΅ΠΌ ΠΌΡ‹ Π΄ΠΎΠ±Π°Π²ΠΈΠΌ Π½Π°Π²ΠΈΠ³Π°Ρ†ΠΈΡŽ, Π΄Π°Π²Π°ΠΉΡ‚Π΅ Π΄ΠΎΠ±Π°Π²ΠΈΠΌ Π½Π΅Π±ΠΎΠ»ΡŒΡˆΡƒΡŽ тСкстуру Ρ„ΠΎΠ½Π°, Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΡƒΠ»ΡƒΡ‡ΡˆΠΈΡ‚ΡŒ ΠΎΠ±Ρ‰Π΅Π΅ Π²ΠΏΠ΅Ρ‡Π°Ρ‚Π»Π΅Π½ΠΈΠ΅.Π― ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΡŽ Π½Π°Π±ΠΎΡ€ кистСй для Ρ†Π²Π΅Ρ‚Π½Ρ‹Ρ… ΠΊΠ°Ρ€Π°Π½Π΄Π°ΡˆΠ΅ΠΉ ΠΎΡ‚ Brusheezy. Π’ΠΎΠ·ΡŒΠΌΠΈΡ‚Π΅ Π±ΠΎΠ»ΡŒΡˆΡƒΡŽ ΠΊΠΈΡΡ‚ΡŒ своСго свСтло-сСрого Ρ†Π²Π΅Ρ‚Π° ΠΈ нарисуйтС большой Π²Ρ‹Π±ΠΎΡ€. НС Π²ΠΎΠ»Π½ΡƒΠΉΡ‚Π΅ΡΡŒ, Π½Π° ΡΠ»Π΅Π΄ΡƒΡŽΡ‰Π΅ΠΌ шагС ΠΌΡ‹ Π·Π½Π°Ρ‡ΠΈΡ‚Π΅Π»ΡŒΠ½ΠΎ ΡƒΠΌΠ΅Π½ΡŒΡˆΠΈΠΌ это.

Π¨Π°Π³ 16

Π”ΠΎΠ±Π°Π²ΡŒΡ‚Π΅ маску слоя ΠΊ тСкстурированному слою (Π² Π½ΠΈΠΆΠ½Π΅ΠΉ части мСню слоя). Π‘ Π²Ρ‹Π±Ρ€Π°Π½Π½Ρ‹ΠΌ инструмСнтом Π³Ρ€Π°Π΄ΠΈΠ΅Π½Ρ‚Π° нарисуйтС Π³Ρ€Π°Π΄ΠΈΠ΅Π½Ρ‚ ΠΎΡ‚ Ρ‡Π΅Ρ€Π½ΠΎΠ³ΠΎ ΠΊ Π±Π΅Π»ΠΎΠΌΡƒ Π½Π° маскС слоя Π²Π²Π΅Ρ€Ρ…Ρƒ ΠΈ Π²Π½ΠΈΠ·Ρƒ, Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΠΎΡΡ‚Π°Π²ΠΈΡ‚ΡŒ Ρ‡Ρ‚ΠΎ-Ρ‚ΠΎ ΠΏΠΎΡ…ΠΎΠΆΠ΅Π΅ Π½Π° это.

Π¨Π°Π³ 17

БущСствСнно ΡƒΠΌΠ΅Π½ΡŒΡˆΠΈΡ‚Π΅ Π½Π΅ΠΏΡ€ΠΎΠ·Ρ€Π°Ρ‡Π½ΠΎΡΡ‚ΡŒ этого слоя (20%), Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΠΎΡΡ‚Π°Π²ΠΈΡ‚ΡŒ Ρ‚ΠΎΠ»ΡŒΠΊΠΎ ΠΌΠ°Π»Π΅ΠΉΡˆΡƒΡŽ тСкстуру.

Π¨Π°Π³ 18

Π’Π΅ΠΏΠ΅Ρ€ΡŒ Π΄Π°Π²Π°ΠΉΡ‚Π΅ Π΄ΠΎΠ±Π°Π²ΠΈΠΌ Π½Π°ΡˆΡƒ Π½Π°Π²ΠΈΠ³Π°Ρ†ΠΈΡŽ. НапСчатайтС свою Π½Π°Π²ΠΈΠ³Π°Ρ†ΠΈΡŽ ΠΈ Ρ€Π°Π²Π½ΠΎΠΌΠ΅Ρ€Π½ΠΎ распрСдСлитС Π΅Π΅ ΠΏΠΎ Ρ†Π΅Π½Ρ‚Ρ€Ρƒ страницы. Π― Π΄ΠΎΠ±Π°Π²ΠΈΠ» Π΄ΠΎΠΏΠΎΠ»Π½ΠΈΡ‚Π΅Π»ΡŒΠ½Ρ‹Π΅ строки (ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠ΅ΠΌΡ‹Π΅ Π² Π»ΠΎΠ³ΠΎΡ‚ΠΈΠΏΠ΅ Π·Π°Π³ΠΎΠ»ΠΎΠ²ΠΊΠ°), Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΠΎΠ±ΠΎΠ·Π½Π°Ρ‡ΠΈΡ‚ΡŒ Π½Π°Π²ΠΈΠ³Π°Ρ†ΠΈΡŽ. НаконСц, Π΄ΠΎΠ±Π°Π²ΡŒΡ‚Π΅ синиС Ρ€ΠΎΠΌΠ±Ρ‹ (ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΡ инструмСнт настраиваСмого слоя), Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΠΎΡ‚Π΄Π΅Π»ΠΈΡ‚ΡŒ ΠΊΠ°ΠΆΠ΄Ρ‹ΠΉ ΠΏΡƒΠ½ΠΊΡ‚ мСню.

Π¨Π°Π³ 19

Π’ΠΎΠ·ΡŒΠΌΠΈΡ‚Π΅ Ρ„ΠΎΡ‚ΠΎΠ³Ρ€Π°Ρ„ΠΈΡŽ, ΠΊΠΎΡ‚ΠΎΡ€ΡƒΡŽ Ρ…ΠΎΡ‚ΠΈΡ‚Π΅ Ρ€Π°Π·ΠΌΠ΅ΡΡ‚ΠΈΡ‚ΡŒ Π½Π° сайтС. Π― ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΡŽ это ΠΈΠ·ΠΎΠ±Ρ€Π°ΠΆΠ΅Π½ΠΈΠ΅ Π³Ρ€ΡƒΠ·ΠΎΠ²ΠΈΠΊΠ°. Π§Ρ‚ΠΎΠ±Ρ‹ ΡΠΎΠΎΡ‚Π²Π΅Ρ‚ΡΡ‚Π²ΠΎΠ²Π°Ρ‚ΡŒ Ρ‚ΠΎΠ½Ρƒ сайта, я ΡΠΎΠ±ΠΈΡ€Π°ΡŽΡΡŒ ΠΎΠ±Π΅ΡΡ†Π²Π΅Ρ‚ΠΈΡ‚ΡŒ Π΅Π³ΠΎ (Π˜Π·ΠΎΠ±Ρ€Π°ΠΆΠ΅Π½ΠΈΠ΅> ΠšΠΎΡ€Ρ€Π΅ΠΊΡ†ΠΈΡ> ΠžΠ±Π΅ΡΡ†Π²Π΅Ρ‚ΠΈΡ‚ΡŒ).Π’Π°ΠΌ Ρ‚Π°ΠΊΠΆΠ΅ ΠΌΠΎΠΆΠ΅Ρ‚ ΠΏΠΎΡ‚Ρ€Π΅Π±ΠΎΠ²Π°Ρ‚ΡŒΡΡ Π½Π°ΡΡ‚Ρ€ΠΎΠΈΡ‚ΡŒ ΡƒΡ€ΠΎΠ²Π½ΠΈ Π² зависимости ΠΎΡ‚ Π²Ρ‹Π±Ρ€Π°Π½Π½ΠΎΠ³ΠΎ изобраТСния.

Π¨Π°Π³ 20

ΠŸΠ΅Ρ€Π΅Ρ‚Π°Ρ‰ΠΈΡ‚Π΅ Π΅Π³ΠΎ Π² свой шаблон ΠΈ ΠΈΠ·ΠΌΠ΅Π½ΠΈΡ‚Π΅ Ρ€Π°Π·ΠΌΠ΅Ρ€, Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΠΎΠ½ соотвСтствовал области. Если Π²Π°ΠΌ Π½ΡƒΠΆΠ½ΠΎ ΠΎΠ±Ρ€Π΅Π·Π°Ρ‚ΡŒ Π΅Π³ΠΎ, Π²ΠΎΠ·ΡŒΠΌΠΈΡ‚Π΅ инструмСнт выдСлСния, сдСлайтС свой Π²Ρ‹Π±ΠΎΡ€, Π½Π°ΠΆΠΌΠΈΡ‚Π΅ cmd + shift + i, Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΠΈΠ½Π²Π΅Ρ€Ρ‚ΠΈΡ€ΠΎΠ²Π°Ρ‚ΡŒ Π²Ρ‹Π΄Π΅Π»Π΅Π½ΠΈΠ΅ (ΠΊΠ°ΠΊ ΠΌΡ‹ сдСлали с ΠΏΡ€ΠΎΠΊΡ€ΡƒΡ‚ΠΊΠΎΠΉ) ΠΈ ΡƒΠ΄Π°Π»ΠΈΡ‚Π΅ любоС лишнСС ΠΈΠ·ΠΎΠ±Ρ€Π°ΠΆΠ΅Π½ΠΈΠ΅.

Π¨Π°Π³ 21

Π—Π°Ρ‚Π΅ΠΌ ΠΌΡ‹ Π΄ΠΎΠ±Π°Π²ΠΈΠΌ нСсколько сСгмСнтов ΠΊΠΎΠ½Ρ‚Π΅Π½Ρ‚Π° ΠΏΠΎΠ΄ нашим основным ΠΈΠ·ΠΎΠ±Ρ€Π°ΠΆΠ΅Π½ΠΈΠ΅ΠΌ. Π― ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΡŽ Π³ΠΎΠ»ΡƒΠ±ΠΎΠΉ Ρ†Π²Π΅Ρ‚ ΠΈ Droid Serif для Π½Π°Π·Π²Π°Π½ΠΈΠΉ.Π’ΠΎΠ·ΡŒΠΌΠΈΡ‚Π΅ тСкстовый инструмСнт ΠΈ нарисуйтС тСкстовоС ΠΏΠΎΠ»Π΅ Π² 4 красных областях сСтки. Π­Ρ‚ΠΎ Π³Π°Ρ€Π°Π½Ρ‚ΠΈΡ€ΡƒΠ΅Ρ‚, Ρ‡Ρ‚ΠΎ сСгмСнты Ρ€Π°Π²Π½ΠΎΠΌΠ΅Ρ€Π½ΠΎ сбалансированы ΠΏΠΎ страницС. Π”ΠΎΠ±Π°Π²ΡŒΡ‚Π΅ свой тСкст ΠΈΠ»ΠΈ lorem-ipsum. НаконСц, я Π΄ΠΎΠ±Π°Π²ΠΈΠ» Π΅Ρ‰Π΅ ΠΎΠ΄ΠΈΠ½ ΠΎΡ€Π½Π°ΠΌΠ΅Π½Ρ‚ (ΠΈΠ· нашСго Ρ€Π°Π½Π΅Π΅ использовавшСгося инструмСнта создания нСстандартных Ρ„ΠΎΡ€ΠΌ ΠΎΡ€Π½Π°ΠΌΠ΅Π½Ρ‚ΠΎΠ²).

Π¨Π°Π³ 22

ΠŸΡ€ΠΎΠ΄ΡƒΠ±Π»ΠΈΡ€ΡƒΠΉΡ‚Π΅ эту Ρ‚Π΅ΠΊΡΡ‚ΠΎΠ²ΡƒΡŽ ΠΎΠ±Π»Π°ΡΡ‚ΡŒ, Π½Π°ΠΆΠ°Π² Alt + пСрСтаскиваниС, Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΡΠΎΠ·Π΄Π°Ρ‚ΡŒ 3 сСгмСнта содСрТимого.

Π¨Π°Π³ 23

ΠœΡ‹ Ρ…ΠΎΡ‚ΠΈΠΌ ΠΏΠΎΠΊΠ°Π·Π°Ρ‚ΡŒ Π½Π΅ΠΊΠΎΡ‚ΠΎΡ€Ρ‹Π΅ приятныС Π²Π΅Ρ‰ΠΈ, ΠΊΠΎΡ‚ΠΎΡ€Ρ‹Π΅ говорят наши ΠΊΠ»ΠΈΠ΅Π½Ρ‚Ρ‹, поэтому создадим Ρ€Π°Π·Π΄Π΅Π» с ΠΎΡ‚Π·Ρ‹Π²Π°ΠΌΠΈ Π²Π½ΠΈΠ·Ρƒ страницы.НапСчатайтС Ρ†ΠΈΡ‚Π°Ρ‚Ρƒ, ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΡ наши Π΄Ρ€ΠΎΠΈΠ΄Ρ‹ с засСчками, ΠΈ помСститС тСкст ΠΏΠΎ Ρ†Π΅Π½Ρ‚Ρ€Ρƒ. Π”ΠΎΠ±Π°Π²ΡŒΡ‚Π΅ Π³ΠΎΠ»ΡƒΠ±Ρ‹Π΅ ΠΊΠ°Π²Ρ‹Ρ‡ΠΊΠΈ, Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΡΠ΄Π΅Π»Π°Ρ‚ΡŒ Π΅Π³ΠΎ популярным.

Π¨Π°Π³ 24

ΠžΡΡ‚Π°Π»ΡΡ Ρ‚ΠΎΠ»ΡŒΠΊΠΎ Π½ΠΈΠΆΠ½ΠΈΠΉ ΠΊΠΎΠ»ΠΎΠ½Ρ‚ΠΈΡ‚ΡƒΠ». ΠœΡ‹ создадим Π΅Ρ‰Π΅ нСсколько свСтло-сСрых Π»ΠΈΠ½ΠΈΠΉ, Π΄ΠΎΠ±Π°Π²ΠΈΠΌ тСкст ΠΎΠ± авторских ΠΏΡ€Π°Π²Π°Ρ…, скопируСм ΠΎΡ€Π½Π°ΠΌΠ΅Π½Ρ‚ Π·Π°Π³ΠΎΠ»ΠΎΠ²ΠΊΠ° ΠΈ ΠΏΠ΅Ρ€Π΅Π²Π΅Ρ€Π½Π΅ΠΌ Π΅Π³ΠΎ Ρ‚Π°ΠΊ, Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΠΎΠ½ располагался ΠΏΠΎΠ΄ Π½ΠΈΠΆΠ½ΠΈΠΌ ΠΊΠΎΠ»ΠΎΠ½Ρ‚ΠΈΡ‚ΡƒΠ»ΠΎΠΌ (ΠŸΡ€Π°Π²ΠΊΠ°> Π’Ρ€Π°Π½ΡΡ„ΠΎΡ€ΠΌΠΈΡ€ΠΎΠ²Π°Ρ‚ΡŒ> ΠžΡ‚Ρ€Π°Π·ΠΈΡ‚ΡŒ ΠΏΠΎ Π²Π΅Ρ€Ρ‚ΠΈΠΊΠ°Π»ΠΈ)

Π¨Π°Π³ 25

Π― Ρ‚Π°ΠΊΠΆΠ΅ скопировал Π½Π°ΡˆΡƒ тСкстуру Ρ„ΠΎΠ½Π° ΠΈ пСрСмСстил копию Π² Π½ΠΈΠΆΠ½ΠΈΠΉ ΠΊΠΎΠ»ΠΎΠ½Ρ‚ΠΈΡ‚ΡƒΠ», Ρ‡Ρ‚ΠΎΠ±Ρ‹ Π΄ΠΎΠ±Π°Π²ΠΈΡ‚ΡŒ Π½Π΅ΠΌΠ½ΠΎΠ³ΠΎ большС Π²ΠΈΠ·ΡƒΠ°Π»ΡŒΠ½ΠΎΠ³ΠΎ внимания.Π’ΠΎΡ‚ наш ΠΎΠΊΠΎΠ½Ρ‡Π°Ρ‚Π΅Π»ΡŒΠ½Ρ‹ΠΉ Ρ€Π΅Π·ΡƒΠ»ΡŒΡ‚Π°Ρ‚.

НадСюсь, Π²Π°ΠΌ понравился этот простой ΡƒΡ€ΠΎΠΊ. Чистый, минималистичный ΠΌΠ°ΠΊΠ΅Ρ‚ идСально ΠΏΠΎΠ΄ΠΎΠΉΠ΄Π΅Ρ‚ для Π΄ΠΈΠ·Π°ΠΉΠ½-студии, фотостудии ΠΈΠ»ΠΈ любого Π΄Ρ€ΡƒΠ³ΠΎΠ³ΠΎ творчСского профСссионала. Π‘ΠΎΠΎΠ±Ρ‰ΠΈΡ‚Π΅ ΠΌΠ½Π΅ свои мысли Π² Ρ€Π°Π·Π΄Π΅Π»Π΅ ΠΊΠΎΠΌΠΌΠ΅Π½Ρ‚Π°Ρ€ΠΈΠ΅Π², ΠΈ я Ρ…ΠΎΡ‚Π΅Π» Π±Ρ‹ ΡƒΠ²ΠΈΠ΄Π΅Ρ‚ΡŒ Π»ΡŽΠ±Ρ‹Π΅ измСнСния, ΠΊΠΎΡ‚ΠΎΡ€Ρ‹Π΅ Π²Ρ‹ внСсСтС, Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΡƒΠ»ΡƒΡ‡ΡˆΠΈΡ‚ΡŒ Π΄ΠΈΠ·Π°ΠΉΠ½. Π’Ρ‹ ΠΌΠΎΠΆΠ΅Ρ‚Π΅ ΡΠΊΠ°Ρ‡Π°Ρ‚ΡŒ ΠΏΠΎΠ»Π½Ρ‹ΠΉ PSD, Π½Π°ΠΆΠ°Π² ΠΊΠ½ΠΎΠΏΠΊΡƒ Π½ΠΈΠΆΠ΅.

Π‘ΠΊΠ°Ρ‡Π°Ρ‚ΡŒ PSD

ΠŸΠΎΠ΄Π΅Π»ΠΈΡ‚Π΅ΡΡŒ этим с Π΄Ρ€ΡƒΠ·ΡŒΡΠΌΠΈ:

Π₯ΠΎΡ‚ΠΈΡ‚Π΅ большС? ΠŸΠΎΠ΄ΠΏΠΈΡˆΠΈΡ‚Π΅ΡΡŒ, ΠΈ ΠΌΡ‹ Π²Π°ΠΌ Π΅Π³ΠΎ доставим.

ΠŸΠΎΠ΄ΠΏΠΈΡˆΠΈΡ‚Π΅ΡΡŒ Π½Π° RSS-ΠΊΠ°Π½Π°Π» ΠΈΠ»ΠΈ Π½Π° рассылку ΠΎΠ±Π½ΠΎΠ²Π»Π΅Π½ΠΈΠΉ ΠΏΠΎ элСктронной ΠΏΠΎΡ‡Ρ‚Π΅, Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΠΏΠΎΠ»ΡƒΡ‡Π°Ρ‚ΡŒ Π΅Ρ‰Π΅ большС интСрСсного ΠΊΠΎΠ½Ρ‚Π΅Π½Ρ‚Π°!

30 руководств ΠΏΠΎ Photoshop для Π²Π΅Π±-Π΄ΠΈΠ·Π°ΠΉΠ½Π΅Ρ€ΠΎΠ²

Photoshop ΠΌΠΎΠΆΠ½ΠΎ ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚ΡŒ для ΠΌΠ½ΠΎΠ³ΠΈΡ… Ρ†Π΅Π»Π΅ΠΉ, ΠΈ ΠΎΠ΄Π½ΠΎ ΠΈΠ· Π½Π°ΠΈΠ±ΠΎΠ»Π΅Π΅ распространСнных ΠΏΡ€ΠΈΠΌΠ΅Π½Π΅Π½ΠΈΠΉ — для Ρ€Π°Π·Ρ€Π°Π±ΠΎΡ‚ΠΊΠΈ Π²Π΅Π±-интСрфСйсов ΠΈ ΠΌΠΎΠ±ΠΈΠ»ΡŒΠ½Ρ‹Ρ… ΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚Π΅Π»ΡŒΡΠΊΠΈΡ… интСрфСйсов (UI). Π’ΠΎΡ‚ нСсколько руководств ΠΏΠΎ ΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚Π΅Π»ΡŒΡΠΊΠΎΠΌΡƒ интСрфСйсу, Π² ΠΊΠΎΡ‚ΠΎΡ€Ρ‹Ρ… Π²Ρ‹ ΡƒΠ·Π½Π°Π΅Ρ‚Π΅, ΠΊΠ°ΠΊ ΡΠΎΠ·Π΄Π°Π²Π°Ρ‚ΡŒ ΠΏΠΎΠ»Π½Ρ‹Π΅ сайты ΠΈ Ρ€Π°Π·Π»ΠΈΡ‡Π½Ρ‹Π΅ элСмСнты сайта Π² Photoshop.

Π‘Π½Π°Ρ‡Π°Π»Π° ΠΌΡ‹ Π½Π°Ρ‡Π½Π΅ΠΌ с ΠΎΡ‚Π΄Π΅Π»ΡŒΠ½Ρ‹Ρ… элСмСнтов ΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚Π΅Π»ΡŒΡΠΊΠΎΠ³ΠΎ интСрфСйса, Ρ‚Π°ΠΊΠΈΡ… ΠΊΠ°ΠΊ Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹ Ρ†Π΅Π½, Ρ€Π°ΡΠΊΡ€Ρ‹Π²Π°ΡŽΡ‰ΠΈΠ΅ΡΡ мСню, ΠΏΠΎΠ»Π·ΡƒΠ½ΠΊΠΈ, Π°ΡƒΠ΄ΠΈΠΎΠΏΠ»Π΅Π΅Ρ€Ρ‹ ΠΈ Ρ‚. Π”.Π° Π·Π°Ρ‚Π΅ΠΌ ΠΌΡ‹ ΠΏΠ΅Ρ€Π΅ΠΉΠ΄Π΅ΠΌ ΠΊ созданию ΠΏΠΎΠ»Π½Ρ‹Ρ… сайтов.

Для любого сайта, ΠΊΠΎΡ‚ΠΎΡ€Ρ‹ΠΉ ΠΏΡ€ΠΎΠ΄Π°Π΅Ρ‚ Ρ‚ΠΎΠ²Π°Ρ€Ρ‹ ΠΈΠ»ΠΈ услуги, Ρ‚Π°Π±Π»ΠΈΡ†Π° Ρ†Π΅Π½ являСтся Ρ…ΠΎΡ€ΠΎΡˆΠΈΠΌ Π΄ΠΎΠΏΠΎΠ»Π½Π΅Π½ΠΈΠ΅ΠΌ, ΠΏΠΎΡ‚ΠΎΠΌΡƒ Ρ‡Ρ‚ΠΎ ΠΎΠ½Π° позволяСт сразу ΠΏΠΎΠΊΠ°Π·Π°Ρ‚ΡŒ ΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚Π΅Π»ΡΠΌ, Ρ‡Ρ‚ΠΎ Π²Ρ‹ ΠΏΡ€ΠΎΠ΄Π°Π΅Ρ‚Π΅ ΠΈ ΠΏΠΎ ΠΊΠ°ΠΊΠΎΠΉ Ρ†Π΅Π½Π΅. Если Π²Ρ‹ Ρ…ΠΎΡ‚ΠΈΡ‚Π΅ ΡƒΠ·Π½Π°Ρ‚ΡŒ, ΠΊΠ°ΠΊ ΡΠΎΠ·Π΄Π°Ρ‚ΡŒ Ρ‡ΠΈΡΡ‚ΡƒΡŽ ΠΈ ΡΠΎΠ²Ρ€Π΅ΠΌΠ΅Π½Π½ΡƒΡŽ Ρ‚Π°Π±Π»ΠΈΡ†Ρƒ Ρ†Π΅Π½ Π² Photoshop, ΠΎΠ·Π½Π°ΠΊΠΎΠΌΡŒΡ‚Π΅ΡΡŒ с этим руководством.

Π’ этом ΡƒΡ€ΠΎΠΊΠ΅ Illustrator ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠ΅Ρ‚ΡΡ для создания Ρ„ΠΈΠ»ΡŒΡ‚Ρ€Π° Ρ†Π΅Π½ΠΎΠ²ΠΎΠ³ΠΎ Π΄ΠΈΠ°ΠΏΠ°Π·ΠΎΠ½Π°. Π’Π°ΠΌ Π½ΡƒΠΆΠ½ΠΎ Π²Ρ‹ΠΏΠΎΠ»Π½ΠΈΡ‚ΡŒ всСго 18 шагов, Π° само руководство довольно прямолинСйно ΠΈ просто, поэтому, Ссли Π²Ρ‹ срСдний ΡƒΡ€ΠΎΠ²Π΅Π½ΡŒ Π² Illustrator, Π½Π΅ Π±ΠΎΠΉΡ‚Π΅ΡΡŒ ΠΏΠΎΠΏΡ€ΠΎΠ±ΠΎΠ²Π°Ρ‚ΡŒ.

АудиоплССры

ΠΌΠΎΠ³ΡƒΡ‚ ΠΏΠΎΠΊΠ°Π·Π°Ρ‚ΡŒΡΡ ΠΎΡ‡Π΅Π½ΡŒ простыми Π² создании, Π½ΠΎ ΠΊΠΎΠ³Π΄Π° Π²Ρ‹ Ρ€Π°Π·Ρ€Π°Π±Π°Ρ‚Ρ‹Π²Π°Π΅Ρ‚Π΅ ΠΈΡ… Π²ΠΏΠ΅Ρ€Π²Ρ‹Π΅, Π²Π°ΠΌ ΠΌΠΎΠΆΠ΅Ρ‚ Π±Ρ‹Ρ‚ΡŒ слоТно это ΡΠ΄Π΅Π»Π°Ρ‚ΡŒ. Π­Ρ‚ΠΎ руководство шаг Π·Π° шагом ΠΏΡ€ΠΎΠ²Π΅Π΄Π΅Ρ‚ вас Ρ‡Π΅Ρ€Π΅Π· процСсс, ΠΈ Π² ΠΊΠΎΠ½Ρ†Π΅ Ρƒ вас Π±ΡƒΠ΄Π΅Ρ‚ красивый Π°ΡƒΠ΄ΠΈΠΎΠΏΠ»Π΅Π΅Ρ€.

Из этого Ρ‚ΡƒΡ‚ΠΎΡ€ΠΈΠ°Π»Π° Π’Ρ‹ ΡƒΠ·Π½Π°Π΅Ρ‚Π΅, ΠΊΠ°ΠΊ просто ΡΠΎΠ·Π΄Π°Ρ‚ΡŒ простой, Π½ΠΎ ΡΡ‚ΠΈΠ»ΡŒΠ½Ρ‹ΠΉ слайдСр Π² Photoshop.

Π‘ΠΎΠ·Π΄Π°Π½ΠΈΠ΅ интСрфСйса усилитСля ΠΌΠΎΠΆΠ΅Ρ‚ ΠΏΠΎΠΊΠ°Π·Π°Ρ‚ΡŒΡΡ Ρ€Π°ΠΊΠ΅Ρ‚Π½ΠΎΠΉ Π½Π°ΡƒΠΊΠΎΠΉ Π΄Π°ΠΆΠ΅ для ΠΎΠΏΡ‹Ρ‚Π½Ρ‹Ρ… Π΄ΠΈΠ·Π°ΠΉΠ½Π΅Ρ€ΠΎΠ², Π½ΠΎ Π² этом руководствС это ΠΎΠ±ΡŠΡΡΠ½ΡΠ΅Ρ‚ΡΡ Π½Π°ΡΡ‚ΠΎΠ»ΡŒΠΊΠΎ Ρ…ΠΎΡ€ΠΎΡˆΠΎ, Ρ‡Ρ‚ΠΎ Π½Π° самом Π΄Π΅Π»Π΅ это выглядит ΠΊΠ°ΠΊ кусок ΠΏΠΈΡ€ΠΎΠ³Π°.Π’ интСрфСйсС Π΅ΡΡ‚ΡŒ всС элСмСнты управлСния, ΠΊΠ½ΠΎΠΏΠΊΠΈ, полосы, блСстки, Π³Ρ€Π°Π΄ΠΈΠ΅Π½Ρ‚Ρ‹ ΠΈ Ρ‚. Π”., И самоС приятноС Ρ‚ΠΎ, Ρ‡Ρ‚ΠΎ ΠΎΠ½ начинаСтся с нуля, Ρ‚ΠΎ Π΅ΡΡ‚ΡŒ Π²Π°ΠΌ Π½Π΅ понадобятся ΠΊΠ°ΠΊΠΈΠ΅-Π»ΠΈΠ±ΠΎ сторонниС ΠΌΠ°Ρ‚Π΅Ρ€ΠΈΠ°Π»Ρ‹ с нСясными ΠΏΡ€Π°Π²Π°ΠΌΠΈ, Π²Ρ‹ Ρ€Π°Π·Ρ€Π°Π±Π°Ρ‚Ρ‹Π²Π°Π΅Ρ‚Π΅ всС, Ρ‡Ρ‚ΠΎ Π²Π°ΠΌ Π½ΡƒΠΆΠ½ΠΎ.

Π― знаю, Ρ‡Ρ‚ΠΎ Π°ΡƒΠ΄ΠΈΠΎΠΏΠ»Π΅Π΅Ρ€Ρ‹ вряд Π»ΠΈ ΡΠ²Π»ΡΡŽΡ‚ΡΡ Π½Π°ΠΈΠ±ΠΎΠ»Π΅Π΅ часто ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠ΅ΠΌΡ‹ΠΌ элСмСнтом ΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚Π΅Π»ΡŒΡΠΊΠΎΠ³ΠΎ интСрфСйса, Π½ΠΎ ΠΏΠΎΡΠΊΠΎΠ»ΡŒΠΊΡƒ ΠΏΡ€ΠΎΠΈΠ³Ρ€Ρ‹Π²Π°Ρ‚Π΅Π»ΡŒ Π² этом руководствС выглядит ΠΏΠΎΡ‚Ρ€ΡΡΠ°ΡŽΡ‰Π΅, я Π²ΠΊΠ»ΡŽΡ‡ΠΈΠ» Π΅Π³ΠΎ Π² этот список. Π’ этом руководствС ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠ΅Ρ‚ΡΡ Illustrator — Π²Ρ‹ ΠΌΠΎΠΆΠ΅Ρ‚Π΅ ΡΠΎΠ·Π΄Π°Ρ‚ΡŒ Π°Π½Π°Π»ΠΎΠ³ΠΈΡ‡Π½Ρ‹ΠΉ ΠΏΡ€ΠΎΠΈΠ³Ρ€Ρ‹Π²Π°Ρ‚Π΅Π»ΡŒ Π² Photoshop ΠΈΠ»ΠΈ любой Π΄Ρ€ΡƒΠ³ΠΎΠΉ ΠΏΡ€ΠΎΠ³Ρ€Π°ΠΌΠΌΠ΅ для Π΄ΠΈΠ·Π°ΠΉΠ½Π°, Π½ΠΎ с Illustrator это Π½Π°ΠΌΠ½ΠΎΠ³ΠΎ ΠΏΡ€ΠΎΡ‰Π΅.Если Π²Ρ‹ Π½Π΅ Π·Π½Π°ΠΊΠΎΠΌΡ‹ с ΠΌΠ΅Ρ‚ΠΎΠ΄Π°ΠΌΠΈ построСния идСальной Π²Π΅ΠΊΡ‚ΠΎΡ€Π½ΠΎΠΉ Ρ„ΠΎΡ€ΠΌΡ‹ с пиксСлями, Ρƒ вас Π±ΡƒΠ΄Π΅Ρ‚ Π²ΠΎΠ·ΠΌΠΎΠΆΠ½ΠΎΡΡ‚ΡŒ ΡƒΠ·Π½Π°Ρ‚ΡŒ ΠΎ Π½ΠΈΡ… Π² этом ΡƒΡ€ΠΎΠΊΠ΅.

ПослС всСх ΠΊΠΎΠΌΠΏΠΎΠ½Π΅Π½Ρ‚ΠΎΠ² ΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚Π΅Π»ΡŒΡΠΊΠΎΠ³ΠΎ интСрфСйса, ΠΊΠΎΡ‚ΠΎΡ€Ρ‹Π΅ ΠΌΡ‹ рассмотрСли Π΄ΠΎ сих ΠΏΠΎΡ€, ΠΈ ΠΏΠΎΠΊΠ° ΠΌΡ‹ всС Π΅Ρ‰Π΅ Π½Π° Π²ΠΎΠ»Π½Π΅ ΠΈΠ³Ρ€ΠΎΠΊΠΎΠ², этот ΡƒΡ€ΠΎΠΊ ΠΏΠΎΠΊΠ°ΠΆΠ΅Ρ‚ Π²Π°ΠΌ, ΠΊΠ°ΠΊ Ρ€Π°Π·Ρ€Π°Π±ΠΎΡ‚Π°Ρ‚ΡŒ интСрфСйс мобильного ΠΈΠ³Ρ€ΠΎΠΊΠ°. Π­Ρ‚ΠΎ Π±ΠΎΠ»Π΅Π΅ слоТный ΡƒΡ‡Π΅Π±Π½ΠΈΠΊ, Ρ‡Π΅ΠΌ Π΄Ρ€ΡƒΠ³ΠΈΠ΅, ΠΏΠΎΡ‚ΠΎΠΌΡƒ Ρ‡Ρ‚ΠΎ, ΠΏΠΎΠΌΠΈΠΌΠΎ ΠΏΠ°Π½Π΅Π»ΠΈ проигрыватСля, Π² Π½Π΅ΠΌ Π΅ΡΡ‚ΡŒ мноТСство элСмСнтов управлСния ΠΈ списков, поэтому Π±ΡƒΠ΄ΡŒΡ‚Π΅ Π³ΠΎΡ‚ΠΎΠ²Ρ‹, это ΠΌΠΎΠΆΠ΅Ρ‚ Π·Π°Π½ΡΡ‚ΡŒ большС Π²Ρ€Π΅ΠΌΠ΅Π½ΠΈ, Ρ‡Π΅ΠΌ Π΄Ρ€ΡƒΠ³ΠΈΠ΅ ΡƒΡ‡Π΅Π±Π½ΠΈΠΊΠΈ.

ΠžΡ‚Π»ΠΈΡ‡Π½Ρ‹ΠΉ интСрфСйс для прилоТСния iPad

Π Π°Π·Ρ€Π°Π±ΠΎΡ‚ΠΊΠ° ΠΏΡ€ΠΈΠ»ΠΎΠΆΠ΅Π½ΠΈΠΉ для iPad Ρ‚Ρ€Π΅Π±ΡƒΠ΅Ρ‚ Π½Π΅ΠΊΠΎΡ‚ΠΎΡ€ΠΎΠ³ΠΎ знакомства с внСшним Π²ΠΈΠ΄ΠΎΠΌ интСрфСйса iPad, поэтому, Ссли Π²Π°ΠΌ ΠΈΡ… Π½Π΅ Ρ…Π²Π°Ρ‚Π°Π΅Ρ‚, Π²Π°ΠΌ ΠΌΠΎΠΆΠ΅Ρ‚ Π±Ρ‹Ρ‚ΡŒ Ρ‚Ρ€ΡƒΠ΄Π½Π΅Π΅ ΡΠ»Π΅Π΄ΠΎΠ²Π°Ρ‚ΡŒ этому руководству. Π’ любом случаС, Π² руководствС ΠΎΡ‡Π΅Π½ΡŒ Ρ…ΠΎΡ€ΠΎΡˆΠΎ ΠΎΠ±ΡŠΡΡΠ½ΡΠ΅Ρ‚ΡΡ, Ρ‡Ρ‚ΠΎ Π΄Π΅Π»Π°Ρ‚ΡŒ, поэтому, Π΄Π°ΠΆΠ΅ Ссли Π²Ρ‹ Π½Π΅ ΡΠ²Π»ΡΠ΅Ρ‚Π΅ΡΡŒ экспСртом ΠΏΠΎ интСрфСйсу iPad, Π²Ρ‹ всС Ρ€Π°Π²Π½ΠΎ смоТСтС это ΡΠ΄Π΅Π»Π°Ρ‚ΡŒ.

Π£Ρ‡Π΅Π±Π½ΠΎΠ΅ пособиС ΠΏΠΎ Π΄ΠΈΠ·Π°ΠΉΠ½Ρƒ Π²Π΅Π±-сайтов для ΠΏΡ€ΠΈΠ»ΠΎΠΆΠ΅Π½ΠΈΠΉ iOS

Π˜Ρ‚Π°ΠΊ, это ΠΎΠ΄Π½ΠΎ большоС руководство (ΠΊΠ°ΠΊ ΠΈ ΠΈΠ·ΠΎΠ±Ρ€Π°ΠΆΠ΅Π½ΠΈΠ΅, ΠΊΠΎΡ‚ΠΎΡ€ΠΎΠ΅ Π΅Π³ΠΎ сопровоТдаСт)! Π’ ΠΎΡ‚Π»ΠΈΡ‡ΠΈΠ΅ ΠΎΡ‚ Π΄Ρ€ΡƒΠ³ΠΈΡ… руководств, это часовой Π²ΠΈΠ΄Π΅ΠΎΡƒΡ€ΠΎΠΊ.Если Π²Ρ‹ ΠΈΡ‰Π΅Ρ‚Π΅ быстроС руководство, это Π½Π΅ ΠΎΠ΄Π½ΠΎ ΠΈΠ· Π½ΠΈΡ… — со всСми ΠΏΠ΅Ρ€Π΅ΠΌΠΎΡ‚ΠΊΠ°ΠΌΠΈ Π½Π°Π·Π°Π΄ ΠΈ Π²ΠΏΠ΅Ρ€Π΅Π΄ Π²Π°ΠΌ ΠΌΠΎΠΆΠ΅Ρ‚ ΠΏΠΎΡ‚Ρ€Π΅Π±ΠΎΠ²Π°Ρ‚ΡŒΡΡ ΠΎΡ‚ 3 Π΄ΠΎ 4 ΠΈΠ»ΠΈ Π΄Π°ΠΆΠ΅ большС часов, Π½ΠΎ ΠΊΠΎΠ½Π΅Ρ‡Π½Ρ‹ΠΉ Ρ€Π΅Π·ΡƒΠ»ΡŒΡ‚Π°Ρ‚ — Ρ‡Π΅Ρ‚ΠΊΠΈΠΉ Π²Π΅Π±-сайт с Π±Ρ€ΠΎΡˆΡŽΡ€ΠΎΠΉ ΠΎ ΠΏΡ€ΠΈΠ»ΠΎΠΆΠ΅Π½ΠΈΠΈ для iOS — это ΠΎΠΏΡ€Π΅Π΄Π΅Π»Π΅Π½Π½ΠΎ Ρ‚ΠΎΠ³ΠΎ стоит.

ΠŸΡ€ΠΎΡΡ‚Ρ‹Π΅ ΠΈ Ρ„ΡƒΠ½ΠΊΡ†ΠΈΠΎΠ½Π°Π»ΡŒΠ½Ρ‹Π΅ Ρ€Π΅ΠΊΠ»Π°ΠΌΠ½Ρ‹Π΅ ΠΌΠΎΠ±ΠΈΠ»ΡŒΠ½Ρ‹Π΅ прилоТСния ЦСлСвая страница

ΠœΠΎΠ±ΠΈΠ»ΡŒΠ½Ρ‹Π΅ прилоТСния Π² ΠΌΠΎΠ΄Π΅ Π² этом сСзонС, поэтому, Ссли Π²Ρ‹ Ρ…ΠΎΡ‚ΠΈΡ‚Π΅ ΡΠΎΠ·Π΄Π°Ρ‚ΡŒ Ρ†Π΅Π»Π΅Π²ΡƒΡŽ страницу для ΠΌΠΎΠ±ΠΈΠ»ΡŒΠ½Ρ‹Ρ… ΠΏΡ€ΠΈΠ»ΠΎΠΆΠ΅Π½ΠΈΠΉ, Π²ΠΎΡ‚ ΠΊΠ°ΠΊ это ΡΠ΄Π΅Π»Π°Ρ‚ΡŒ. Π’ этом руководствС ΠΏΠΎΠ΄Ρ€ΠΎΠ±Π½ΠΎ ΠΎΠ±ΡŠΡΡΠ½ΡΠ΅Ρ‚ΡΡ, ΠΊΠ°ΠΊ ΡΠΎΠ·Π΄Π°Ρ‚ΡŒ Ρ†Π΅Π»Π΅Π²ΡƒΡŽ страницу для прилоТСния для рСсторана, Π½ΠΎ, разумССтся, с Π½Π΅ΠΊΠΎΡ‚ΠΎΡ€Ρ‹ΠΌΠΈ измСнСниями Π²Ρ‹ ΠΌΠΎΠΆΠ΅Ρ‚Π΅ ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚ΡŒ Π΅Π΅ для любого Ρ‚ΠΈΠΏΠ° прилоТСния.

Π‘ΡŒΡŽΡΡŒ ΠΎΠ± Π·Π°ΠΊΠ»Π°Π΄, Π±ΠΎΠ»ΡŒΡˆΠΈΠ½ΡΡ‚Π²Ρƒ Π΄ΠΈΠ·Π°ΠΉΠ½Π΅Ρ€ΠΎΠ², Π²ΠΎΠ·ΠΌΠΎΠΆΠ½ΠΎ, Π½ΠΈΠΊΠΎΠ³Π΄Π° Π½Π΅ придСтся Ρ€Π°Π·Ρ€Π°Π±Π°Ρ‚Ρ‹Π²Π°Ρ‚ΡŒ интСрфСйс ΠΏΠ°Π½Π΅Π»ΠΈ администратора, Π½ΠΎ Ссли Π²Ρ‹ это сдСлаСтС, Π²ΠΎΡ‚ ΠΎΡ‚Π»ΠΈΡ‡Π½Ρ‹ΠΉ ΡƒΡ‡Π΅Π±Π½ΠΈΠΊ, ΠΊΠΎΡ‚ΠΎΡ€Ρ‹ΠΉ шаг Π·Π° шагом Π½Π°ΡƒΡ‡ΠΈΡ‚ вас, ΠΊΠ°ΠΊ это ΡΠ΄Π΅Π»Π°Ρ‚ΡŒ. Как ΠΈ Π² ΠΏΡ€Π΅Π΄Ρ‹Π΄ΡƒΡ‰Π΅ΠΌ руководствС, ΠΎΠ½ Π½Π΅ начинаСтся с нуля, Π° ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠ΅Ρ‚ сторонниС рСсурсы. Π’Ρ‹ ΠΌΠΎΠΆΠ΅Ρ‚Π΅ ΠΎΠ±ΠΎΠΉΡ‚ΠΈ это ΠΈ ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚ΡŒ Ρ‚ΠΎΠ»ΡŒΠΊΠΎ свои собствСнныС, Π½ΠΎ это Π·Π½Π°Ρ‡ΠΈΡ‚Π΅Π»ΡŒΠ½ΠΎ ΡƒΠ²Π΅Π»ΠΈΡ‡ΠΈΡ‚ врСмя, Π½Π΅ΠΎΠ±Ρ…ΠΎΠ΄ΠΈΠΌΠΎΠ΅ для Ρ€Π°Π·Ρ€Π°Π±ΠΎΡ‚ΠΊΠΈ интСрфСйса.

Π Π°Π·Ρ€Π°Π±ΠΎΡ‚ΠΊΠ° ΠΌΠ°ΠΊΠ΅Ρ‚Π° бизнСс-сСти

БизнСс-сайты ΡΠ²Π»ΡΡŽΡ‚ΡΡ ΠΎΠ΄Π½ΠΈΠΌΠΈ ΠΈΠ· Π½Π°ΠΈΠ±ΠΎΠ»Π΅Π΅ распространСнных Ρ‚ΠΈΠΏΠΎΠ² сайтов, ΠΈ Π΄Π°ΠΆΠ΅ нСсмотря Π½Π° Ρ‚ΠΎ, Ρ‡Ρ‚ΠΎ ΡΡƒΡ‰Π΅ΡΡ‚Π²ΡƒΡŽΡ‚ тысячи бСсплатных шаблонов, ΠΊΠΎΡ‚ΠΎΡ€Ρ‹Π΅ Π²Ρ‹ ΠΌΠΎΠΆΠ΅Ρ‚Π΅ ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚ΡŒ Π² качСствС основы, Ссли Π²Ρ‹ Ρ…ΠΎΡ‚ΠΈΡ‚Π΅ Ρ€Π°Π·Ρ€Π°Π±ΠΎΡ‚Π°Ρ‚ΡŒ бизнСс-ΠΌΠ°ΠΊΠ΅Ρ‚ с нуля, Π²Ρ‹ ΠΌΠΎΠΆΠ΅Ρ‚Π΅ ΠΏΡ€ΠΎΠ²Π΅Ρ€ΠΈΡ‚ΡŒ это руководство.

Π’ΠΈΠ½Ρ‚Π°ΠΆΠ½Ρ‹ΠΉ ΠΈ Ρ€Π΅Ρ‚Ρ€ΠΎ-Π΄ΠΈΠ·Π°ΠΉΠ½ всСгда Π² ΠΌΠΎΠ΄Π΅. Π”ΠΈΠ·Π°ΠΉΠ½ Π² ΡƒΡ€ΠΎΠΊΠ΅ ΠΌΠΎΠΆΠ½ΠΎ Π½Π°Π·Π²Π°Ρ‚ΡŒ Ρ€Π΅Ρ‚Ρ€ΠΎ, ​​но Π½Π° самом Π΄Π΅Π»Π΅ ΠΎΠ½ выглядит Π²ΠΏΠΎΠ»Π½Π΅ соврСмСнно. Как ΠΈ Π² Π΄Ρ€ΡƒΠ³ΠΈΡ… руководствах, Π³Π΄Π΅ ΡΠΎΠ·Π΄Π°ΡŽΡ‚ΡΡ ΠΏΠΎΠ»Π½Ρ‹Π΅ сайты, это Π·Π°ΠΉΠΌΠ΅Ρ‚ Ρƒ вас ΠΏΠ°Ρ€Ρƒ часов. Π’ Π΄ΠΎΠΏΠΎΠ»Π½Π΅Π½ΠΈΠ΅ ΠΊ знакомству с Photoshop Π²Π°ΠΌ Ρ‚Π°ΠΊΠΆΠ΅ ΠΏΠΎΡ‚Ρ€Π΅Π±ΡƒΡŽΡ‚ΡΡ Π½Π΅ΠΊΠΎΡ‚ΠΎΡ€Ρ‹Π΅ Π½Π°Π²Ρ‹ΠΊΠΈ Illustrator, ΠΏΠΎΡ‚ΠΎΠΌΡƒ Ρ‡Ρ‚ΠΎ Π½Π΅ΠΊΠΎΡ‚ΠΎΡ€Ρ‹Π΅ Ρ„ΠΎΡ€ΠΌΡ‹, ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠ΅ΠΌΡ‹Π΅ Π² ΡƒΡ‡Π΅Π±Π½ΠΈΠΊΠ΅, Π»Π΅Π³Ρ‡Π΅ ΡΠΎΠ·Π΄Π°Ρ‚ΡŒ с ΠΏΠΎΠΌΠΎΡ‰ΡŒΡŽ Illustrator, Ρ‡Π΅ΠΌ с ΠΏΠΎΠΌΠΎΡ‰ΡŒΡŽ Photoshop.

Π­Ρ‚ΠΎ Π΅Ρ‰Π΅ ΠΎΠ΄ΠΈΠ½ ΡƒΡ‡Π΅Π±Π½ΠΈΠΊ с ΠΈΠ΄Π΅Π°Π»ΡŒΠ½Ρ‹ΠΌ пиксСлСм, Π² ΠΊΠΎΡ‚ΠΎΡ€ΠΎΠΌ ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΡŽΡ‚ΡΡ стили слоСв ΠΈ Π±Π°Π·ΠΎΠ²Ρ‹Π΅ Π²Π΅ΠΊΡ‚ΠΎΡ€Π½Ρ‹Π΅ Ρ„ΠΎΡ€ΠΌΡ‹ для создания чистого интСрфСйса прилоТСния Twitter.ΠŸΠΎΡΠΊΠΎΠ»ΡŒΠΊΡƒ Π²Ρ‹ Π±ΡƒΠ΄Π΅Ρ‚Π΅ Ρ€Π°Π·Ρ€Π°Π±Π°Ρ‚Ρ‹Π²Π°Ρ‚ΡŒ ΠΏΠΎΠ»Π½Ρ‹ΠΉ интСрфСйс прилоТСния, Π½Π΅ ΠΎΠΆΠΈΠ΄Π°ΠΉΡ‚Π΅, Ρ‡Ρ‚ΠΎ руководство Π±ΡƒΠ΄Π΅Ρ‚ ΠΊΠΎΡ€ΠΎΡ‚ΠΊΠΈΠΌ ΠΈ быстрым. Π­Ρ‚ΠΎΡ‚ ΡƒΡ‡Π΅Π±Π½ΠΈΠΊ ΠΎΠ³Ρ€ΠΎΠΌΠ΅Π½ — Π² Π½Π΅ΠΌ Π±ΠΎΠ»Π΅Π΅ 80 шагов, поэтому Π²Π°ΠΌ Π»ΡƒΡ‡ΡˆΠ΅ ΠΏΠΎΡΠ²ΡΡ‚ΠΈΡ‚ΡŒ Π΅ΠΌΡƒ ΠΊΠ°ΠΊ ΠΌΠΈΠ½ΠΈΠΌΡƒΠΌ полдня. Π•ΡΡ‚ΡŒ ΠΌΠ½ΠΎΠ³ΠΎ Π΄Π΅Ρ‚Π°Π»Π΅ΠΉ, Π½Π° ΠΊΠΎΡ‚ΠΎΡ€Ρ‹Π΅ Π½ΡƒΠΆΠ½ΠΎ ΠΎΠ±Ρ€Π°Ρ‚ΠΈΡ‚ΡŒ Π²Π½ΠΈΠΌΠ°Π½ΠΈΠ΅, ΠΈ Ρ…ΠΎΡ€ΠΎΡˆΠ°Ρ Π½ΠΎΠ²ΠΎΡΡ‚ΡŒ Π² Ρ‚ΠΎΠΌ, Ρ‡Ρ‚ΠΎ ΠΎΠ½ΠΈ ΠΎΡ‡Π΅Π½ΡŒ Ρ…ΠΎΡ€ΠΎΡˆΠΎ ΠΎΠ±ΡŠΡΡΠ½Π΅Π½Ρ‹.

Π’ΠΈΠ½Ρ‚Π°ΠΆΠ½Ρ‹ΠΉ ΠΌΠ°ΠΊΠ΅Ρ‚ ΠΏΠΎΡ€Ρ‚Ρ„ΠΎΠ»ΠΈΠΎ с использованиСм Photoshop

Если Π²Ρ‹ Ρ…ΠΎΡ‚ΠΈΡ‚Π΅ ΡΠΎΠ²ΠΌΠ΅ΡΡ‚ΠΈΡ‚ΡŒ Π²ΠΈΠ½Ρ‚Π°ΠΆΠ½Ρ‹ΠΉ ΡΡ‚ΠΈΠ»ΡŒ со своим ΠΏΠΎΡ€Ρ‚Ρ„ΠΎΠ»ΠΈΠΎ, этот ΡƒΡ€ΠΎΠΊ для вас. Π”ΠΈΠ·Π°ΠΉΠ½ особСнно Ρ…ΠΎΡ€ΠΎΡˆ, Ссли вашС ΠΏΠΎΡ€Ρ‚Ρ„ΠΎΠ»ΠΈΠΎ состоит ΠΈΠ· ΠΈΠ·ΠΎΠ±Ρ€Π°ΠΆΠ΅Π½ΠΈΠΉ, Π²ΠΈΠ΄Π΅ΠΎ ΠΈ Π΄Ρ€ΡƒΠ³ΠΈΡ… Π²ΠΈΠ΄ΠΎΠ² Π³Ρ€Π°Ρ„ΠΈΠΊΠΈ, ΠΏΠΎΡ‚ΠΎΠΌΡƒ Ρ‡Ρ‚ΠΎ Π΄ΠΈΠ·Π°ΠΉΠ½ сосрСдоточСн Π²ΠΎΠΊΡ€ΡƒΠ³ Π½ΠΈΡ….Π”ΠΈΠ·Π°ΠΉΠ½ чистый ΠΈ минималистичный, ΠΈ Ссли ваши Π½Π°Π²Ρ‹ΠΊΠΈ Ρ€Π°Π±ΠΎΡ‚Ρ‹ с Photoshop находятся Π½Π° срСднСм ΡƒΡ€ΠΎΠ²Π½Π΅ ΠΈΠ»ΠΈ Π²Ρ‹ΡˆΠ΅, Ρƒ вас Π½Π΅ Π²ΠΎΠ·Π½ΠΈΠΊΠ½Π΅Ρ‚ ΠΏΡ€ΠΎΠ±Π»Π΅ΠΌ с Π΅Π³ΠΎ воссозданиСм.

Π­Ρ‚ΠΎ Π΅Ρ‰Π΅ ΠΎΠ΄ΠΈΠ½ ΡƒΡ‡Π΅Π±Π½ΠΈΠΊ ΠΏΠΎ Ρ†Π΅Π»Π΅Π²ΠΎΠΉ страницС. Он Π½Π΅ Ρ‚Π°ΠΊΠΎΠΉ минималистичный, ΠΊΠ°ΠΊ ΠΏΠ΅Ρ€Π²Ρ‹ΠΉ, Π½ΠΎ всС ΠΆΠ΅ Π½Π΅ назовСшь Π΅Π³ΠΎ Π·Π°Π³Ρ€ΠΎΠΌΠΎΠΆΠ΄Π΅Π½Π½Ρ‹ΠΌ. МнС Π»ΠΈΡ‡Π½ΠΎ Π½Π΅ нравится большой Π·Π°Π³ΠΎΠ»ΠΎΠ²ΠΎΠΊ, Π½ΠΎ, ΠΏΠΎΡΠΊΠΎΠ»ΡŒΠΊΡƒ вкусы Ρ€Π°Π·Π½Ρ‹Π΅, я ΡƒΠ²Π΅Ρ€Π΅Π½, Ρ‡Ρ‚ΠΎ ΠΌΠ½ΠΎΠ³ΠΈΠΌ понравится эта Π΄Π΅Ρ‚Π°Π»ΡŒ, ΠΈΠ»ΠΈ Π²Ρ‹ ΠΌΠΎΠΆΠ΅Ρ‚Π΅ Π·Π°ΠΌΠ΅Π½ΠΈΡ‚ΡŒ Π΅Π΅ мСньшим ΠΈΠ·ΠΎΠ±Ρ€Π°ΠΆΠ΅Π½ΠΈΠ΅ΠΌ — это Π½Π΅ мСняСт сути ΡƒΡ€ΠΎΠΊΠ°.

ΠŸΡ€ΠΎΡΡ‚ΠΎΠΉ ΠΈ ΠΏΡ€ΠΎΡ„Π΅ΡΡΠΈΠΎΠ½Π°Π»ΡŒΠ½Ρ‹ΠΉ ΠΌΠ°ΠΊΠ΅Ρ‚ финансового Π²Π΅Π±-сайта

ЀинансовыС сайты ΡΡ‡ΠΈΡ‚Π°ΡŽΡ‚ΡΡ ΡΠ΅Ρ€ΡŒΠ΅Π·Π½Ρ‹ΠΌΠΈ ΠΈ ΡƒΡ‚ΠΎΠΌΠΈΡ‚Π΅Π»ΡŒΠ½Ρ‹ΠΌΠΈ, Π½ΠΎ это Π½Π΅ ΠΎΠ±ΡΠ·Π°Ρ‚Π΅Π»ΡŒΠ½ΠΎ.Π”ΠΈΠ·Π°ΠΉΠ½ финансового сайта Π² этом ΡƒΡ€ΠΎΠΊΠ΅ простой, ΡΡ‚ΠΈΠ»ΡŒΠ½Ρ‹ΠΉ ΠΈ совсСм Π½Π΅ скучный. Π§Ρ‚ΠΎΠ±Ρ‹ Π·Π°Π²Π΅Ρ€ΡˆΠΈΡ‚ΡŒ Π΅Π³ΠΎ, Π²Π°ΠΌ понадобится Π½Π΅ Ρ‚ΠΎΠ»ΡŒΠΊΠΎ ΠΌΠ½ΠΎΠ³ΠΎ Π²Ρ€Π΅ΠΌΠ΅Π½ΠΈ ΠΈ ΠΏΡ€ΠΎΠΌΠ΅ΠΆΡƒΡ‚ΠΎΡ‡Π½Ρ‹Π΅ Π½Π°Π²Ρ‹ΠΊΠΈ Ρ€Π°Π±ΠΎΡ‚Ρ‹ с Photoshop, Π½ΠΎ ΠΈ мноТСство ΠΈΠ·ΠΎΠ±Ρ€Π°ΠΆΠ΅Π½ΠΈΠΉ, Π·Π½Π°Ρ‡ΠΊΠΎΠ² ΠΈ Π³Ρ€Π°Π΄ΠΈΠ΅Π½Ρ‚ΠΎΠ², Ρ‚Π°ΠΊ Ρ‡Ρ‚ΠΎ, Π²ΠΎΠ·ΠΌΠΎΠΆΠ½ΠΎ, Π»ΡƒΡ‡ΡˆΠ΅ всСго ΠΏΠΎΠ΄Π³ΠΎΡ‚ΠΎΠ²ΠΈΡ‚ΡŒ ΠΈΡ… ΠΏΠ΅Ρ€Π΅Π΄ Ρ‚Π΅ΠΌ, ΠΊΠ°ΠΊ Π½Π°Ρ‡Π°Ρ‚ΡŒ.

АрхивныС ΡƒΡ‡Π΅Π±Π½Ρ‹Π΅ пособия

ВСкстурированный Π²Π΅Π±-ΠΌΠ°ΠΊΠ΅Ρ‚

Π’ этом ΡƒΡ€ΠΎΠΊΠ΅ Π²Π°ΠΌ Π±ΡƒΠ΄Π΅Ρ‚ ΠΏΠΎΠΊΠ°Π·Π°Π½ΠΎ, ΠΊΠ°ΠΊ ΡΠΎΠ·Π΄Π°Ρ‚ΡŒ тСкстурированный Π²Π΅Π±-ΠΌΠ°ΠΊΠ΅Ρ‚, начиная с ΠΊΠΎΠ½Ρ†Π΅ΠΏΡ†ΠΈΠΈ Π½Π° Π±ΡƒΠΌΠ°Π³Π΅ ΠΈ заканчивая Π΄ΠΈΠ·Π°ΠΉΠ½ΠΎΠΌ Photoshop, ΠΈ Π²Ρ‹ Π±ΡƒΠ΄Π΅Ρ‚Π΅ ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚ΡŒ сСтку 960 для ΠΎΡ€Π³Π°Π½ΠΈΠ·Π°Ρ†ΠΈΠΈ ΠΌΠ°ΠΊΠ΅Ρ‚Π°.Π’Π°ΠΊΠΆΠ΅ Π²Ρ‹ ΡƒΠ·Π½Π°Π΅Ρ‚Π΅, ΠΊΠ°ΠΊ ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚ΡŒ стили слоя для создания эффСкта Π³Ρ€Π°Π²ΠΈΡ€ΠΎΠ²Π°Π½Π½ΠΎΠ³ΠΎ тСкста.

Чистый Π²Π΅Π±-ΠΌΠ°ΠΊΠ΅Ρ‚ с сСткой 960

Π’ этом руководствС Π²Ρ‹ создадитС чистый ΠΌΠ°ΠΊΠ΅Ρ‚ Π²Π΅Π±-сайта с использованиСм систСмы 960 Grid System. Π’Ρ‹ ΡƒΠ²ΠΈΠ΄ΠΈΡ‚Π΅, ΠΊΠ°ΠΊ Ρ€Π°Π±ΠΎΡ‚Π° с этой систСмой ΠΌΠΎΠΆΠ΅Ρ‚ ΡƒΠΏΡ€ΠΎΡΡ‚ΠΈΡ‚ΡŒ Ρ€Π°Π±ΠΎΡ‡ΠΈΠΉ процСсс Π²Π΅Π±-Ρ€Π°Π·Ρ€Π°Π±ΠΎΡ‚ΠΊΠΈ ΠΈ ΠΊΠ°ΠΊ Ρ€Π°Π±ΠΎΡ‚Π°Ρ‚ΡŒ с сСткой.

Π­Ρ‚ΠΎ руководство начинаСтся с этапа Photoshop Π² процСссС Ρ€Π°Π·Ρ€Π°Π±ΠΎΡ‚ΠΊΠΈ Π±Π»ΠΎΠ³Π° ΠΈ ΠΏΠΎΠΊΠ°Π·Ρ‹Π²Π°Π΅Ρ‚, ΠΊΠ°ΠΊ Π΄ΠΈΠ·Π°ΠΉΠ½ ΠΈ ΠΌΠ°ΠΊΠ΅Ρ‚ ΡΠΎΠ·Π΄Π°ΡŽΡ‚ΡΡ для формирования исходной ΠΊΠΎΠ½Ρ†Π΅ΠΏΡ†ΠΈΠΈ, Π½Π° основС ΠΊΠΎΡ‚ΠΎΡ€ΠΎΠΉ Π±ΡƒΠ΄Π΅Ρ‚ основан ΠΏΠΎΠ»Π½ΠΎΡΡ‚ΡŒΡŽ Π·Π°ΠΊΠΎΠ΄ΠΈΡ€ΠΎΠ²Π°Π½Π½Ρ‹ΠΉ Π±Π»ΠΎΠ³.

Из этого ΡƒΡ€ΠΎΠΊΠ° Π²Ρ‹ ΡƒΠ·Π½Π°Π΅Ρ‚Π΅, ΠΊΠ°ΠΊ ΡΠΎΠ·Π΄Π°Ρ‚ΡŒ красивый ΠΈ чистый Π²Π΅Π±-сайт для ΠΏΠΎΡ‚ΠΎΠΊΠΎΠ²ΠΎΠΉ ΠΏΠ΅Ρ€Π΅Π΄Π°Ρ‡ΠΈ ΠΌΡƒΠ·Ρ‹ΠΊΠΈ Π² Photoshop.

Π£Π·Π½Π°ΠΉΡ‚Π΅, ΠΊΠ°ΠΊ Ρ€Π°Π·Ρ€Π°Π±ΠΎΡ‚Π°Ρ‚ΡŒ соврСмСнный ΠΌΠ°ΠΊΠ΅Ρ‚ ΠΏΠΎΡ€Ρ‚Ρ„ΠΎΠ»ΠΈΠΎ, ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΡ Ρ‚Π°ΠΊΠΈΠ΅ ΠΌΠ΅Ρ‚ΠΎΠ΄Ρ‹, ΠΊΠ°ΠΊ ΡƒΠ½ΠΈΠΊΠ°Π»ΡŒΠ½Ρ‹ΠΉ тСкстовый эффСкт свСтового эффСкта, ΠΊΡ€ΡƒΡ‚ΠΎΠΉ Ρ„ΠΎΠ½ΠΎΠ²Ρ‹ΠΉ ΡƒΠ·ΠΎΡ€ ΠΈ созданиС ΠΏΡ€ΠΈΠ²Π»Π΅ΠΊΠ°Ρ‚Π΅Π»ΡŒΠ½Ρ‹Ρ… ΠΊΠ½ΠΎΠΏΠΎΠΊ с ΠΏΡ€ΠΈΠ·Ρ‹Π²ΠΎΠΌ ΠΊ Π΄Π΅ΠΉΡΡ‚Π²ΠΈΡŽ.

Π£Π·Π½Π°ΠΉΡ‚Π΅, ΠΊΠ°ΠΊ ΡΠΎΠ·Π΄Π°Ρ‚ΡŒ ΡΡƒΠΏΠ΅Ρ€ΠΏΡ€ΠΎΡ„Π΅ΡΡΠΈΠΎΠ½Π°Π»ΡŒΠ½Ρ‹ΠΉ Π²Π΅Π±-Π΄ΠΈΠ·Π°ΠΉΠ½ ΠΏΠΎΡ€Ρ‚Ρ„ΠΎΠ»ΠΈΠΎ с ΠΏΠΎΠΌΠΎΡ‰ΡŒΡŽ ряда ΠΌΠ΅Ρ‚ΠΎΠ΄ΠΎΠ², Π²ΠΊΠ»ΡŽΡ‡Π°Ρ свСтовыС эффСкты, Π²Π°Ρ€ΠΈΠ°Π½Ρ‚Ρ‹ смСшивания ΠΈ ΠΎΠ±Ρ‰ΡƒΡŽ Ρ‚Π΅ΠΎΡ€ΠΈΡŽ Π΄ΠΈΠ·Π°ΠΉΠ½Π°.

Чистый ΠΈ красочный Π²Π΅Π±-ΠΌΠ°ΠΊΠ΅Ρ‚

Π’ этом ΡƒΡ€ΠΎΠΊΠ΅ Π²Π°ΠΌ ΠΏΠΎΠΊΠ°ΠΆΡƒΡ‚, ΠΊΠ°ΠΊ ΡΠΎΠ·Π΄Π°Ρ‚ΡŒ чистый ΠΊΠΎΡ€ΠΏΠΎΡ€Π°Ρ‚ΠΈΠ²Π½Ρ‹ΠΉ ΠΌΠ°ΠΊΠ΅Ρ‚ Π² Photoshop.

Из этого ΡƒΡ€ΠΎΠΊΠ° Π²Ρ‹ ΡƒΠ·Π½Π°Π΅Ρ‚Π΅, ΠΊΠ°ΠΊ ΡΠΎΠ·Π΄Π°Ρ‚ΡŒ чистый ΠΈ минималистичный ΠΌΠ°ΠΊΠ΅Ρ‚ ΠΏΠΎΡ€Ρ‚Ρ„ΠΎΠ»ΠΈΠΎ Π² Photoshop.

Π’ этом ΠΏΠΎΠ΄Ρ€ΠΎΠ±Π½ΠΎΠΌ руководствС Π²Ρ‹ ΡƒΠ·Π½Π°Π΅Ρ‚Π΅, ΠΊΠ°ΠΊ ΡΠΎΠ·Π΄Π°Ρ‚ΡŒ ΠΌΠ°ΠΊΠ΅Ρ‚ Web 2.0 с ΠΏΠΎΠΌΠΎΡ‰ΡŒΡŽ 960.gs.

Π’Ρ‹ ΡƒΠ·Π½Π°Π΅Ρ‚Π΅, ΠΊΠ°ΠΊ ΡΠΎΠ·Π΄Π°Ρ‚ΡŒ ΡΡƒΠΏΠ΅Ρ€ΠΏΡ€ΠΎΡ„Π΅ΡΡΠΈΠΎΠ½Π°Π»ΡŒΠ½Ρ‹ΠΉ ΠΈ ΠΎΡ‡Π΅Π½ΡŒ чистый Π²Π΅Π±-сайт для Π²Ρ‹ΠΌΡ‹ΡˆΠ»Π΅Π½Π½ΠΎΠΉ Π°Ρ€Ρ…ΠΈΡ‚Π΅ΠΊΡ‚ΡƒΡ€Π½ΠΎΠΉ студии, ΠΏΡ‹Ρ‚Π°ΡΡΡŒ воспроизвСсти основныС Ρ†Π΅Π»ΠΈ Π²Π΅Π±-сайтов студии: ΡΠ»Π΅Π³Π°Π½Ρ‚Π½ΠΎΡΡ‚ΡŒ, простоту, Ρ€ΠΈΡ‚ΠΌΠΈΡ‡Π½ΠΎΡΡ‚ΡŒ ΠΈ профСссионализм.

Чистый ΠΌΠ°ΠΊΠ΅Ρ‚ портфСля

Π’ этом ΡƒΡ€ΠΎΠΊΠ΅ Photoshop Π²Π°ΠΌ ΠΏΠΎΠΊΠ°ΠΆΡƒΡ‚, ΠΊΠ°ΠΊ ΡΠΎΠ·Π΄Π°Ρ‚ΡŒ ΠΌΠ°ΠΊΠ΅Ρ‚ для создания Π²Π΅Π±-сайта для Π²Π΅Π±-Π΄ΠΈΠ·Π°ΠΉΠ½Π΅Ρ€Π° ΠΈΠ»ΠΈ нСбольшого Π²Π΅Π±-агСнтства.

Из этого Ρ‚ΡƒΡ‚ΠΎΡ€ΠΈΠ°Π»Π° Π’Ρ‹ ΡƒΠ·Π½Π°Π΅Ρ‚Π΅, ΠΊΠ°ΠΊ ΡΠ΄Π΅Π»Π°Ρ‚ΡŒ простой ΠΈ понятный ΠΌΠ°ΠΊΠ΅Ρ‚ для своСго iPhone-прилоТСния.

Π­Ρ‚ΠΎ руководство ΠΏΡ€ΠΎΠ²Π΅Π΄Π΅Ρ‚ вас Ρ‡Π΅Ρ€Π΅Π· этапы создания ΠΏΠΎΠ»Π½ΠΎΠ³ΠΎ ΠΈ красивого ΠΌΠ°ΠΊΠ΅Ρ‚Π° для Π²Π΅Π±-сайта прилоТСния для iPhone. ΠŸΠΎΠΏΡƒΡ‚Π½ΠΎ Π²Ρ‹ ΡƒΠ·Π½Π°Π΅Ρ‚Π΅, ΠΊΠ°ΠΊ ΡΠΎΠ·Π΄Π°Π²Π°Ρ‚ΡŒ красивыС эффСкты, Π²Π΄ΠΎΡ…Π½ΠΎΠ²Π»Π΅Π½Π½Ρ‹Π΅ iPhone, Π½Π΅ΠΌΠ½ΠΎΠ³ΠΎ ΠΏΠΎΠΈΠ³Ρ€Π°Π΅Ρ‚Π΅ с Π½Π΅ΠΊΠΎΡ‚ΠΎΡ€Ρ‹ΠΌΠΈ ΠΏΠ°Ρ€Π°ΠΌΠ΅Ρ‚Ρ€Π°ΠΌΠΈ налоТСния ΠΈ ΠΈΠ½Ρ‚Π΅Π³Ρ€ΠΈΡ€ΡƒΠ΅Ρ‚Π΅ Π½Π΅ΠΊΠΎΡ‚ΠΎΡ€ΡƒΡŽ ΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚Π΅Π»ΡŒΡΠΊΡƒΡŽ Π³Ρ€Π°Ρ„ΠΈΠΊΡƒ, которая украсит ΠΌΠ°ΠΊΠ΅Ρ‚.

Π’Π°ΠΌ ΠΏΠΎΠΊΠ°ΠΆΡƒΡ‚, ΠΊΠ°ΠΊ Π»Π΅Π³ΠΊΠΎ ΡΠΎΠ·Π΄Π°Ρ‚ΡŒ чистый бизнСс-ΠΌΠ°ΠΊΠ΅Ρ‚, ΠΊΠΎΡ‚ΠΎΡ€Ρ‹ΠΉ ΠΌΠΎΠΆΠ½ΠΎ ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚ΡŒ для любой CMS, которая Π²Π°ΠΌ нравится.

Π“ΠΎΡ‚ΠΎΠ²ΠΎ!

Π’Π΅Π½Π΄Π΅Π½Ρ†ΠΈΠΈ Π²Π΅Π±-Π΄ΠΈΠ·Π°ΠΉΠ½Π° ΠΌΠ΅Π½ΡΡŽΡ‚ΡΡ, ΠΈ ΠΎΠ½ΠΈ ΠΌΠ΅Π½ΡΡŽΡ‚ΡΡ рСгулярно. Π’Π°ΠΊΠΈΠΌ ΠΎΠ±Ρ€Π°Π·ΠΎΠΌ, ΠΎΡ‡Π΅Π½ΡŒ Π²Π°ΠΆΠ½ΠΎ, Ρ‡Ρ‚ΠΎΠ±Ρ‹ Π΄ΠΈΠ·Π°ΠΉΠ½Π΅Ρ€ оставался Π½Π° Π²Π΅Ρ€ΡˆΠΈΠ½Π΅ ΠΈΠ³Ρ€Ρ‹, Π° Π΅Π³ΠΎ Π΄ΠΈΠ·Π°ΠΉΠ½ ΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚Π΅Π»ΡŒΡΠΊΠΎΠ³ΠΎ интСрфСйса ΠΎΡ‚Ρ€Π°ΠΆΠ°Π» трСбования соврСмСнного Π΄ΠΈΠ·Π°ΠΉΠ½Π°. Π’ΠΎ, Ρ‡Ρ‚ΠΎ Π±Ρ‹Π»ΠΎ Π°ΠΊΡ‚ΡƒΠ°Π»ΡŒΠ½ΠΎ для Π΄ΠΈΠ·Π°ΠΉΠ½Π° ΠΏΠ°Ρ€Ρƒ Π»Π΅Ρ‚, скорСС всСго, Π½Π΅ Π±ΡƒΠ΄Π΅Ρ‚ Π°ΠΊΡ‚ΡƒΠ°Π»ΡŒΠ½ΠΎ сСйчас. Π’Π΅Π±-Π΄ΠΈΠ·Π°ΠΉΠ½Π΅Ρ€Ρ‹ обязаны Π·Π½Π°Ρ‚ΡŒ Ρ‚Π΅ΠΊΡƒΡ‰ΠΈΠ΅ Ρ‚Π΅Π½Π΄Π΅Π½Ρ†ΠΈΠΈ Π΄ΠΈΠ·Π°ΠΉΠ½Π° ΠΈ ΠΎΠ±Π»Π°Π΄Π°Ρ‚ΡŒ Π½Π΅ΠΎΠ±Ρ…ΠΎΠ΄ΠΈΠΌΡ‹ΠΌΠΈ Π½Π°Π²Ρ‹ΠΊΠ°ΠΌΠΈ ΠΈ инструмСнтами для ΠΈΡ… Ρ€Π΅Π°Π»ΠΈΠ·Π°Ρ†ΠΈΠΈ Π² Ρ€Π°ΠΌΠΊΠ°Ρ… ΠΏΡ€ΠΎΠ΅ΠΊΡ‚Π°.Π­Ρ‚ΠΎ ΠΏΠΎΠΌΠΎΠΆΠ΅Ρ‚ Π²Π°ΠΌ ΠΎΡΡ‚Π°Π²Π°Ρ‚ΡŒΡΡ Π½Π° Π²Π΅Ρ€ΡˆΠΈΠ½Π΅ ΠΈΠ³Ρ€Ρ‹.

Π‘ΠΎΠ·Π΄Π°Π½ΠΈΠ΅ Π²Π΅Π±-ΠΌΠ°ΠΊΠ΅Ρ‚Π° Π² стилС Π³Ρ€Π°Π½ΠΆ Π² Photoshop

22 Π°ΠΏΡ€. Π‘ΠΎΠ·Π΄Π°Π½ΠΈΠ΅ Π²Π΅Π±-ΠΌΠ°ΠΊΠ΅Ρ‚Π° Π² стилС Π³Ρ€Π°Π½ΠΆ Π² Photoshop

БСгодня я Ρ…ΠΎΡ‚Π΅Π» Π±Ρ‹ Ρ€Π°ΡΡΠΊΠ°Π·Π°Ρ‚ΡŒ, ΠΊΠ°ΠΊ ΡΠΎΠ·Π΄Π°Ρ‚ΡŒ Π²Π΅Π±-ΠΌΠ°ΠΊΠ΅Ρ‚ Π² стилС Π³Ρ€Π°Π½ΠΆ Π² Photoshop. Π’ этом ΡƒΡ€ΠΎΠΊΠ΅ ΠΌΡ‹ ΠΏΠΎΠΊΠ°ΠΆΠ΅ΠΌ Π²Π°ΠΌ, ΠΊΠ°ΠΊ ΡΠΏΡ€ΠΎΠ΅ΠΊΡ‚ΠΈΡ€ΠΎΠ²Π°Ρ‚ΡŒ Π²Π΅Ρ€Ρ…Π½ΠΈΠΉ ΠΊΠΎΠ»ΠΎΠ½Ρ‚ΠΈΡ‚ΡƒΠ», Π±ΠΎΠΊΠΎΠ²ΡƒΡŽ панСль, Ρ‚Π΅Π»ΠΎ, Π½ΠΈΠΆΠ½ΠΈΠΉ ΠΊΠΎΠ»ΠΎΠ½Ρ‚ΠΈΡ‚ΡƒΠ» ΠΈ ΡΡ‚ΠΈΠ»ΠΈΠ·ΠΎΠ²Π°Ρ‚ΡŒ всС, Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΠΎΠ½ΠΈ Ρ€Π°Π±ΠΎΡ‚Π°Π»ΠΈ вмСстС Π² сильно тСкстурированном, изношСнном Π΄ΠΈΠ·Π°ΠΉΠ½Π΅, мноТСствС ΠΈΠ·ΠΎΠ±Ρ€Π°ΠΆΠ΅Π½ΠΈΠΉ ΠΈ эффСктов кисти. Π’Π°ΠΊ ΠΏΠΎΡ‡Π΅ΠΌΡƒ Π±Ρ‹ Π½Π΅ ΠΏΠΎΠΏΡ€ΠΎΠ±ΠΎΠ²Π°Ρ‚ΡŒβ€¦

Π¨Π°Π³ 1:

На этот Ρ€Π°Π· ΠΌΡ‹ собираСмся ΡΠΎΠ·Π΄Π°Ρ‚ΡŒ ΠΏΠΎΠ»Π½ΠΎΡ†Π΅Π½Π½Ρ‹ΠΉ Π²Π΅Π±-Π΄ΠΈΠ·Π°ΠΉΠ½ Π² стилС Π³Ρ€Π°Π½ΠΆ с ΠΏΠΎΠΌΠΎΡ‰ΡŒΡŽ Photoshop ΠΈ мноТСства стоковых ΠΈΠ·ΠΎΠ±Ρ€Π°ΠΆΠ΅Π½ΠΈΠΉ.ΠŸΠΎΡΠΊΠΎΠ»ΡŒΠΊΡƒ это руководство срСднСго ΠΈ ΠΏΡ€ΠΎΠ΄Π²ΠΈΠ½ΡƒΡ‚ΠΎΠ³ΠΎ ΡƒΡ€ΠΎΠ²Π½Π΅ΠΉ, я ΠΏΡ€ΠΎΠΏΡƒΡ‰Ρƒ объяснСниС Π½Π΅ΠΊΠΎΡ‚ΠΎΡ€Ρ‹Ρ… основных шагов. Π‘Π½Π°Ρ‡Π°Π»Π° создайтС Π½ΠΎΠ²Ρ‹ΠΉ Π΄ΠΎΠΊΡƒΠΌΠ΅Π½Ρ‚ Ρ€Π°Π·ΠΌΠ΅Ρ€ΠΎΠΌ 950 Π½Π° 800 пиксСлСй с Ρ€Π°Π·Ρ€Π΅ΡˆΠ΅Π½ΠΈΠ΅ΠΌ RGB 72dpi. ΠŸΠΎΠΊΠ°ΠΆΠΈΡ‚Π΅ Π»ΠΈΠ½Π΅ΠΉΠΊΠΈ ΠΈ ΠΏΠ΅Ρ€Π΅Ρ‚Π°Ρ‰ΠΈΡ‚Π΅ Ρ‡Π΅Ρ‚Ρ‹Ρ€Π΅ Π½Π°ΠΏΡ€Π°Π²Π»ΡΡŽΡ‰ΠΈΡ…, ΠΎΠ³Ρ€Π°Π½ΠΈΡ‡ΠΈΠ²Π°ΡŽΡ‰ΠΈΡ… Π΄ΠΎΠΊΡƒΠΌΠ΅Π½Ρ‚, это Π±ΡƒΠ΄Π΅Ρ‚ ΠΎΠΏΡ‚ΠΈΠΌΠ°Π»ΡŒΠ½Π°Ρ ΠΎΠ±Π»Π°ΡΡ‚ΡŒ Π΄ΠΈΠ·Π°ΠΉΠ½Π°. Π― ΠΏΠ»Π°Π½ΠΈΡ€ΡƒΡŽ ΡΠΎΡ…Ρ€Π°Π½ΠΈΡ‚ΡŒ ΠΌΠ°ΠΊΠ΅Ρ‚ фиксированной ΡˆΠΈΡ€ΠΈΠ½Ρ‹.

ΠŸΠ΅Ρ€Π΅ΠΉΠ΄ΠΈΡ‚Π΅ Π² Π˜Π·ΠΎΠ±Ρ€Π°ΠΆΠ΅Π½ΠΈΠ΅> Π Π°Π·ΠΌΠ΅Ρ€ холста ΠΈ ΡƒΠ²Π΅Π»ΠΈΡ‡ΡŒΡ‚Π΅ ΡˆΠΈΡ€ΠΈΠ½Ρƒ ΠΈ высоту Π½Π°ΠΌΠ½ΠΎΠ³ΠΎ большС, 1200 пиксСлСй Π½Π° 1000 пиксСлСй Π² порядкС, Ρ‚Π°ΠΊΠΈΠΌ ΠΎΠ±Ρ€Π°Π·ΠΎΠΌ ΠΌΡ‹ Π±ΡƒΠ΄Π΅ΠΌ ΠΏΡ€ΠΎΠ΅ΠΊΡ‚ΠΈΡ€ΠΎΠ²Π°Ρ‚ΡŒ для Π±ΠΎΠ»Π΅Π΅ ΡˆΠΈΡ€ΠΎΠΊΠΈΡ… Ρ€Π°Π·Ρ€Π΅ΡˆΠ΅Π½ΠΈΠΉ экрана. Π—Π°Ρ‚Π΅ΠΌ Π΄ΠΎΠ±Π°Π²ΡŒΡ‚Π΅ Π΄ΠΎΠΏΠΎΠ»Π½ΠΈΡ‚Π΅Π»ΡŒΠ½Ρ‹Π΅ Π½Π°ΠΏΡ€Π°Π²Π»ΡΡŽΡ‰ΠΈΠ΅, ΠΊΡƒΠ΄Π° Π²Ρ‹ ΠΏΠ»Π°Π½ΠΈΡ€ΡƒΠ΅Ρ‚Π΅ Π΄ΠΎΠ±Π°Π²ΠΈΡ‚ΡŒ ΠΊΠΎΠ½Ρ‚Π΅ΠΉΠ½Π΅Ρ€Ρ‹ (Π²Π΅Ρ€Ρ…Π½ΠΈΠΉ ΠΊΠΎΠ»ΠΎΠ½Ρ‚ΠΈΡ‚ΡƒΠ», панСль Π½Π°Π²ΠΈΠ³Π°Ρ†ΠΈΠΈ, боковая панСль, Π½ΠΈΠΆΠ½ΠΈΠΉ ΠΊΠΎΠ»ΠΎΠ½Ρ‚ΠΈΡ‚ΡƒΠ»).

Π”Π°Π²Π°ΠΉΡ‚Π΅ прСдставим, Ρ‡Ρ‚ΠΎ этот Π΄ΠΈΠ·Π°ΠΉΠ½ ΠΏΡ€Π΅Π΄Π½Π°Π·Π½Π°Ρ‡Π΅Π½ для шаблона WordPress, поэтому Π½Π°ΠΌ понадобятся Π·Π°Π³ΠΎΠ»ΠΎΠ²ΠΎΠΊ, панСль Π½Π°Π²ΠΈΠ³Π°Ρ†ΠΈΠΈ Π²Π½ΡƒΡ‚Ρ€ΠΈ Π·Π°Π³ΠΎΠ»ΠΎΠ²ΠΊΠ° ΠΈ правая боковая панСль. ВзглянитС Π½Π° ниТнюю Ρ‡Π°ΡΡ‚ΡŒ ΡΠ»Π΅Π΄ΡƒΡŽΡ‰Π΅Π³ΠΎ изобраТСния. Π—Π°Ρ‚Π΅ΠΌ Π·Π°Π»Π΅ΠΉΡ‚Π΅ Ρ„ΠΎΠ½ этим Ρ†Π²Π΅Ρ‚ΠΎΠΌ # 7A8173.

Π¨Π°Π³ 2:

Π’Π΅ΠΏΠ΅Ρ€ΡŒ ΠΌΡ‹ собираСмся ΡΠΎΠ·Π΄Π°Ρ‚ΡŒ ΡƒΠ·ΠΎΡ€ для Ρ„ΠΎΠ½Π° Π·Π°Π³ΠΎΠ»ΠΎΠ²ΠΊΠ°, ΠΊΠΎΡ‚ΠΎΡ€Ρ‹ΠΉ довольно прост. Π‘ΠΎΠ·Π΄Π°ΠΉΡ‚Π΅ Π½ΠΎΠ²Ρ‹ΠΉ Π΄ΠΎΠΊΡƒΠΌΠ΅Π½Ρ‚ Ρ€Π°Π·ΠΌΠ΅Ρ€ΠΎΠΌ 50 Π½Π° 300 пиксСлСй ΠΈ нарисуйтС Ρ‡Ρ‚ΠΎ-Ρ‚ΠΎ Π²Ρ€ΠΎΠ΄Π΅ изобраТСния Π½ΠΈΠΆΠ΅. Π― ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΡŽ Π½Π°ΠΏΡ€Π°Π²Π»ΡΡŽΡ‰ΠΈΠ΅, Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΡΠ΄Π΅Π»Π°Ρ‚ΡŒ мою Ρ„ΠΈΠ³ΡƒΡ€Ρƒ максимально симмСтричной.Π—Π°Ρ‚Π΅ΠΌ ΠΏΠ΅Ρ€Π΅ΠΉΠ΄ΠΈΡ‚Π΅ Π² мСню Β«ΠŸΡ€Π°Π²ΠΊΠ°Β»> Β«ΠžΠΏΡ€Π΅Π΄Π΅Π»ΠΈΡ‚ΡŒ ΡƒΠ·ΠΎΡ€Β» ΠΈ сохранитС Ρ„ΠΈΠ³ΡƒΡ€Ρƒ ΠΊΠ°ΠΊ Β«ΡƒΠ·ΠΎΡ€ 1Β».

Π¨Π°Π³ 3:

На Π½ΠΎΠ²ΠΎΠΌ слоС Π² нашСм основном Ρ„Π°ΠΉΠ»Π΅ Π΄ΠΈΠ·Π°ΠΉΠ½Π° нарисуйтС ΠΏΡ€ΡΠΌΠΎΡƒΠ³ΠΎΠ»ΡŒΠ½ΠΈΠΊ высотой 300 пиксСлСй с ΠΏΠΎΠΌΠΎΡ‰ΡŒΡŽ инструмСнта Β«ΠŸΡ€ΡΠΌΠΎΡƒΠ³ΠΎΠ»ΡŒΠ½ΠΈΠΊΒ». ΠŸΠ΅Ρ€Π΅ΠΉΠ΄ΠΈΡ‚Π΅ Π² Π€ΠΈΠ»ΡŒΡ‚Ρ€Ρ‹ ΠΈ Π΄ΠΎΠ±Π°Π²ΡŒΡ‚Π΅ Π½Π°Π»ΠΎΠΆΠ΅Π½ΠΈΠ΅ ΡƒΠ·ΠΎΡ€Π°, Π½Π°ΠΉΠ΄ΠΈΡ‚Π΅ свой Π½ΠΎΠ²Ρ‹ΠΉ ΡƒΠ·ΠΎΡ€ ΠΈ ΠΏΡ€ΠΈΠΌΠ΅Π½ΠΈΡ‚Π΅ Π΅Π³ΠΎ. Π§Ρ‚ΠΎΠ±Ρ‹ ΠΎΠ½ выглядСл ΠΏΡ€Π°Π²ΠΈΠ»ΡŒΠ½ΠΎ, Π²Ρ‹ Π΄ΠΎΠ»ΠΆΠ½Ρ‹ Π½Π°ΠΆΠ°Ρ‚ΡŒ ΠΊΠ½ΠΎΠΏΠΊΡƒ Β«ΠŸΡ€ΠΈΠ²ΡΠ·Π°Ρ‚ΡŒ ΠΊ исходной Ρ‚ΠΎΡ‡ΠΊΠ΅Β». Π˜Π·ΠΌΠ΅Π½ΠΈΡ‚Π΅ Π·Π°Π»ΠΈΠ²ΠΊΡƒ слоя Π½Π° 0%, создайтС Π½ΠΎΠ²Ρ‹ΠΉ пустой слой Π½Π°Π΄ слоСм-Ρ„ΠΈΠ³ΡƒΡ€ΠΎΠΉ ΠΈ ΠΎΠ±ΡŠΠ΅Π΄ΠΈΠ½ΠΈΡ‚Π΅ ΠΎΠ±Π°, Ρ‚Π°ΠΊΠΈΠΌ ΠΎΠ±Ρ€Π°Π·ΠΎΠΌ, Ρƒ вас Π±ΡƒΠ΄Π΅Ρ‚ Π³ΠΎΡ‚ΠΎΠ²Ρ‹ΠΉ ΡƒΠ·ΠΎΡ€ для добавлСния ΠΊ Π½Π΅ΠΌΡƒ Π½Π΅ΠΊΠΎΡ‚ΠΎΡ€Ρ‹Ρ… эффСктов.НазовитС этот слой Β«Π£Π·ΠΎΡ€ 1Β».

Π¨Π°Π³ 4:

Π’Ρ‹Π±Π΅Ρ€ΠΈΡ‚Π΅ слой Β«Pattern 1Β» ΠΈ ΠΏΡ€ΠΈΠΌΠ΅Π½ΠΈΡ‚Π΅ ΠΊ Π½Π΅ΠΌΡƒ нСсколько стилСй слоя: Drop Shadow, Gradient Overlay ΠΈ Pattern Overlay. ΠŸΠΎΠΏΡ€ΠΎΠ±ΡƒΠΉΡ‚Π΅ ΠΏΠΎΠ»ΡƒΡ‡ΠΈΡ‚ΡŒ Ρ‡Ρ‚ΠΎ-Ρ‚ΠΎ ΠΏΠΎΡ…ΠΎΠΆΠ΅Π΅ Π½Π° ниТнюю Ρ‡Π°ΡΡ‚ΡŒ изобраТСния Π½ΠΈΠΆΠ΅, ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΡ ΡΠ»Π΅Π΄ΡƒΡŽΡ‰ΠΈΠ΅ значСния.

Π¨Π°Π³ 5:

Π’Π΅ΠΏΠ΅Ρ€ΡŒ ΠΌΡ‹ собираСмся Π΄ΠΎΠ±Π°Π²ΠΈΡ‚ΡŒ Ρ„ΠΎΠ½ ΠΏΠ°Π½Π΅Π»ΠΈ Π½Π°Π²ΠΈΠ³Π°Ρ†ΠΈΠΈ. НарисуйтС ΠΏΡ€ΡΠΌΠΎΡƒΠ³ΠΎΠ»ΡŒΠ½ΠΈΠΊ, Π½Π΅ΠΌΠ½ΠΎΠ³ΠΎ ΡΠΊΡ€Ρ‹Π²Π°ΡŽΡ‰ΠΈΠΉ слой Β«Π£Π·ΠΎΡ€ 1Β». ΠŸΡ€ΠΈΠΌΠ΅Π½ΠΈΡ‚Π΅ ΠΊ этому ΠΏΡ€ΡΠΌΠΎΡƒΠ³ΠΎΠ»ΡŒΠ½ΠΈΠΊΡƒ Π½Π°Π»ΠΎΠΆΠ΅Π½ΠΈΠ΅ Π£Π·ΠΎΡ€, Π½Π°Π»ΠΎΠΆΠ΅Π½ΠΈΠ΅ Π³Ρ€Π°Π΄ΠΈΠ΅Π½Ρ‚Π° ΠΎΡ‚ Ρ‡Π΅Ρ€Π½ΠΎΠ³ΠΎ ΠΊ красно-Ρ‡Π΅Ρ€Π½ΠΎΠΌΡƒ ΠΈ ΠΌΡΠ³ΠΊΡƒΡŽ Ρ‚Π΅Π½ΡŒ.Π˜ΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠΉΡ‚Π΅ значСния ΠΈΠ·ΠΎΠ±Ρ€Π°ΠΆΠ΅Π½ΠΈΠΉ Π½ΠΈΠΆΠ΅ Π² качСствС справки. Π—Π°Ρ‚Π΅ΠΌ Π΄ΠΎΠ±Π°Π²ΡŒΡ‚Π΅ маску слоя> Π‘ΠΊΡ€Ρ‹Ρ‚ΡŒ всС ΠΈ нарисуйтС ΠΎΡ‚Ρ€Π°ΠΆΠ΅Π½Π½Ρ‹ΠΉ Π³Ρ€Π°Π΄ΠΈΠ΅Π½Ρ‚ ΠΎΡ‚ Ρ‡Π΅Ρ€Π½ΠΎΠ³ΠΎ ΠΊ Π±Π΅Π»ΠΎΠΌΡƒ ΠΊ Ρ‡Π΅Ρ€Π½ΠΎΠΌΡƒ Π½Π° маскС слоя, Π²Ρ‹ ΠΏΠΎΠ»ΡƒΡ‡ΠΈΡ‚Π΅ Ρ‡Ρ‚ΠΎ-Ρ‚ΠΎ ΠΏΠΎΡ…ΠΎΠΆΠ΅Π΅ Π½Π° Π½ΠΈΠΆΠ½Π΅Π΅ ΠΈΠ·ΠΎΠ±Ρ€Π°ΠΆΠ΅Π½ΠΈΠ΅ Π½ΠΈΠΆΠ΅.

Π¨Π°Π³ 6:

Π’Π΅ΠΏΠ΅Ρ€ΡŒ нарисуйтС эллипс (# 691E1B) Π½Π°Π΄ слоСм Β«Π£Π·ΠΎΡ€ 1Β», Π½Π°Π·ΠΎΠ²ΠΈΡ‚Π΅ Π΅Π³ΠΎ Β«Π‘Π²Π΅Ρ‚Β» ΠΈ ΠΏΡ€ΠΈΠΌΠ΅Π½ΠΈΡ‚Π΅ ΠΊ Π½Π΅ΠΌΡƒ Ρ€Π°Π·ΠΌΡ‹Ρ‚ΠΈΠ΅ ΠΏΠΎ Гауссу с радиусом 50 пиксСлСй. Π― создал Π΄ΠΎΠΏΠΎΠ»Π½ΠΈΡ‚Π΅Π»ΡŒΠ½ΡƒΡŽ Π½Π°ΠΏΡ€Π°Π²Π»ΡΡŽΡ‰ΡƒΡŽ, Ρ‡Ρ‚ΠΎΠ±Ρ‹ Π½Π°Ρ€ΠΈΡΠΎΠ²Π°Ρ‚ΡŒ свСт Π² Ρ†Π΅Π½Ρ‚Ρ€Π΅ Π·Π°Π³ΠΎΠ»ΠΎΠ²ΠΊΠ°. Π£Π΄Π°Π»ΠΈΡ‚Π΅ всС, Ρ‡Ρ‚ΠΎ находится ΠΏΠΎΠ΄ панСлью Π½Π°Π²ΠΈΠ³Π°Ρ†ΠΈΠΈ, ΠΈ ΠΈΠ·ΠΌΠ΅Π½ΠΈΡ‚Π΅ Ρ€Π΅ΠΆΠΈΠΌ налоТСния слоя Π½Π° Color Dodge.

Π¨Π°Π³ 7:

Π§Ρ‚ΠΎΠ±Ρ‹ Π·Π°ΠΊΠΎΠ½Ρ‡ΠΈΡ‚ΡŒ ΠΏΠ΅Ρ€Π²ΡƒΡŽ Ρ‡Π°ΡΡ‚ΡŒ ΠΌΠ°ΠΊΠ΅Ρ‚Π°, ΠΌΡ‹ собираСмся Π½Π°Ρ€ΠΈΡΠΎΠ²Π°Ρ‚ΡŒ Ρ„ΠΎΠ½ Π±ΠΎΠΊΠΎΠ²ΠΎΠΉ ΠΏΠ°Π½Π΅Π»ΠΈ. НарисуйтС нСсколько Π½Π°ΠΏΡ€Π°Π²Π»ΡΡŽΡ‰ΠΈΡ…, Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΠΎΠ³Ρ€Π°Π½ΠΈΡ‡ΠΈΡ‚ΡŒ Π±ΠΎΠΊΠΎΠ²ΡƒΡŽ панСль, Π° Ρ‚Π°ΠΊΠΆΠ΅ ΠΎΡ‚Ρ€Π΅Π΄Π°ΠΊΡ‚ΠΈΡ€ΡƒΠΉΡ‚Π΅ ΡΡƒΡ‰Π΅ΡΡ‚Π²ΡƒΡŽΡ‰ΠΈΠ΅ Π½Π°ΠΏΡ€Π°Π²Π»ΡΡŽΡ‰ΠΈΠ΅, Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΠΎΠ½ΠΈ соотвСтствовали Ρ€Π΅Π°Π»ΡŒΠ½ΠΎΠΌΡƒ Π΄ΠΈΠ·Π°ΠΉΠ½Ρƒ. Π—Π°Ρ‚Π΅ΠΌ нарисуйтС красный ΠΏΡ€ΡΠΌΠΎΡƒΠ³ΠΎΠ»ΡŒΠ½ΠΈΠΊ (# 3D100B) ΠΈ ΠΏΡ€ΠΈΠΌΠ΅Π½ΠΈΡ‚Π΅ ΡΠ»Π΅Π΄ΡƒΡŽΡ‰ΠΈΠ΅ стили: Drop Shadow, Color Overlay ΠΈ Pattern Overlay.

На этом этапС Π²Ρ‹ Π΄ΠΎΠ»ΠΆΠ½Ρ‹ ΠΏΠΎΠ΄ΡƒΠΌΠ°Ρ‚ΡŒ ΠΎ Ρ‚ΠΎΠΌ, ΠΊΠ°ΠΊ Π²Ρ‹ ΡΠΎΠ±ΠΈΡ€Π°Π΅Ρ‚Π΅ΡΡŒ Π²Ρ‹Ρ€Π΅Π·Π°Ρ‚ΡŒ ΠΈΠ·ΠΎΠ±Ρ€Π°ΠΆΠ΅Π½ΠΈΠ΅ Π² HTML + CSS; Π’ΠΎΡ‚ ΠΏΠΎΡ‡Π΅ΠΌΡƒ я Π±ΠΎΠ»ΡŒΡˆΡƒΡŽ Ρ‡Π°ΡΡ‚ΡŒ Π²Ρ€Π΅ΠΌΠ΅Π½ΠΈ ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΡŽ ΠΏΠ°Π΄Π°ΡŽΡ‰ΠΈΠ΅ Ρ‚Π΅Π½ΠΈ с расстояниСм 0 пиксСлСй ΠΈ Ρ‚ΠΎΠ»ΡŒΠΊΠΎ Π³ΠΎΡ€ΠΈΠ·ΠΎΠ½Ρ‚Π°Π»ΡŒΠ½Ρ‹Π΅ ΠΈΠ»ΠΈ Π²Π΅Ρ€Ρ‚ΠΈΠΊΠ°Π»ΡŒΠ½Ρ‹Π΅ Π³Ρ€Π°Π΄ΠΈΠ΅Π½Ρ‚Ρ‹.ВСкстура Π² этом случаС ΠΈΠΌΠ΅Π΅Ρ‚ ΠΌΠ½ΠΎΠ³ΠΎ Π³ΠΎΡ€ΠΈΠ·ΠΎΠ½Ρ‚Π°Π»ΡŒΠ½Ρ‹Ρ… Π»ΠΈΠ½ΠΈΠΉ. Π­Ρ‚ΠΎ Π΄ΠΎΠ»ΠΆΠ½ΠΎ Π±Ρ‹Ρ‚ΡŒ Π»Π΅Π³ΠΊΠΎ ΠΏΡ€Π΅ΠΎΠ±Ρ€Π°Π·ΠΎΠ²Π°Ρ‚ΡŒ Π² ΠΏΠΎΠ²Ρ‚ΠΎΡ€ΡΡŽΡ‰ΠΈΠΉΡΡ Ρ„ΠΎΠ½ для ΠΌΠ½ΠΎΠ³ΠΈΡ… областСй. ΠšΡ€ΠΎΠΌΠ΅ Ρ‚ΠΎΠ³ΠΎ, это Ρ…ΠΎΡ€ΠΎΡˆΠΈΠΉ ΠΌΠΎΠΌΠ΅Π½Ρ‚, Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΡΠ΄Π΅Π»Π°Ρ‚ΡŒ ΠΏΠ΅Ρ€Π΅Ρ€Ρ‹Π² ΠΈ ΠΎΡ€Π³Π°Π½ΠΈΠ·ΠΎΠ²Π°Ρ‚ΡŒ слои Π² ΠΏΠ°ΠΏΠΊΠ°Ρ…, Ρ‡Ρ‚ΠΎΠ±Ρ‹ всС Π±Ρ‹Π»ΠΎ ΠΎΡ€Π³Π°Π½ΠΈΠ·ΠΎΠ²Π°Π½ΠΎ.

Π¨Π°Π³ 8:

Π’Π΅ΠΏΠ΅Ρ€ΡŒ Π½Π°Ρ‡Π½Π΅ΠΌ с Π΄Π΅Ρ‚Π°Π»Π΅ΠΉ. Π― Ρ…ΠΎΡ‡Ρƒ Π΄ΠΎΠ±Π°Π²ΠΈΡ‚ΡŒ Π½Π°Π·Π²Π°Π½ΠΈΠ΅ сайта Π½Π° Π²ΠΈΠ΄Π½ΠΎΠΌ мСстС, поэтому я Π±ΡƒΠ΄Ρƒ ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚ΡŒ это красивоС ΠΈΠ·ΠΎΠ±Ρ€Π°ΠΆΠ΅Π½ΠΈΠ΅ этикСтки Π² стилС Π³Ρ€Π°Π½ΠΆ. ΠžΡ‡Π΅Π²ΠΈΠ΄Π½ΠΎ, Π²Ρ‹ Π΄ΠΎΠ»ΠΆΠ½Ρ‹ ΠΈΠ·Π²Π»Π΅Ρ‡ΡŒ этикСтку ΠΈ Ρ€Π°Π·ΠΌΠ΅ΡΡ‚ΠΈΡ‚ΡŒ Π΅Π΅ Π² Π²Π΅Ρ€Ρ…Π½Π΅ΠΌ Π»Π΅Π²ΠΎΠΌ ΡƒΠ³Π»Ρƒ нашСго Π΄ΠΈΠ·Π°ΠΉΠ½Π°.ΠŸΠΎΠΏΡ€ΠΎΠ±ΡƒΠΉΡ‚Π΅ ΠΏΠΎΠ»ΡƒΡ‡ΠΈΡ‚ΡŒ Ρ‡Ρ‚ΠΎ-Ρ‚ΠΎ Π²Ρ€ΠΎΠ΄Π΅ ΠΏΠ΅Ρ€Π²ΠΎΠ³ΠΎ изобраТСния Π½ΠΈΠΆΠ΅. Π—Π°Ρ‚Π΅ΠΌ ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠΉΡ‚Π΅ инструмСнт Magic Wand, Ρ‡Ρ‚ΠΎΠ±Ρ‹ Π²Ρ‹Π΄Π΅Π»ΠΈΡ‚ΡŒ малСнький ΠΊΠΎΡ€ΠΈΡ‡Π½Π΅Π²Ρ‹ΠΉ ΠΊΡ€ΡƒΠΆΠΎΠΊ, Π·Π°Ρ‚Π΅ΠΌ Ctrl + Shift + I, Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΠΈΠ½Π²Π΅Ρ€Ρ‚ΠΈΡ€ΠΎΠ²Π°Ρ‚ΡŒ Π²Ρ‹Π΄Π΅Π»Π΅Π½ΠΈΠ΅. ΠžΡ‚Ρ€Π΅Π³ΡƒΠ»ΠΈΡ€ΡƒΠΉΡ‚Π΅ ΡƒΡ€ΠΎΠ²Π½ΠΈ ΠΈ ΠΎΡ‚Ρ‚Π΅Π½ΠΎΠΊ / Π½Π°ΡΡ‹Ρ‰Π΅Π½Π½ΠΎΡΡ‚ΡŒ, ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΡ значСния, ΠΏΠΎΠΊΠ°Π·Π°Π½Π½Ρ‹Π΅ Π½ΠΈΠΆΠ΅.

Π¨Π°Π³ 9:

Π’Π΅ΠΏΠ΅Ρ€ΡŒ, ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΡ инструмСнт «Ластик» ΠΈ Π½Π΅ΠΏΡ€Π°Π²ΠΈΠ»ΡŒΠ½ΡƒΡŽ ΠΊΠΈΡΡ‚ΡŒ, ΡƒΠ΄Π°Π»ΠΈΡ‚Π΅ Π½Π΅ΠΊΠΎΡ‚ΠΎΡ€Ρ‹Π΅ области Π³Ρ€Π°Π½ΠΈΡ†Ρ‹ этикСтки. Π§Ρ‚ΠΎΠ±Ρ‹ Π΄ΠΎΠ±Π°Π²ΠΈΡ‚ΡŒ эффСкт вырСзания ΠΈΠ· Π±ΡƒΠΌΠ°Π³ΠΈ, Π²Ρ‹Π±Π΅Ρ€ΠΈΡ‚Π΅ инструмСнт Β«ΠžΡΠ²Π΅Ρ‚Π»Π΅Π½ΠΈΠ΅Β» ΠΈ ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠΉΡ‚Π΅ Ρ‚Ρƒ ΠΆΠ΅ ΠΊΠΈΡΡ‚ΡŒ, Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΠΏΡ€ΠΈΠΌΠ΅Π½ΠΈΡ‚ΡŒ освСтлСниС ΠΊ Π³Ρ€Π°Π½ΠΈΡ†Π΅ этикСтки.

Π¨Π°Π³ 10:

Π’Π΅ΠΏΠ΅Ρ€ΡŒ ΠΌΡ‹ Π΄ΠΎΠ±Π°Π²ΠΈΠΌ Ρ‚Π΅Π½ΡŒ ΠΊ Π½Π°ΡˆΠ΅ΠΌΡƒ ярлыку. Для этого ΠΏΡ€ΠΎΠ΄ΡƒΠ±Π»ΠΈΡ€ΡƒΠΉΡ‚Π΅ слой Β«LabelΒ», ΠΈΠ·ΠΌΠ΅Π½ΠΈΡ‚Π΅ Hue / Saturation> Lightness Π½Π° -100 ΠΈ ΠΏΡ€ΠΈΠΌΠ΅Π½ΠΈΡ‚Π΅ Gaussian Blur с радиусом 10 пиксСлСй. Π—Π°Ρ‚Π΅ΠΌ ΠΈΠ·ΠΌΠ΅Π½ΠΈΡ‚Π΅ Ρ€Π΅ΠΆΠΈΠΌ налоТСния «Копия ΠΌΠ΅Ρ‚ΠΊΠΈΒ» Π½Π° Π£ΠΌΠ½ΠΎΠΆΠ΅Π½ΠΈΠ΅ ΠΈ установитС ΠΠ΅ΠΏΡ€ΠΎΠ·Ρ€Π°Ρ‡Π½ΠΎΡΡ‚ΡŒ Π½Π° 75%.

Π¨Π°Π³ 11:

ПослСдняя ΠΎΠ±Ρ€Π°Π±ΠΎΡ‚ΠΊΠ° этикСтки, ΠΈΠ·ΠΌΠ΅Π½ΠΈΡ‚Π΅ Π½Π°ΡΡ‹Ρ‰Π΅Π½Π½ΠΎΡΡ‚ΡŒ Π½Π° -40, Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΡΠ΄Π΅Π»Π°Ρ‚ΡŒ Π΅Π΅ Π±ΠΎΠ»Π΅Π΅ сСрой.

Π¨Π°Π³ 12:

Π’Π΅ΠΏΠ΅Ρ€ΡŒ ΠΌΡ‹ Π΄ΠΎΠ±Π°Π²ΠΈΠΌ нСсколько Π²ΡΠΏΠΎΠΌΠΎΠ³Π°Ρ‚Π΅Π»ΡŒΠ½Ρ‹Ρ… ΠΈΠ·ΠΎΠ±Ρ€Π°ΠΆΠ΅Π½ΠΈΠΉ, попытаСмся Π½Π°ΠΉΡ‚ΠΈ изобраТСния, ΠΎΠΊΡ€ΡƒΠΆΠ°ΡŽΡ‰ΠΈΠ΅ ΠΊΠΎΠ½Ρ†Π΅ΠΏΡ†ΠΈΡŽ, Π½ΠΎ, ΠΏΠΎΡΠΊΠΎΠ»ΡŒΠΊΡƒ это руководство ΠΏΠΎ ΠΌΠ΅Ρ‚ΠΎΠ΄Π°ΠΌ, я Π²Ρ‹Π±ΠΈΡ€Π°ΡŽ случайный.Π­Ρ‚ΠΎ красивая фотография старинного ΠΏΠΎΠ΅Π·Π΄Π° здСсь, Π² Π²Ρ‹ΡΠΎΠΊΠΎΠ³ΠΎΡ€ΡŒΠ΅ Π‘ΠΎΠ»ΠΈΠ²ΠΈΠΈ. Π’Ρ‹Π΄Π²ΠΈΠ½ΡŒΡ‚Π΅ Ρ„ΠΎΡ€ΠΌΡƒ ΠΏΠΎΠ΅Π·Π΄Π°, ΠΊΠ°ΠΊ Ρ…ΠΎΡ‚ΠΈΡ‚Π΅. Π—Π°Ρ‚Π΅ΠΌ ΠΈΠ·ΠΌΠ΅Π½ΠΈΡ‚Π΅ Ρ€Π΅ΠΆΠΈΠΌ налоТСния слоя Β«trainΒ» Π½Π° Darken.

Π¨Π°Π³ 13:

Π”Π°Π²Π°ΠΉΡ‚Π΅ Π΄ΠΎΠ±Π°Π²ΠΈΠΌ тСкст, сначала имя страницы. НапСчатайтС Ρ‡Ρ‚ΠΎ-Π½ΠΈΠ±ΡƒΠ΄ΡŒ с использованиСм Π³Ρ€Π°Π½ΠΆΠ΅Π²ΠΎΠ³ΠΎ ΡˆΡ€ΠΈΡ„Ρ‚Π°; Π’Ρ‹ ΠΌΠΎΠΆΠ΅Ρ‚Π΅ Π½Π°ΠΉΡ‚ΠΈ нСсколько интСрСсных здСсь. Для Π·Π°Π³ΠΎΠ»ΠΎΠ²ΠΊΠ° ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠΉΡ‚Π΅ Ρ‡Π΅Ρ€Π½Ρ‹ΠΉ ΡˆΡ€ΠΈΡ„Ρ‚ ΠΈ ΠΈΠ·ΠΌΠ΅Π½ΠΈΡ‚Π΅ Ρ€Π΅ΠΆΠΈΠΌ налоТСния слоя Π½Π° Overlay, Π·Π°Ρ‚Π΅ΠΌ ΠΏΡ€ΠΎΠ΄ΡƒΠ±Π»ΠΈΡ€ΡƒΠΉΡ‚Π΅ слой ΠΈ ΠΈΠ·ΠΌΠ΅Π½ΠΈΡ‚Π΅ Π½Π΅ΠΏΡ€ΠΎΠ·Ρ€Π°Ρ‡Π½ΠΎΡΡ‚ΡŒ ΠΊΠΎΠΏΠΈΠΈ Π½Π° 75%.Π§Ρ‚ΠΎΠ±Ρ‹ ΠΏΠΎΠ»ΡƒΡ‡ΠΈΡ‚ΡŒ ΠΊΡ€ΠΎΡˆΠ΅Ρ‡Π½Ρ‹ΠΉ эффСкт размытия, пСрСмСститС скопированный слой Π½Π° ΠΎΠ΄ΠΈΠ½ ΠΈΠ»ΠΈ Π΄Π²Π° пиксСля Π²Π»Π΅Π²ΠΎ ΠΈΠ»ΠΈ Π²ΠΏΡ€Π°Π²ΠΎ. Π”ΠΎΠ±Π°Π²ΡŒΡ‚Π΅ большС тСкста, ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΡ эту Ρ‚Π΅Ρ…Π½ΠΈΠΊΡƒ, Π½Π°ΠΏΡ€ΠΈΠΌΠ΅Ρ€ слоган ΠΈΠ»ΠΈ Ρ‡Ρ‚ΠΎ-Ρ‚ΠΎ Π² этом Ρ€ΠΎΠ΄Π΅. ΠšΡ€ΠΎΠΌΠ΅ Ρ‚ΠΎΠ³ΠΎ, сСйчас Ρ…ΠΎΡ€ΠΎΡˆΠΈΠΉ ΠΌΠΎΠΌΠ΅Π½Ρ‚, Ρ‡Ρ‚ΠΎΠ±Ρ‹ Π΄ΠΎΠ±Π°Π²ΠΈΡ‚ΡŒ ΠΈ Π½Π°Π²ΠΈΠ³Π°Ρ†ΠΈΠΎΠ½Π½Ρ‹Π΅ ссылки.

Π¨Π°Π³ 14:

А Ρ‚Π΅ΠΏΠ΅Ρ€ΡŒ Π΄ΠΎΠ±Π°Π²ΠΈΠΌ большС Π²Π΅Ρ‰Π΅ΠΉ, это ΡΡ‚ΠΈΠ»ΡŒ Π³Ρ€Π°Π½ΠΆ! Π― скачал нСсколько кистСй Jenn B ΠΎΡ‚ΡΡŽΠ΄Π°, Ρƒ этих кистСй Π΅ΡΡ‚ΡŒ ограничСния. Π˜ΡΠΏΠΎΠ»ΡŒΠ·ΡƒΡ эти кисти, Π΄ΠΎΠ±Π°Π²ΡŒΡ‚Π΅ нСсколько Ρ†ΠΈΡ„Ρ€, ΡƒΠ³Π»ΠΎΠ², малярных Π»Π΅Π½Ρ‚ ΠΈ ΠΏΡ€ΠΎΡ‡Π΅Π³ΠΎ, Π½Π΅ ΡΡ‚Π΅ΡΠ½ΡΠΉΡ‚Π΅ΡΡŒ Π΄Π΅Π»Π°Ρ‚ΡŒ Π½Π° этом этапС всС, Ρ‡Ρ‚ΠΎ Π·Π°Ρ…ΠΎΡ‚ΠΈΡ‚Π΅.ΠŸΡ€ΠΎΡΡ‚ΠΎ Π½Π΅ Π·Π°Π±ΡƒΠ΄ΡŒΡ‚Π΅ Π΄ΠΎΠ±Π°Π²ΠΈΡ‚ΡŒ всС слои ΠΏΠΎΠ΄ слоями Β«Π­Ρ‚ΠΈΠΊΠ΅Ρ‚ΠΊΠ°Β» ΠΈ «Копия ΠΌΠ΅Ρ‚ΠΊΠΈΒ».

Π¨Π°Π³ 15:

Π’Π΅ΠΏΠ΅Ρ€ΡŒ ΠΌΡ‹ Π½Π°Ρ‡Π½Π΅ΠΌ Π΄ΠΎΠ±Π°Π²Π»ΡΡ‚ΡŒ Ρ€Π°Π·Π΄Π΅Π»Ρ‹ страницы. ΠŸΡ€Π΅ΠΆΠ΄Π΅ всСго, Π² шапкС Π½Π°ΠΌ понадобится строка поиска. Π’Π²Π΅Π΄ΠΈΡ‚Π΅ ΠΌΠ΅Ρ‚ΠΊΡƒ поиска. Π—Π°Ρ‚Π΅ΠΌ нарисуйтС красный ΠΏΡ€ΡΠΌΠΎΡƒΠ³ΠΎΠ»ΡŒΠ½ΠΈΠΊ (# 6A0400) Π² качСствС поля Π²Π²ΠΎΠ΄Π° для поиска, Π·Π°Ρ‚Π΅ΠΌ ΠΏΡ€ΠΈΠΌΠ΅Π½ΠΈΡ‚Π΅ эффСкт слоя «Обводка» ΠΈ Β«Π£Π·ΠΎΡ€Β».

Π¨Π°Π³ 16:

Π’Π΅ΠΏΠ΅Ρ€ΡŒ ΠΌΡ‹ Π½Π°Ρ‡Π½Π΅ΠΌ Π΄ΠΎΠ±Π°Π²Π»ΡΡ‚ΡŒ основноС содСрТаниС нашСго Π΄ΠΈΠ·Π°ΠΉΠ½Π°. Π‘Π½Π°Ρ‡Π°Π»Π° ΠΌΡ‹ собираСмся Π΄ΠΎΠ±Π°Π²ΠΈΡ‚ΡŒ ΠΏΠΎΠ»Π΅, Π² ΠΊΠΎΡ‚ΠΎΡ€ΠΎΠ΅ Π±ΡƒΠ΄Π΅Ρ‚ ΠΏΠΎΠΌΠ΅Ρ‰Π΅Π½ ΠΈΠ·Π±Ρ€Π°Π½Π½Ρ‹ΠΉ тСкст.НарисуйтС Ρ‚Π΅ΠΌΠ½ΠΎ-сСрый ΠΏΡ€ΡΠΌΠΎΡƒΠ³ΠΎΠ»ΡŒΠ½ΠΈΠΊ (# 0D0F0E) Π½Π° слоС ΠΏΠΎΠ΄ Π±ΠΎΠΊΠΎΠ²ΠΎΠΉ панСлью. Π― создал Ρ‡Π΅Ρ‚Ρ‹Ρ€Π΅ ΠΏΠ°ΠΏΠΊΠΈ, Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΡƒΠΏΠΎΡ€ΡΠ΄ΠΎΡ‡ΠΈΡ‚ΡŒ ΠΌΠ°ΠΊΠ΅Ρ‚: ΠΎΠ΄Π½Ρƒ для Β«Π—Π°Π³ΠΎΠ»ΠΎΠ²ΠΊΠ°Β» Π½Π°Π΄ всСм, ΠΎΠ΄Π½Ρƒ для Β«Π‘ΠΎΠΊΠΎΠ²ΠΎΠΉ ΠΏΠ°Π½Π΅Π»ΠΈΒ» ΠΏΠΎΠ΄ Β«Π—Π°Π³ΠΎΠ»ΠΎΠ²ΠΊΠΎΠΌΒ», ΠΎΠ΄Π½Ρƒ для Β«ΠšΠΎΠ½Ρ‚Π΅Π½Ρ‚Π°Β» ΠΏΠΎΠ΄ Β«Π—Π°Π³ΠΎΠ»ΠΎΠ²ΠΊΠΎΠΌΒ» ΠΈ Β«Π‘ΠΎΠΊΠΎΠ²ΠΎΠΉ панСлью» ΠΈ послСднюю. ΠΎΠ΄ΠΈΠ½ для «НиТнСго ΠΊΠΎΠ»ΠΎΠ½Ρ‚ΠΈΡ‚ΡƒΠ»Π°Β».

Π’Ρ‹ ΠΌΠΎΠΆΠ΅Ρ‚Π΅ Π΄ΠΎΠ±Π°Π²ΠΈΡ‚ΡŒ этот ΠΏΡ€ΡΠΌΠΎΡƒΠ³ΠΎΠ»ΡŒΠ½ΠΈΠΊ Π² слой Β«ContentΒ», Ρ‚Π°ΠΊΠΆΠ΅ Π²Ρ‹ ΠΌΠΎΠΆΠ΅Ρ‚Π΅ Π΄ΠΎΠ±Π°Π²ΠΈΡ‚ΡŒ ΡΡ‚ΠΎΠ»ΡŒΠΊΠΎ ΠΏΠ°ΠΏΠΎΠΊ, сколько Π½Π΅ΠΎΠ±Ρ…ΠΎΠ΄ΠΈΠΌΠΎ Π²Π½ΡƒΡ‚Ρ€ΠΈ этих Ρ‡Π΅Ρ‚Ρ‹Ρ€Π΅Ρ… ΠΏΠ°ΠΏΠΎΠΊ. ПослС Ρ‚ΠΎΠ³ΠΎ, ΠΊΠ°ΠΊ Π²Ρ‹ размСстили ΠΏΡ€ΡΠΌΠΎΡƒΠ³ΠΎΠ»ΡŒΠ½ΠΈΠΊ Π² Π½ΡƒΠΆΠ½ΠΎΠΌ мСстС, ΠΏΡ€ΠΈΠΌΠ΅Π½ΠΈΡ‚Π΅ эффСкт Drop shadow ΠΈ Stroke, ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΡ значСния, ΡƒΠΊΠ°Π·Π°Π½Π½Ρ‹Π΅ Π½ΠΈΠΆΠ΅.

Π¨Π°Π³ 17:

Π—Π°Π³Ρ€ΡƒΠ·ΠΈΡ‚Π΅ нСсколько Π³Ρ€Π°Π½ΠΆΠ΅Π²Ρ‹Ρ… ΡƒΠ³Π»ΠΎΠ² ΠΈ Π³Ρ€Π°Π½ΠΈΡ† ΠΎΡ‚ΡΡŽΠ΄Π° ΠΈ Π²ΡΡ‚Π°Π²ΡŒΡ‚Π΅ ΠΎΠ΄ΠΈΠ½ Π½Π° сСрый Ρ„ΠΎΠ½. Π—Π°Ρ‚Π΅ΠΌ ΠΏΡ€ΠΈΠΌΠ΅Π½ΠΈΡ‚Π΅ эффСкт налоТСния ΠΊ ΡƒΠ³Π»Ρƒ с Ρ†Π²Π΅Ρ‚ΠΎΠΌ # 171612. Π’Π°ΠΊΠΆΠ΅ Π΄ΠΎΠ±Π°Π²ΡŒΡ‚Π΅ Π΅Ρ‰Π΅ ΠΎΠ΄ΠΈΠ½ ΡƒΠ³ΠΎΠ» Π½Π°Π΄ Ρ„ΠΎΠ½ΠΎΠΌ Π±ΠΎΠΊΠΎΠ²ΠΎΠΉ ΠΏΠ°Π½Π΅Π»ΠΈ, Π½ΠΎ Π½Π° этот Ρ€Π°Π· ΡΠ½ΠΈΠ·ΡŒΡ‚Π΅ Π΅Π³ΠΎ Π½Π΅ΠΏΡ€ΠΎΠ·Ρ€Π°Ρ‡Π½ΠΎΡΡ‚ΡŒ Π½ΠΈΠΆΠ΅ 25%.

Π¨Π°Π³ 18:

Π”Π°Π²Π°ΠΉΡ‚Π΅ Π΄ΠΎΠ±Π°Π²ΠΈΠΌ тСкст. Π’Ρ‹ ΠΌΠΎΠΆΠ΅Ρ‚Π΅ Π΄ΠΎΠ±Π°Π²ΠΈΡ‚ΡŒ любой ΠΎΠ±Ρ€Π°Π·Π΅Ρ† тСкста, ΠΏΡ€Π΅Π΄ΡΡ‚Π°Π²ΡŒΡ‚Π΅, Ρ‡Ρ‚ΠΎ это Ρ€Π°Π·Π΄Π΅Π» Π½Π΅Π΄Π°Π²Π½ΠΈΡ… сообщСний, созданный с ΠΏΠΎΠΌΠΎΡ‰ΡŒΡŽ javascript, ΠΈΠ»ΠΈ Ρ€Π°Π·Π΄Π΅Π» ΠΈΠ·Π±Ρ€Π°Π½Π½Ρ‹Ρ… сообщСний, Ρ‡Ρ‚ΠΎ-Ρ‚ΠΎ Π² этом Ρ€ΠΎΠ΄Π΅.Π― ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΡŽ Ρ‚ΠΎΡ‚ ΠΆΠ΅ Π³Ρ€Π°Π½ΠΆΠ΅Π²Ρ‹ΠΉ экранный ΡˆΡ€ΠΈΡ„Ρ‚, Ρ‡Ρ‚ΠΎ ΠΈ для ΠΏΠ°Π½Π΅Π»ΠΈ Π½Π°Π²ΠΈΠ³Π°Ρ†ΠΈΠΈ, с Ρ†Π²Π΅Ρ‚ΠΎΠΌ # 4D0D0D, ΠΈ Arial с Ρ†Π²Π΅Ρ‚ΠΎΠΌ # 3F3F3F для основного тСкста.

ΠŸΡ€ΠΈΠΌΠ΅Π½ΠΈΡ‚Π΅ эффСкт Ρ‚Π΅Π½ΠΈ ΠΊ Π·Π°Π³ΠΎΠ»ΠΎΠ²ΠΊΡƒ ΠΈ Π΄ΠΎΠ±Π°Π²ΡŒΡ‚Π΅ Ρ‚ΠΎΡ‚ ΠΆΠ΅ эффСкт ΠΊ элСмСнтам Π½Π°Π²ΠΈΠ³Π°Ρ†ΠΈΠΈ. Когда Π²Ρ‹ ΠΊΠΎΠ½Π²Π΅Ρ€Ρ‚ΠΈΡ€ΡƒΠ΅Ρ‚Π΅ этот PSD Π² Ρ„Π°ΠΉΠ» HTML + CSS, Π²Π°ΠΌ Π½ΡƒΠΆΠ½ΠΎ Π±ΡƒΠ΄Π΅Ρ‚ ΠΏΡ€Π΅ΠΎΠ±Ρ€Π°Π·ΠΎΠ²Π°Ρ‚ΡŒ эти Π·Π°Π³ΠΎΠ»ΠΎΠ²ΠΊΠΈ Π² изобраТСния, Ρ‚Π°ΠΊ Ρ‡Ρ‚ΠΎ Π½ΠΈΡ‡Π΅Π³ΠΎ ΡΡ‚Ρ€Π°ΡˆΠ½ΠΎΠ³ΠΎ, Ссли Π²Ρ‹ Ρ…ΠΎΡ‚ΠΈΡ‚Π΅ Π΄ΠΎΠ±Π°Π²ΠΈΡ‚ΡŒ ΠΊ Π½ΠΈΠΌ большС стилСй. НаконСц, ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠΉΡ‚Π΅ Π½Π°ΠΏΡ€Π°Π²Π»ΡΡŽΡ‰ΠΈΠ΅, Ρ‡Ρ‚ΠΎΠ±Ρ‹ Ρ€Π°ΡΠΏΠΎΠ»ΠΎΠΆΠΈΡ‚ΡŒ тСкстовыС слои Π² Π½ΡƒΠΆΠ½Ρ‹Ρ… мСстах.

Π¨Π°Π³ 19:

Наша избранная панСль выглядит Π½Π΅ΠΌΠ½ΠΎΠ³ΠΎ пустой, поэтому Π΄Π°Π²Π°ΠΉΡ‚Π΅ Π΄ΠΎΠ±Π°Π²ΠΈΠΌ ΠΈΠ·ΠΎΠ±Ρ€Π°ΠΆΠ΅Π½ΠΈΠ΅ ΠΏΠΎΠ΄Π΄Π΅Ρ€ΠΆΠΊΠΈ.Π’ Π΄Π°Π½Π½ΠΎΠΌ случаС я использовал снимок поляроидом. Π’Ρ‹ ΠΌΠΎΠΆΠ΅Ρ‚Π΅ ΡΠΊΠ°Ρ‡Π°Ρ‚ΡŒ ΠΈΠ·ΠΎΠ±Ρ€Π°ΠΆΠ΅Π½ΠΈΠ΅ поляроида здСсь. Π˜Π·Π²Π»Π΅ΠΊΠΈΡ‚Π΅ поляроид, Π²ΡΡ‚Π°Π²ΡŒΡ‚Π΅ Π΅Π³ΠΎ Π² слой Π½Π°Π΄ сСрым Ρ„ΠΎΠ½ΠΎΠΌ ΠΈ Π³Ρ€Π°Π½ΠΆΠ΅Π²Ρ‹ΠΌ ΡƒΠ³ΠΎΠ»ΠΊΠΎΠΌ Π² ΠΏΠ°ΠΏΠΊΠ΅ Β«Π‘ΠΎΠ΄Π΅Ρ€ΠΆΠΈΠΌΠΎΠ΅Β», Π·Π°Ρ‚Π΅ΠΌ ΠΈΠ·ΠΌΠ΅Π½ΠΈΡ‚Π΅ ΠΎΡ‚Ρ‚Π΅Π½ΠΎΠΊ / Π½Π°ΡΡ‹Ρ‰Π΅Π½Π½ΠΎΡΡ‚ΡŒ, Ρ‡Ρ‚ΠΎΠ±Ρ‹ поляроид стал Π½Π΅ΠΌΠ½ΠΎΠ³ΠΎ большС сСпии (Π²Ρ‹Π±Π΅Ρ€ΠΈΡ‚Π΅ ΠΏΠ°Ρ€Π°ΠΌΠ΅Ρ‚Ρ€ Β«Π Π°ΡΠΊΡ€Π°ΡΠΈΡ‚ΡŒΒ»).

Π˜ΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠΉΡ‚Π΅ Ρ‚Π΅ ΠΆΠ΅ ΠΌΠ΅Ρ‚ΠΎΠ΄Ρ‹ для ΠΊΡ€Π°Π΅Π² слоя Β«LabelΒ» (шаг 9). Π‘ΠΎΡ‚Ρ€ΠΈΡ‚Π΅ ΠΈ освСтлитС края изобраТСния Polaroid. НаконСц, Π΄ΠΎΠ±Π°Π²ΡŒΡ‚Π΅ Ρ‚Π΅Π½ΡŒ, ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΡ Ρ‚Ρƒ ΠΆΠ΅ Ρ‚Π΅Ρ…Π½ΠΈΠΊΡƒ, Ρ‡Ρ‚ΠΎ ΠΈ Π² шагС 10 этого ΡƒΡ€ΠΎΠΊΠ°.

Π¨Π°Π³ 20:

Π£ мСня Π±Ρ‹Π»Π° эта фотография с сСпиСй, поэтому я добавляю Π΅Π΅ Π² Π΄ΠΈΠ·Π°ΠΉΠ½. Π”ΠΎΠ±Π°Π²ΡŒΡ‚Π΅ любоС ΠΈΠ·ΠΎΠ±Ρ€Π°ΠΆΠ΅Π½ΠΈΠ΅ Π² Π½ΠΎΠ²Ρ‹ΠΉ слой Π½Π°Π΄ слоСм Β«PolaroidΒ», Π²Ρ‹Π±Π΅Ρ€ΠΈΡ‚Π΅ Ρ‡Π΅Ρ€Π½Ρ‹ΠΉ ΠΊΠ²Π°Π΄Ρ€Π°Ρ‚ поляроида, Π·Π°Ρ‚Π΅ΠΌ Command + Shift + I, Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΠΈΠ½Π²Π΅Ρ€Ρ‚ΠΈΡ€ΠΎΠ²Π°Ρ‚ΡŒ Π²Ρ‹Π΄Π΅Π»Π΅Π½ΠΈΠ΅. Π’Ρ‹Π±Π΅Ρ€ΠΈΡ‚Π΅ слой с ΠΈΠ·ΠΎΠ±Ρ€Π°ΠΆΠ΅Π½ΠΈΠ΅ΠΌ ΠΈ ΡƒΠ΄Π°Π»ΠΈΡ‚Π΅ всС лишнСС. Π—Π°Ρ‚Π΅ΠΌ Π²Ρ‹ ΠΌΠΎΠΆΠ΅Ρ‚Π΅ Π΄ΠΎΠ±Π°Π²ΠΈΡ‚ΡŒ большС Π΄Π΅Ρ‚Π°Π»Π΅ΠΉ Π² стилС Π³Ρ€Π°Π½ΠΆ, Π½Π°ΠΏΡ€ΠΈΠΌΠ΅Ρ€, ΠΊΠ»Π΅ΠΉΠΊΠΎΠΉ Π»Π΅Π½Ρ‚Ρ‹ ΠΏΠΎΠ²Π΅Ρ€Ρ… изобраТСния, ΠΊΠ°ΠΊ ΠΏΠΎΠΊΠ°Π·Π°Π½ΠΎ Π½Π° изобраТСниях Π½ΠΈΠΆΠ΅. Π― Ρ‚Π°ΠΊΠΆΠ΅ ΠΏΡ€ΠΈΠΌΠ΅Π½ΠΈΠ» эффСкт Drop Shadow Ρ€Π°Π·ΠΌΠ΅Ρ€ΠΎΠΌ 1px ΠΊ Π΄ΠΎΠ±Π°Π²Π»Π΅Π½Π½ΠΎΠΉ Π»Π΅Π½Ρ‚Π΅.

Π¨Π°Π³ 21:

БСйчас Ρ…ΠΎΡ€ΠΎΡˆΠΈΠΉ ΠΌΠΎΠΌΠ΅Π½Ρ‚, Ρ‡Ρ‚ΠΎΠ±Ρ‹ Π΄ΠΎΠ±Π°Π²ΠΈΡ‚ΡŒ Π·Π½Π°Ρ‡ΠΎΠΊ RSS Π½Π° Π±ΠΎΠΊΠΎΠ²ΡƒΡŽ панСль. НарисуйтС ΠΏΡ€ΡΠΌΠΎΡƒΠ³ΠΎΠ»ΡŒΠ½ΠΈΠΊ с Π·Π°ΠΊΡ€ΡƒΠ³Π»Π΅Π½Π½Ρ‹ΠΌΠΈ ΡƒΠ³Π»Π°ΠΌΠΈ (# 99917E), Π·Π°Ρ‚Π΅ΠΌ ΠΏΡ€ΠΈΠΌΠ΅Π½ΠΈΡ‚Π΅ ΠΊ Π½Π΅ΠΌΡƒ ΡΠ»Π΅Π΄ΡƒΡŽΡ‰ΠΈΠ΅ эффСкты: Π²Π½ΡƒΡ‚Ρ€Π΅Π½Π½Π΅Π΅ свСчСниС, Π½Π°Π»ΠΎΠΆΠ΅Π½ΠΈΠ΅ ΡƒΠ·ΠΎΡ€Π° ΠΈ Ρ‚Π΅Π½ΡŒ, ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠΉΡ‚Π΅ значСния, ΠΏΠΎΠΊΠ°Π·Π°Π½Π½Ρ‹Π΅ Π½Π° ΠΈΠ·ΠΎΠ±Ρ€Π°ΠΆΠ΅Π½ΠΈΠΈ Π½ΠΈΠΆΠ΅. Π—Π°Ρ‚Π΅ΠΌ нарисуйтС ΠΈΠ»ΠΈ Π²ΡΡ‚Π°Π²ΡŒΡ‚Π΅ Π² Π½ΠΎΠ²Ρ‹ΠΉ слой Π½Π°Π΄ ΠΏΡ€ΡΠΌΠΎΡƒΠ³ΠΎΠ»ΡŒΠ½ΠΈΠΊΠΎΠΌ ΡΡ‚Π°Π½Π΄Π°Ρ€Ρ‚Π½ΡƒΡŽ Ρ„ΠΈΠ³ΡƒΡ€Ρƒ RSS ΠΈ Π·Π°Π»Π΅ΠΉΡ‚Π΅ Π΅Π΅ Ρ‡Π΅Ρ€Π½Ρ‹ΠΌ Ρ†Π²Π΅Ρ‚ΠΎΠΌ. НаконСц, ΠΈΠ·ΠΌΠ΅Π½ΠΈΡ‚Π΅ Ρ€Π΅ΠΆΠΈΠΌ налоТСния слоя Β«RSS shapeΒ» Π½Π° Overlay.

Π¨Π°Π³ 22:

Π’Π΅ΠΏΠ΅Ρ€ΡŒ помСститС Π·Π½Π°Ρ‡ΠΎΠΊ RSS Π² Π»Π΅Π²Ρ‹ΠΉ Π²Π΅Ρ€Ρ…Π½ΠΈΠΉ ΡƒΠ³ΠΎΠ» Π±ΠΎΠΊΠΎΠ²ΠΎΠΉ ΠΏΠ°Π½Π΅Π»ΠΈ.Π”ΠΎΠ±Π°Π²ΡŒΡ‚Π΅ тСкст, Π½Π°ΠΏΡ€ΠΈΠΌΠ΅Ρ€ Β«RSS FEEDΒ». НарисуйтС Π΅Ρ‰Π΅ ΠΎΠ΄ΠΈΠ½ кусок малярной Π»Π΅Π½Ρ‚Ρ‹ ΠΈ Π½Π°ΠΏΠΈΡˆΠΈΡ‚Π΅ Π½Π° Π½Π΅ΠΌ количСство подписчиков. ΠŸΠΎΠΌΠ½ΠΈΡ‚Π΅, сСйчас ΠΌΡ‹ Ρ€Π°Π±ΠΎΡ‚Π°Π΅ΠΌ с ΠΏΠ°ΠΏΠΊΠΎΠΉ «Боковая панСль».

Π¨Π°Π³ 23:

ΠŸΡ€ΠΈΡˆΠ»ΠΎ врСмя Π΄ΠΎΠ±Π°Π²ΠΈΡ‚ΡŒ ΠΎΠ΄Π½Ρƒ запись Π² наш Π΄ΠΈΠ·Π°ΠΉΠ½. ΠŸΡ€ΠΎΡΡ‚ΠΎ Π½Π°ΠΏΠΈΡˆΠΈΡ‚Π΅ случайный тСкст Π² качСствС Π·Π°Π³ΠΎΠ»ΠΎΠ²ΠΊΠ°, Π΄Ρ€ΡƒΠ³ΡƒΡŽ строку для Π΄Π°Ρ‚Ρ‹, ΠΊΠ°Ρ‚Π΅Π³ΠΎΡ€ΠΈΠΈ ΠΈ Π°Π²Ρ‚ΠΎΡ€Π°. Π’Π°ΠΊΠΆΠ΅ нСсколько слов Π² тСкстС поста. Π’ΠΈΠΏΠΎΠ³Ρ€Π°Ρ„ΠΈΠΊΠ° — самая ваТная Π½Π° этом этапС. Π― люблю ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚ΡŒ ΡˆΡ€ΠΈΡ„Ρ‚Ρ‹ с засСчками для Π·Π°Π³ΠΎΠ»ΠΎΠ²ΠΊΠΎΠ² ΠΈ Π±Π΅Π· засСчСк для основного тСкста, Π½ΠΎ это Ρ‚ΠΎΠ»ΡŒΠΊΠΎ я.Π Π΅ΡˆΠΈΡ‚Π΅, Ρ‡Ρ‚ΠΎ Π»ΡƒΡ‡ΡˆΠ΅ всСго ΠΏΠΎΠ΄Ρ…ΠΎΠ΄ΠΈΡ‚ для вашСго Π΄ΠΈΠ·Π°ΠΉΠ½Π°.

Π¨Π°Π³ 24:

Π§Ρ‚ΠΎΠ±Ρ‹ Π΄Π°Ρ‚ΡŒ Π½Π°ΡˆΠ΅ΠΌΡƒ ΠΎΠ±Ρ€Π°Π·Ρ†Ρƒ ΠΏΡƒΠ±Π»ΠΈΠΊΠ°Ρ†ΠΈΠΈ Π½Π΅ΠΌΠ½ΠΎΠ³ΠΎ большС ΠΎΡ‚Π½ΠΎΡˆΠ΅Π½ΠΈΡ, ΠΌΡ‹ собираСмся Π΄ΠΎΠ±Π°Π²ΠΈΡ‚ΡŒ ΠΈΠ·ΠΎΠ±Ρ€Π°ΠΆΠ΅Π½ΠΈΠ΅ для ΠΏΡ€Π΅Π΄Π²Π°Ρ€ΠΈΡ‚Π΅Π»ΡŒΠ½ΠΎΠ³ΠΎ просмотра, ΠΊΠ°ΠΊ ΠΈ Π½Π° сайтах TUTS, Π½ΠΎ ΠΏΠΎΡΠΊΠΎΠ»ΡŒΠΊΡƒ это Π³Ρ€Π°Π½ΠΆ-Π΄ΠΈΠ·Π°ΠΉΠ½, Π½Π°ΠΌ Π½ΡƒΠΆΠ½ΠΎ Π΄ΠΎΠ±Π°Π²ΠΈΡ‚ΡŒ Π³Ρ€Π°Π½ΠΆ-Ρ„ΠΎΠ½ ΠΊ нашим изобраТСниям. Π­Ρ‚ΠΎ Ρ‚Π°ΠΊ ΠΆΠ΅ просто, ΠΊΠ°ΠΊ Π΄ΠΎΠ±Π°Π²ΠΈΡ‚ΡŒ отступ свСрху ΠΈ снизу с ΠΏΠΎΠΌΠΎΡ‰ΡŒΡŽ CSS, Π° Π·Π°Ρ‚Π΅ΠΌ ΡƒΡΡ‚Π°Π½ΠΎΠ²ΠΈΡ‚ΡŒ ΠΏΠΎΠ²Ρ‚ΠΎΡ€ΡΡŽΡ‰Π΅Π΅ΡΡ Ρ„ΠΎΠ½ΠΎΠ²ΠΎΠ΅ ΠΈΠ·ΠΎΠ±Ρ€Π°ΠΆΠ΅Π½ΠΈΠ΅.

Π­Ρ‚ΠΎ ΠΈΠ·ΠΎΠ±Ρ€Π°ΠΆΠ΅Π½ΠΈΠ΅ Π±ΡƒΠ΄Π΅Ρ‚ Π½Π° 35-ΠΌΠΈΠ»Π»ΠΈΠΌΠ΅Ρ‚Ρ€ΠΎΠ²ΠΎΠΉ ΠΏΠ»Π΅Π½ΠΊΠ΅. Π˜Π·Π²Π»Π΅ΠΊΠΈΡ‚Π΅ Π΄Π²Π΅ малСнькиС полоски ΠΈΠ· ΠΏΠ»Π΅Π½ΠΊΠΈ ΠΈ ΠΈΠ·ΠΌΠ΅Π½ΠΈΡ‚Π΅ ΠΈΡ… ΠΎΡ‚Ρ‚Π΅Π½ΠΎΠΊ / Π½Π°ΡΡ‹Ρ‰Π΅Π½Π½ΠΎΡΡ‚ΡŒ, ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΡ значСния Π½Π° ΠΈΠ·ΠΎΠ±Ρ€Π°ΠΆΠ΅Π½ΠΈΠΈ Π½ΠΈΠΆΠ΅.Π—Π°Ρ‚Π΅ΠΌ, ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΡ нСстандартный ластик, ΡƒΠ΄Π°Π»ΠΈΡ‚Π΅ Π½Π΅ΠΊΠΎΡ‚ΠΎΡ€Ρ‹Π΅ участки полос. НаконСц, Π΄ΠΎΠ±Π°Π²ΡŒΡ‚Π΅ Ρ‚Π΅Π½ΡŒ ΠΊ ΠΊΠ°ΠΆΠ΄ΠΎΠΉ полосС. Когда Π²Ρ‹ Π·Π°ΠΊΠΎΠ½Ρ‡ΠΈΡ‚Π΅ с ΠΏΠ»Π΅Π½ΠΊΠΎΠΉ, Π²ΡΡ‚Π°Π²ΡŒΡ‚Π΅ любоС ΠΈΠ·ΠΎΠ±Ρ€Π°ΠΆΠ΅Π½ΠΈΠ΅ ΠΏΠΎΠ΄ слоями ΠΏΠ»Π΅Π½ΠΊΠΈ. Π― добавляю Ρ„ΠΎΡ‚ΠΎΠ³Ρ€Π°Ρ„ΠΈΡŽ ΠΎΠ΄Π½ΠΎΠ³ΠΎ ΠΈΠ· своих ΠΏΡƒΡ‚Π΅ΡˆΠ΅ΡΡ‚Π²ΠΈΠΉ. НаконСц, ΠΏΡ€ΠΈΠΌΠ΅Π½ΠΈΡ‚Π΅ ΠΊ этому ΠΈΠ·ΠΎΠ±Ρ€Π°ΠΆΠ΅Π½ΠΈΡŽ эффСкт ΠΎΠ±Π²ΠΎΠ΄ΠΊΠΈ (# 2F261D).

Π¨Π°Π³ 25:

НарисуйтС ΠΊΡ€Π°ΡΠ½ΡƒΡŽ линию Ρ€Π°Π·ΠΌΠ΅Ρ€ΠΎΠΌ 2 пиксСля ΠΏΠΎΠ΄ сообщСниСм ΠΈ Π½Π΅ΠΌΠ½ΠΎΠ³ΠΎ тСкста для ΠΊΠΎΠΌΠΌΠ΅Π½Ρ‚Π°Ρ€ΠΈΠ΅Π². РСкомСндуСтся Π΄ΠΎΠ±Π°Π²ΠΈΡ‚ΡŒ всС слои, связанныС с ΠΏΡƒΠ±Π»ΠΈΠΊΠ°Ρ†ΠΈΠ΅ΠΉ, Π² Π½ΠΎΠ²ΡƒΡŽ ΠΏΠ°ΠΏΠΊΡƒ ΠΏΠΎΠ΄ Π½Π°Π·Π²Π°Π½ΠΈΠ΅ΠΌ Β«Π‘ΠΎΠΎΠ±Ρ‰Π΅Π½ΠΈΠ΅Β». Π—Π°Ρ‚Π΅ΠΌ Π½Π΅ΠΌΠ½ΠΎΠ³ΠΎ ΡƒΠ²Π΅Π»ΠΈΡ‡ΡŒΡ‚Π΅ высоту Π΄ΠΎΠΊΡƒΠΌΠ΅Π½Ρ‚Π°, Π²Ρ‹ ΠΌΠΎΠΆΠ΅Ρ‚Π΅ ΡΠ΄Π΅Π»Π°Ρ‚ΡŒ это с ΠΏΠΎΠΌΠΎΡ‰ΡŒΡŽ инструмСнта Β«ΠžΠ±Ρ€Π΅Π·ΠΊΠ°Β», просто Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΠΏΠΎΡΠΌΠΎΡ‚Ρ€Π΅Ρ‚ΡŒ, ΠΊΠ°ΠΊ Π±ΡƒΠ΄Π΅Ρ‚ Π²Ρ‹Π³Π»ΡΠ΄Π΅Ρ‚ΡŒ наш Π΄ΠΈΠ·Π°ΠΉΠ½, Ссли Π½Π° Π½Π΅ΠΌ Π΅ΡΡ‚ΡŒ Π΄Π²Π΅ ΠΈΠ»ΠΈ Ρ‚Ρ€ΠΈ ΠΏΡƒΠ±Π»ΠΈΠΊΠ°Ρ†ΠΈΠΈ.Π”ΡƒΠ±Π»ΠΈΡ€ΡƒΠΉΡ‚Π΅ Π³Ρ€ΡƒΠΏΠΏΡƒ Β«ΠŸΠΎΡΡ‚Β» ΠΈ ΠΈΠ·ΠΌΠ΅Π½ΠΈΡ‚Π΅ тСкст ΠΈ ΠΈΠ·ΠΎΠ±Ρ€Π°ΠΆΠ΅Π½ΠΈΠ΅, ΠΊΠ°ΠΊ ΠΏΠΎΠΊΠ°Π·Π°Π½ΠΎ Π½ΠΈΠΆΠ΅.

Π¨Π°Π³ 26:

На самом Π΄Π΅Π»Π΅ всС выглядит Π½Π΅ΠΏΠ»ΠΎΡ…ΠΎ, Ρ‚Π΅ΠΏΠ΅Ρ€ΡŒ Π΄ΠΎΠ±Π°Π²ΡŒΡ‚Π΅ Π·Π°Π³ΠΎΠ»ΠΎΠ²ΠΊΠΈ элСмСнтов Π±ΠΎΠΊΠΎΠ²ΠΎΠΉ ΠΏΠ°Π½Π΅Π»ΠΈ. Π’Ρ‹ Ρ‚Π°ΠΊΠΆΠ΅ ΠΌΠΎΠΆΠ΅Ρ‚Π΅ ΡΠΎΠ·Π΄Π°Ρ‚ΡŒ ΠΏΠ°ΠΏΠΊΡƒ для ΠΊΠ°ΠΆΠ΄ΠΎΠ³ΠΎ элСмСнта.

Π¨Π°Π³ 27:

Π’Π΅ΠΏΠ΅Ρ€ΡŒ Π΄ΠΎΠ±Π°Π²ΡŒΡ‚Π΅ Π·Π½Π°Ρ‡ΠΎΠΊ списка. Π’Ρ‹ ΠΌΠΎΠΆΠ΅Ρ‚Π΅ ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚ΡŒ Π»ΡŽΠ±ΡƒΡŽ ΠΏΡ€ΠΎΠΈΠ·Π²ΠΎΠ»ΡŒΠ½ΡƒΡŽ Ρ„ΠΎΡ€ΠΌΡƒ. Π”ΠΎΠ±Π°Π²ΡŒΡ‚Π΅ случайный тСкст, я ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΡŽ Π“Ρ€ΡƒΠ·ΠΈΡŽ для Π±ΠΎΠΊΠΎΠ²ΠΎΠΉ ΠΏΠ°Π½Π΅Π»ΠΈ. Π”ΡƒΠ±Π»ΠΈΡ€ΡƒΠΉΡ‚Π΅ Π·Π½Π°Ρ‡ΠΊΠΈ ΠΈ ΠΎΡ‚Ρ€Π΅Π΄Π°ΠΊΡ‚ΠΈΡ€ΡƒΠΉΡ‚Π΅ ΠΎΠ΄ΠΈΠ½, Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΠΎΡ‚ΠΎΠ±Ρ€Π°Π·ΠΈΡ‚ΡŒ состояниС навСдСния. Π‘Π΄Π΅Π»Π°ΠΉΡ‚Π΅ Ρ‚ΠΎ ΠΆΠ΅ самоС для ΠΊΠ°ΠΆΠ΄ΠΎΠ³ΠΎ элСмСнта Π±ΠΎΠΊΠΎΠ²ΠΎΠΉ ΠΏΠ°Π½Π΅Π»ΠΈ.

Π¨Π°Π³ 28:

ΠœΡ‹ ΠΏΠΎΡ‡Ρ‚ΠΈ Π·Π°ΠΊΠΎΠ½Ρ‡ΠΈΠ»ΠΈ. Π”ΠΎΠ±Π°Π²ΡŒΡ‚Π΅ Π½Π΅ΠΌΠ½ΠΎΠ³ΠΎ Π³Ρ€Π°Π½ΠΆΠ΅Π²Ρ‹Ρ… Π΄Π΅Ρ‚Π°Π»Π΅ΠΉ Π²Π½ΠΈΠ·Ρƒ Π±ΠΎΠΊΠΎΠ²ΠΎΠΉ ΠΏΠ°Π½Π΅Π»ΠΈ, Π΄ΠΎΠ±Π°Π²ΠΈΠ² нСсколько Π³Ρ€Π°Π½ΠΆΠ΅Π²Ρ‹Ρ… кистСй Π½Π° Π½ΠΎΠ²Ρ‹ΠΉ слой Π½Π°Π΄ Ρ„ΠΎΠ½ΠΎΠ²Ρ‹ΠΌ слоСм Π±ΠΎΠΊΠΎΠ²ΠΎΠΉ ΠΏΠ°Π½Π΅Π»ΠΈ. Π’Ρ‹Π±Π΅Ρ€ΠΈΡ‚Π΅ Ρ„ΠΎΠ½ΠΎΠ²Ρ‹ΠΉ слой Π±ΠΎΠΊΠΎΠ²ΠΎΠΉ ΠΏΠ°Π½Π΅Π»ΠΈ, Π·Π°Ρ‚Π΅ΠΌ Π²Ρ‹Π±Π΅Ρ€ΠΈΡ‚Π΅ Β«Π‘Π»ΠΎΠΉΒ»> «Маска слоя»> Β«ΠŸΠΎΠΊΠ°Π·Π°Ρ‚ΡŒ всС». Π—Π°Ρ‚Π΅ΠΌ скройтС Π½Π΅ΠΊΠΎΡ‚ΠΎΡ€Ρ‹Π΅ области Π² Π»Π΅Π²ΠΎΠΌ Π½ΠΈΠΆΠ½Π΅ΠΌ ΡƒΠ³Π»Ρƒ Ρ„ΠΎΠ½Π° Π±ΠΎΠΊΠΎΠ²ΠΎΠΉ ΠΏΠ°Π½Π΅Π»ΠΈ с ΠΏΠΎΠΌΠΎΡ‰ΡŒΡŽ Π½Π΅ΠΏΡ€Π°Π²ΠΈΠ»ΡŒΠ½ΠΎΠΉ Ρ‡Π΅Ρ€Π½ΠΎΠΉ кисти.

Π¨Π°Π³ 29:

НаконСц, Π²Ρ‹Π±Π΅Ρ€ΠΈΡ‚Π΅ Ρ„ΠΎΠ½ΠΎΠ²Ρ‹ΠΉ слой Π±ΠΎΠΊΠΎΠ²ΠΎΠΉ ΠΏΠ°Π½Π΅Π»ΠΈ ΠΈ скопируйтС Π΅Π³ΠΎ ΡΡ‚ΠΈΠ»ΡŒ.НарисуйтС ΠΏΡ€ΡΠΌΠΎΡƒΠ³ΠΎΠ»ΡŒΠ½ΠΈΠΊ Π²Π½ΠΈΠ·Ρƒ Π΄ΠΈΠ·Π°ΠΉΠ½Π° Π²Π½ΡƒΡ‚Ρ€ΠΈ ΠΏΠ°ΠΏΠΊΠΈ «НиТний ΠΊΠΎΠ»ΠΎΠ½Ρ‚ΠΈΡ‚ΡƒΠ»Β» ΠΈ Π²ΡΡ‚Π°Π²ΡŒΡ‚Π΅ Π² Π½Π΅Π³ΠΎ ΡΡ‚ΠΈΠ»ΡŒ слоя. Π—Π°Ρ‚Π΅ΠΌ ΠΈΠ·Π²Π»Π΅ΠΊΠΈΡ‚Π΅ ΠΈ Π²ΡΡ‚Π°Π²ΡŒΡ‚Π΅ это ΠΈΠ·ΠΎΠ±Ρ€Π°ΠΆΠ΅Π½ΠΈΠ΅ Π½Π°Π΄ Ρ„ΠΎΠ½ΠΎΠΌ Π½ΠΈΠΆΠ½Π΅Π³ΠΎ ΠΊΠΎΠ»ΠΎΠ½Ρ‚ΠΈΡ‚ΡƒΠ»Π°.

ΠžΡ‚Ρ€Π΅Π³ΡƒΠ»ΠΈΡ€ΡƒΠΉΡ‚Π΅ Π½Π°ΡΡ‹Ρ‰Π΅Π½Π½ΠΎΡΡ‚ΡŒ, Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΡΠ΄Π΅Π»Π°Ρ‚ΡŒ Π΅Π³ΠΎ Π½Π΅ΠΌΠ½ΠΎΠ³ΠΎ Π±ΠΎΠ»Π΅Π΅ сСрым. ΠšΡ€ΠΎΠΌΠ΅ Ρ‚ΠΎΠ³ΠΎ, Π²Ρ‹ ΠΌΠΎΠΆΠ΅Ρ‚Π΅ нанСсти Π½Π° этот лист Π±ΡƒΠΌΠ°Π³ΠΈ ΠΏΠ°Π΄Π°ΡŽΡ‰ΡƒΡŽ Ρ‚Π΅Π½ΡŒ, повторяя Ρ‚Π΅Ρ…Π½ΠΈΠΊΡƒ шага 10. Π”ΠΎΠ±Π°Π²ΡŒΡ‚Π΅ тСкст ΠΏΠΎΠ²Π΅Ρ€Ρ… листа Π±ΡƒΠΌΠ°Π³ΠΈ, Π²ΠΎΠ·ΠΌΠΎΠΆΠ½ΠΎ, слоган ΠΈΠ»ΠΈ Ρ‡Ρ‚ΠΎ-Ρ‚ΠΎ Π² этом Ρ€ΠΎΠ΄Π΅. А Ρ‚Π°ΠΊΠΆΠ΅ Π΄ΠΎΠ±Π°Π²ΡŒΡ‚Π΅ тСкст Π½ΠΈΠΆΠ½Π΅Π³ΠΎ ΠΊΠΎΠ»ΠΎΠ½Ρ‚ΠΈΡ‚ΡƒΠ»Π°, Π½Π°ΠΏΡ€ΠΈΠΌΠ΅Ρ€ панСль быстрой Π½Π°Π²ΠΈΠ³Π°Ρ†ΠΈΠΈ, ΠΈ ΠΈΠ½Ρ„ΠΎΡ€ΠΌΠ°Ρ†ΠΈΡŽ ΠΎΠ± авторских ΠΏΡ€Π°Π²Π°Ρ….

ΠžΠΊΠΎΠ½Ρ‡Π°Ρ‚Π΅Π»ΡŒΠ½Ρ‹ΠΉ Ρ€Π΅Π·ΡƒΠ»ΡŒΡ‚Π°Ρ‚:

НадСюсь, Π²Ρ‹ смоТСтС ΡƒΠ·Π½Π°Ρ‚ΡŒ Ρ‡Ρ‚ΠΎ-Ρ‚ΠΎ Π½ΠΎΠ²ΠΎΠ΅ ΠΈΠ· этого руководства.

Π― ΠΎΡ‡Π΅Π½ΡŒ Ρ€Π°Π΄, Ссли Π²Ρ‹ оставитС ΠΌΠ½Π΅ ΠΎΡ‚Π·Ρ‹Π² Ρ‡Π΅Ρ€Π΅Π· ΠΊΠΎΠΌΠΌΠ΅Π½Ρ‚Π°Ρ€ΠΈΠΉ Π½ΠΈΠΆΠ΅. Π‘ΠΊΠΎΡ€ΠΎ я ΡΠΎΠ±ΠΈΡ€Π°ΡŽΡΡŒ ΠΏΠΎΠΊΠ°Π·Π°Ρ‚ΡŒ большС интСрСсных ΠΈ новаторских руководств, поэтому, поТалуйста, ΠΏΡ€ΠΎΠ΄ΠΎΠ»ΠΆΠ°ΠΉΡ‚Π΅ ΠΏΠΎΡΠ΅Ρ‰Π°Ρ‚ΡŒ наш Π±Π»ΠΎΠ³. Π­Ρ‚ΠΎ ΠΏΠΎΠΊΠ°.

Π£Π΄Π°Ρ‡ΠΈ!

Бсылка: psd.tutsplus

Π‘ΠΎΠ·Π΄Π°Π½ΠΈΠ΅ ΠΌΠ°ΠΊΠ΅Ρ‚Π° для нСкоммСрчСской ΠΎΡ€Π³Π°Π½ΠΈΠ·Π°Ρ†ΠΈΠΈ Π² Photoshop

Π’ этом ΡƒΡ€ΠΎΠΊΠ΅ ΠΌΡ‹ создадим ΠΌΠ°ΠΊΠ΅Ρ‚ домашнСй страницы Π²Ρ‹ΠΌΡ‹ΡˆΠ»Π΅Π½Π½ΠΎΠΉ нСкоммСрчСской ΠΎΡ€Π³Π°Π½ΠΈΠ·Π°Ρ†ΠΈΠΈ. МногиС нСкоммСрчСскиС ΠΈ Π±Π»Π°Π³ΠΎΡ‚Π²ΠΎΡ€ΠΈΡ‚Π΅Π»ΡŒΠ½Ρ‹Π΅ ΠΎΡ€Π³Π°Π½ΠΈΠ·Π°Ρ†ΠΈΠΈ Ρ€Π°Π·Π΄Π΅Π»ΡΡŽΡ‚ схоТиС потрСбности Π² Π²Π΅Π±-сайтах, Π²ΠΊΠ»ΡŽΡ‡Π°Ρ ΠΈΠ½Ρ„ΠΎΡ€ΠΌΠ°Ρ†ΠΈΡŽ ΠΎΠ± истории, цСлях ΠΈ Π΄Π΅ΡΡ‚Π΅Π»ΡŒΠ½ΠΎΡΡ‚ΠΈ ΠΎΡ€Π³Π°Π½ΠΈΠ·Π°Ρ†ΠΈΠΈ, Π° Ρ‚Π°ΠΊΠΆΠ΅ способ ΠΏΠΎΠ΄Π΄Π΅Ρ€ΠΆΠΈΠ²Π°Ρ‚ΡŒ связь со сторонниками ΠΈ Π΄ΠΎΠ½ΠΎΡ€Π°ΠΌΠΈ ΠΈ ΠΏΡ€Π΅Π΄ΠΎΡΡ‚Π°Π²Π»ΡΡ‚ΡŒ ΠΎΡ€Π³Π°Π½ΠΈΠ·Π°Ρ†ΠΈΠΈ Π»ΠΈΡ†ΠΎ. Π½ΠΎΠ²Ρ‹ΠΌ посСтитСлям.

Π’ΠΎΡ‚ ΠΊΠΎΠ½Π΅Ρ‡Π½Ρ‹ΠΉ Ρ€Π΅Π·ΡƒΠ»ΡŒΡ‚Π°Ρ‚ Ρ‚ΠΎΠ³ΠΎ, Ρ‡Ρ‚ΠΎ ΠΌΡ‹ Π±ΡƒΠ΄Π΅ΠΌ ΡΠΎΠ·Π΄Π°Π²Π°Ρ‚ΡŒ (Ρ‰Π΅Π»ΠΊΠ½ΠΈΡ‚Π΅ ΠΈΠ·ΠΎΠ±Ρ€Π°ΠΆΠ΅Π½ΠΈΠ΅, Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΡƒΠ²ΠΈΠ΄Π΅Ρ‚ΡŒ Π΅Π³ΠΎ Π² ΠΏΠΎΠ»Π½ΠΎΠΌ Ρ€Π°Π·ΠΌΠ΅Ρ€Π΅)

Π¨Π°Π³ 1. Π‘ΠΎΠ·Π΄Π°Π½ΠΈΠ΅ Π½ΠΎΠ²ΠΎΠ³ΠΎ Π΄ΠΎΠΊΡƒΠΌΠ΅Π½Ρ‚Π°

ΠŸΠ΅Ρ€Π΅ΠΉΠ΄ΠΈΡ‚Π΅ Π² мСню Β«Π€Π°ΠΉΠ»Β»> Β«Π‘ΠΎΠ·Π΄Π°Ρ‚ΡŒΒ» ΠΈ создайтС Π½ΠΎΠ²Ρ‹ΠΉ Π΄ΠΎΠΊΡƒΠΌΠ΅Π½Ρ‚ ΡˆΠΈΡ€ΠΈΠ½ΠΎΠΉ 1600 пиксСлСй ΠΈ высотой 1200 пиксСлСй. Π‘Π°ΠΉΡ‚ Π±ΡƒΠ΄Π΅Ρ‚ ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚ΡŒ ΡˆΠΈΡ€ΠΈΠ½Ρƒ 960 пиксСлСй, Π½ΠΎ ΠΌΡ‹ собираСмся ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚ΡŒ Π΄ΠΎΠΏΠΎΠ»Π½ΠΈΡ‚Π΅Π»ΡŒΠ½ΠΎΠ΅ пространство ΠΏΠΎ Π±ΠΎΠΊΠ°ΠΌ, Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΡΠΌΠ΅ΡˆΠ°Ρ‚ΡŒ тСкстурированныС участки Π² сплошной Ρ†Π²Π΅Ρ‚.

Π¨Π°Π³ 2: Установка Ρ„ΠΎΠ½Π°

На Ρ„ΠΎΠ½ΠΎΠ²ΠΎΠΌ слоС установитС Π³ΠΎΡ€ΠΈΠ·ΠΎΠ½Ρ‚Π°Π»ΡŒΠ½ΡƒΡŽ Π½Π°ΠΏΡ€Π°Π²Π»ΡΡŽΡ‰ΡƒΡŽ (Β«Π’ΠΈΠ΄Β»> «Новая Π½Π°ΠΏΡ€Π°Π²Π»ΡΡŽΡ‰Π°ΡΒ») Π½Π° 520 пиксСлСй, Π²Ρ‹Π±Π΅Ρ€ΠΈΡ‚Π΅ всС, Ρ‡Ρ‚ΠΎ находится Π½Π°Π΄ этой Π»ΠΈΠ½ΠΈΠ΅ΠΉ, ΠΈ с ΠΏΠΎΠΌΠΎΡ‰ΡŒΡŽ инструмСнта Β«Π’Π΅Π΄Ρ€ΠΎ с краской» Π·Π°Π΄Π°ΠΉΡ‚Π΅ Ρ†Π²Π΅Ρ‚ # b48c61.Π—Π°Ρ‚Π΅ΠΌ с ΠΏΠΎΠΌΠΎΡ‰ΡŒΡŽ инструмСнта Β«Π’Π΅Π΄Ρ€ΠΎ с краской» сдСлайтС всС, Ρ‡Ρ‚ΠΎ находится Π½ΠΈΠΆΠ΅ Π½Π°ΠΏΡ€Π°Π²Π»ΡΡŽΡ‰Π΅ΠΉ, Π±ΠΎΠ»Π΅Π΅ Ρ‚Π΅ΠΌΠ½ΠΎ-ΠΊΠΎΡ€ΠΈΡ‡Π½Π΅Π²ΠΎΠ³ΠΎ Ρ†Π²Π΅Ρ‚Π°. Π― ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΡŽ # 312517.

НарисуйтС Π΅Ρ‰Π΅ ΠΎΠ΄Π½Ρƒ Π³ΠΎΡ€ΠΈΠ·ΠΎΠ½Ρ‚Π°Π»ΡŒΠ½ΡƒΡŽ Π½Π°ΠΏΡ€Π°Π²Π»ΡΡŽΡ‰ΡƒΡŽ Π½Π° 80 пиксСлСй ΠΈ Π·Π°Π»Π΅ΠΉΡ‚Π΅ всС Π²Ρ‹ΡˆΠ΅ этой Π»ΠΈΠ½ΠΈΠΈ Ρ†Π²Π΅Ρ‚ΠΎΠΌ # 312517. Π’Π΅ΠΏΠ΅Ρ€ΡŒ Ρƒ вас Π΄ΠΎΠ»ΠΆΠ΅Π½ Π±Ρ‹Ρ‚ΡŒ Ρ„ΠΎΠ½, ΠΊΠΎΡ‚ΠΎΡ€Ρ‹ΠΉ выглядит Ρ‚Π°ΠΊ:

Π¨Π°Π³ 3: Π”ΠΎΠ±Π°Π²ΡŒΡ‚Π΅ тСкстуру

Π‘Ρ€Π΅Π΄Π½Π΅ΠΉ области Π±ΠΎΠ»Π΅Π΅ свСтлого Ρ†Π²Π΅Ρ‚Π° Π±ΡƒΠ΄Π΅Ρ‚ ΠΏΡ€ΠΈΠ΄Π°Π½Π° тСкстура, ΠΈ я просто Π±ΡƒΠ΄Ρƒ ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚ΡŒ Π΄Π²Π΅ Ρ„ΠΎΡ‚ΠΎΠ³Ρ€Π°Ρ„ΠΈΠΈ для достиТСния тСкстуры. ΠŸΠ΅Ρ€Π²Ρ‹ΠΉ Π±Ρ‹Π» Ρ‡Π°ΡΡ‚ΡŒΡŽ ΠΏΠ°ΠΊΠ΅Ρ‚Π° тСкстур Π±Π΅Ρ‚ΠΎΠ½Π° ΠΈ Π΄ΠΎΡ€ΠΎΠΆΠ½ΠΎΠ³ΠΎ покрытия, ΠΊΠΎΡ‚ΠΎΡ€Ρ‹ΠΉ Π±Ρ‹Π» Π²Ρ‹ΠΏΡƒΡ‰Π΅Π½ здСсь ΠΎΠΊΠΎΠ»ΠΎ мСсяца Π½Π°Π·Π°Π΄.Π’Ρ‹ Ρ‚Π°ΠΊΠΆΠ΅ ΠΌΠΎΠΆΠ΅Ρ‚Π΅ ΠΏΠΎΠ»ΡƒΡ‡ΠΈΡ‚ΡŒ это ΠΈΠ·ΠΎΠ±Ρ€Π°ΠΆΠ΅Π½ΠΈΠ΅ с Flickr. Вторая фотография, ΠΊΠΎΡ‚ΠΎΡ€ΡƒΡŽ я ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΡŽ, — это фотография тСкстуры Π·Π΅ΠΌΠ»ΠΈ, ΠΊΠΎΡ‚ΠΎΡ€ΡƒΡŽ я сдСлал Π½Π΅Π΄Π°Π²Π½ΠΎ. Π’Ρ‹ ΠΌΠΎΠΆΠ΅Ρ‚Π΅ ΠΏΠΎΠ»ΡƒΡ‡ΠΈΡ‚ΡŒ это Ρ„ΠΎΡ‚ΠΎ здСсь.

Π’ΠΎΡ‚ ΠΏΡ€Π΅Π΄Π²Π°Ρ€ΠΈΡ‚Π΅Π»ΡŒΠ½Ρ‹ΠΉ просмотр Π΄Π²ΡƒΡ… ΠΈΠ·ΠΎΠ±Ρ€Π°ΠΆΠ΅Π½ΠΈΠΉ, ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠ΅ΠΌΡ‹Ρ… для тСкстуры:

ΠžΠ±Π»Π°ΡΡ‚ΡŒ, ΠΊΠΎΡ‚ΠΎΡ€ΡƒΡŽ ΠΌΡ‹ заполняСм тСкстурой, ΠΈΠΌΠ΅Π΅Ρ‚ ΡˆΠΈΡ€ΠΈΠ½Ρƒ 1600 пиксСлСй ΠΈ высоту 440 пиксСлСй, поэтому я Π²Ρ‹Π±ΠΈΡ€Π°ΡŽ Π²Ρ‹Ρ€Π΅Π·Π°Ρ‚ΡŒ Ρ‡Π°ΡΡ‚ΡŒ Ρ‚Π°ΠΊΠΎΠ³ΠΎ Ρ€Π°Π·ΠΌΠ΅Ρ€Π° Π½Π° ΠΊΠ°ΠΆΠ΄ΠΎΠΉ Ρ„ΠΎΡ‚ΠΎΠ³Ρ€Π°Ρ„ΠΈΠΈ, ΠΏΡ€Π΅ΠΆΠ΄Π΅ Ρ‡Π΅ΠΌ Π²ΡΡ‚Π°Π²Π»ΡΡ‚ΡŒ Π΅Π΅ Π² Π΄ΠΎΠΊΡƒΠΌΠ΅Π½Ρ‚. Когда Ρƒ вас Π΅ΡΡ‚ΡŒ тСкстуры Π½ΡƒΠΆΠ½ΠΎΠ³ΠΎ Ρ€Π°Π·ΠΌΠ΅Ρ€Π°, скопируйтС ΠΏΠ΅Ρ€Π²ΡƒΡŽ, Π²Ρ‹Π΄Π΅Π»ΠΈΡ‚Π΅ ΠΎΠ±Π»Π°ΡΡ‚ΡŒ ΠΌΠ΅ΠΆΠ΄Ρƒ Π½Π°ΠΏΡ€Π°Π²Π»ΡΡŽΡ‰ΠΈΠΌΠΈ Π½Π° 80 ΠΈ 520 пиксСлСй с ΠΏΠΎΠΌΠΎΡ‰ΡŒΡŽ инструмСнта ΠΏΡ€ΡΠΌΠΎΡƒΠ³ΠΎΠ»ΡŒΠ½ΠΎΠΉ области ΠΈ Π²ΡΡ‚Π°Π²ΡŒΡ‚Π΅ тСкстуру Π² Π²Ρ‹Π±Ρ€Π°Π½Π½ΡƒΡŽ ΠΎΠ±Π»Π°ΡΡ‚ΡŒ.

Π—Π°Ρ‚Π΅ΠΌ Π²Ρ‹Π·ΠΎΠ²ΠΈΡ‚Π΅ ΠΏΠ°Ρ€Π°ΠΌΠ΅Ρ‚Ρ€Ρ‹ стилСй слоя, Π΄Π²Π°ΠΆΠ΄Ρ‹ Ρ‰Π΅Π»ΠΊΠ½ΡƒΠ² слой Π² ΠΏΠ°Π»ΠΈΡ‚Ρ€Π΅ слоСв, Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΠΌΡ‹ ΠΌΠΎΠ³Π»ΠΈ Π½Π°ΡΡ‚Ρ€ΠΎΠΈΡ‚ΡŒ ΠΏΠ°Ρ€Π°ΠΌΠ΅Ρ‚Ρ€Ρ‹ налоТСния (ΠΈΠ»ΠΈ, Π²Ρ‹Π±Ρ€Π°Π² слой, ΠΏΠ΅Ρ€Π΅ΠΉΠ΄ΠΈΡ‚Π΅ Π² Π‘Π»ΠΎΠΉ> Π‘Ρ‚ΠΈΠ»ΡŒ слоя> ΠŸΠ°Ρ€Π°ΠΌΠ΅Ρ‚Ρ€Ρ‹ налоТСния). УстановитС Ρ€Π΅ΠΆΠΈΠΌ налоТСния Π½Π° Β«Π½Π°Π»ΠΎΠΆΠ΅Π½ΠΈΠ΅Β» ΠΈ установитС Π½Π΅ΠΏΡ€ΠΎΠ·Ρ€Π°Ρ‡Π½ΠΎΡΡ‚ΡŒ Π½Π° 60%.

Π—Π°Ρ‚Π΅ΠΌ ΠΏΠΎΠ²Ρ‚ΠΎΡ€ΠΈΡ‚Π΅ процСсс, Ρ‡Ρ‚ΠΎΠ±Ρ‹ Π²ΡΡ‚Π°Π²ΠΈΡ‚ΡŒ Π²Ρ‚ΠΎΡ€ΡƒΡŽ тСкстуру Π² Ρ‚Ρƒ ΠΆΠ΅ ΠΎΠ±Π»Π°ΡΡ‚ΡŒ. ΠŸΠΎΠ΄Π½ΠΈΠΌΠΈΡ‚Π΅ ΠΏΠ°Ρ€Π°ΠΌΠ΅Ρ‚Ρ€Ρ‹ стиля слоя Π½Π° этом слоС, установитС Ρ€Π΅ΠΆΠΈΠΌ налоТСния Β«Π½Π°Π»ΠΎΠΆΠ΅Π½ΠΈΠ΅Β» ΠΈ Π½Π° этот Ρ€Π°Π· ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠΉΡ‚Π΅ Π½Π΅ΠΏΡ€ΠΎΠ·Ρ€Π°Ρ‡Π½ΠΎΡΡ‚ΡŒ 40%.Π£ вас Π΄ΠΎΠ»ΠΆΠ½ΠΎ ΠΏΠΎΠ»ΡƒΡ‡ΠΈΡ‚ΡŒΡΡ Ρ‡Ρ‚ΠΎ-Ρ‚ΠΎ Π²Ρ€ΠΎΠ΄Π΅ этого:

Π’Π΅ΠΏΠ΅Ρ€ΡŒ тСкстура установлСна, Π½ΠΎ ΠΎΠ½Π° Ρ€Π΅Π·ΠΊΠΎ обрываСтся ΠΏΠΎ Π±ΠΎΠΊΠ°ΠΌ Π½Π° Π»ΡŽΠ±Ρ‹Ρ… ΡˆΠΈΡ€ΠΎΠΊΠΎΡΠΊΡ€Π°Π½Π½Ρ‹Ρ… ΠΌΠΎΠ½ΠΈΡ‚ΠΎΡ€Π°Ρ… с ΡˆΠΈΡ€ΠΈΠ½ΠΎΠΉ Π±ΠΎΠ»Π΅Π΅ 1600 пиксСлСй. Π― ΡΠΎΠ±ΠΈΡ€Π°ΡŽΡΡŒ ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚ΡŒ Π³Ρ€Π°Π΄ΠΈΠ΅Π½Ρ‚, Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΡΠΌΠ΅ΡˆΠ°Ρ‚ΡŒ тСкстуру с ΠΎΠ΄Π½ΠΎΡ‚ΠΎΠ½Π½Ρ‹ΠΌ Ρ†Π²Π΅Ρ‚ΠΎΠΌ, Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚Π΅Π»ΠΈ ΡˆΠΈΡ€ΠΎΠΊΠΎΡΠΊΡ€Π°Π½Π½ΠΎΠ³ΠΎ изобраТСния Π²ΠΈΠ΄Π΅Π»ΠΈ Π³ΠΎΡ€ΠΈΠ·ΠΎΠ½Ρ‚Π°Π»ΡŒΠ½Ρ‹Π΅ полосы, Π° тСкстура Π±ΡƒΠ΄Π΅Ρ‚ Ρ‚ΠΎΠ»ΡŒΠΊΠΎ посСрСдинС. Π‘ΠΎΠ·Π΄Π°ΠΉΡ‚Π΅ Π½ΠΎΠ²Ρ‹ΠΉ слой ΠΏΠΎΠ²Π΅Ρ€Ρ… ΠΎΡΡ‚Π°Π»ΡŒΠ½Ρ‹Ρ… ΠΈ установитС Ρ†Π²Π΅Ρ‚ ΠΏΠ΅Ρ€Π΅Π΄Π½Π΅Π³ΠΎ ΠΏΠ»Π°Π½Π° Π½Π° # b48c61 (Π±ΠΎΠ»Π΅Π΅ свСтлый ΠΊΠΎΡ€ΠΈΡ‡Π½Π΅Π²Ρ‹ΠΉ Ρ†Π²Π΅Ρ‚, ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠ΅ΠΌΡ‹ΠΉ Π½Π° Ρ„ΠΎΠ½ΠΎΠ²ΠΎΠΌ слоС).Π’Ρ‹Π±Π΅Ρ€ΠΈΡ‚Π΅ инструмСнт Π³Ρ€Π°Π΄ΠΈΠ΅Π½Ρ‚Π° ΠΈ Π²Ρ‹Π±Π΅Ρ€ΠΈΡ‚Π΅ Π»ΠΈΠ½Π΅ΠΉΠ½Ρ‹ΠΉ Π³Ρ€Π°Π΄ΠΈΠ΅Π½Ρ‚. Π—Π°Ρ‚Π΅ΠΌ Π²Ρ‹Π±Π΅Ρ€ΠΈΡ‚Π΅ Π³Ρ€Π°Π΄ΠΈΠ΅Π½Ρ‚, ΠΊΠΎΡ‚ΠΎΡ€Ρ‹ΠΉ ΠΈΠ΄Π΅Ρ‚ ΠΎΡ‚ Ρ†Π²Π΅Ρ‚Π° ΠΏΠ΅Ρ€Π΅Π΄Π½Π΅Π³ΠΎ ΠΏΠ»Π°Π½Π° ΠΊ прозрачности.

Π§Ρ‚ΠΎΠ±Ρ‹ ΠΏΡ€ΠΈΠΌΠ΅Π½ΠΈΡ‚ΡŒ Π³Ρ€Π°Π΄ΠΈΠ΅Π½Ρ‚, ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠΉΡ‚Π΅ ΠΏΡ€ΡΠΌΠΎΡƒΠ³ΠΎΠ»ΡŒΠ½ΡƒΡŽ Ρ€Π°ΠΌΠΊΡƒ, Ρ‡Ρ‚ΠΎΠ±Ρ‹ Π²Ρ‹Π±Ρ€Π°Ρ‚ΡŒ Ρ‚Π΅ΠΊΡΡ‚ΡƒΡ€ΠΈΡ€ΠΎΠ²Π°Π½Π½ΡƒΡŽ ΠΎΠ±Π»Π°ΡΡ‚ΡŒ (Ссли ΠΎΠ½Π° Π΅Ρ‰Π΅ Π½Π΅ Π²Ρ‹Π±Ρ€Π°Π½Π°), Ρ‰Π΅Π»ΠΊΠ½ΠΈΡ‚Π΅ ΠΏΠΎ Π»Π΅Π²ΠΎΠΌΡƒ ΠΊΡ€Π°ΡŽ, ΡƒΠ΄Π΅Ρ€ΠΆΠΈΠ²Π°ΠΉΡ‚Π΅ Π½Π°ΠΆΠ°Ρ‚ΠΎΠΉ ΠΊΠ»Π°Π²ΠΈΡˆΡƒ Shift ΠΈ ΠΏΠ΅Ρ€Π΅Ρ‚Π°Ρ‰ΠΈΡ‚Π΅ Π΅Π΅ ΠΏΡ€ΠΈΠΌΠ΅Ρ€Π½ΠΎ Π΄ΠΎ ΠΎΡ‚ΠΌΠ΅Ρ‚ΠΊΠΈ 300 пиксСлСй (Ссли Ρƒ вас Π½Π΅ ΠΏΠΎΠ²Π΅Ρ€Π½ΡƒΡ‚Ρ‹ Π»ΠΈΠ½Π΅ΠΉΠΊΠΈ Π½Π°, ΠΏΠ΅Ρ€Π΅ΠΉΠ΄ΠΈΡ‚Π΅ Π² ΠŸΡ€ΠΎΡΠΌΠΎΡ‚Ρ€> Π›ΠΈΠ½Π΅ΠΉΠΊΠΈ) ΠΈ отпуститС ΠΊΠ½ΠΎΠΏΠΊΡƒ ΠΌΡ‹ΡˆΠΈ.

Π—Π°Ρ‚Π΅ΠΌ создайтС Π΅Ρ‰Π΅ ΠΎΠ΄ΠΈΠ½ слой ΠΈ сдСлайтС Ρ‚ΠΎ ΠΆΠ΅ самоС с ΠΏΡ€Π°Π²ΠΎΠΉ стороны, ΠΏΡ€ΠΈΠ±Π»ΠΈΠ·ΠΈΠ²ΡˆΠΈΡΡŒ ΠΊ ΠΎΡ‚ΠΌΠ΅Ρ‚ΠΊΠ΅ 1300 пиксСлСй.

Π¨Π°Π³ 4: Π—Π°Π³ΠΎΠ»ΠΎΠ²ΠΎΠΊ

Π£ нашСго сайта Π±ΡƒΠ΄Π΅Ρ‚ простой Π·Π°Π³ΠΎΠ»ΠΎΠ²ΠΎΠΊ с Π½Π°Π·Π²Π°Π½ΠΈΠ΅ΠΌ Π²Ρ‹Π΄ΡƒΠΌΠ°Π½Π½ΠΎΠΉ ΠΎΡ€Π³Π°Π½ΠΈΠ·Π°Ρ†ΠΈΠΈ ΠΈ ΠΏΡ€ΠΈΠΌΠ΅Ρ€ слогана. Для Π½Π°Ρ‡Π°Π»Π° Π΄ΠΎΠ±Π°Π²ΡŒΡ‚Π΅ тСкст для Π·Π°Π³ΠΎΠ»ΠΎΠ²ΠΊΠ° ΠΈ выровняйтС Π΅Π³ΠΎ ΠΏΠΎ ΠΎΡ‚ΠΌΠ΅Ρ‚ΠΊΠ΅ 340 пиксСлСй, ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΡ Π²Π΅Ρ€Ρ‚ΠΈΠΊΠ°Π»ΡŒΠ½ΡƒΡŽ Π½Π°ΠΏΡ€Π°Π²Π»ΡΡŽΡ‰ΡƒΡŽ. Π― ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΡŽ ΡˆΡ€ΠΈΡ„Ρ‚ Bebas с Ρ€Π°Π·ΠΌΠ΅Ρ€ΠΎΠΌ 24 ΠΏΡƒΠ½ΠΊΡ‚ΠΎΠ², Ρ†Π²Π΅Ρ‚ΠΎΠΌ # fdebd7 ΠΈ Π½Π°Π±ΠΎΡ€ΠΎΠΌ эффСктов Ρ‚Π΅Π½ΠΈ # 000000, Π½Π΅ΠΏΡ€ΠΎΠ·Ρ€Π°Ρ‡Π½ΠΎΡΡ‚ΡŒΡŽ 75% ΠΈ 2 пиксСля для расстояния ΠΈ Ρ€Π°Π·ΠΌΠ΅Ρ€Π°.

Π—Π°Ρ‚Π΅ΠΌ я Π²Π²Π΅Π΄Ρƒ слоган справа ΠΎΡ‚ Π·Π°Π³ΠΎΠ»ΠΎΠ²ΠΊΠ° ΡˆΡ€ΠΈΡ„Ρ‚ΠΎΠΌ Arial 14 pt ΠΈ Ρ†Π²Π΅Ρ‚ΠΎΠΌ # 886f4f.На Π΄Π°Π½Π½Ρ‹ΠΉ ΠΌΠΎΠΌΠ΅Π½Ρ‚ это выглядит Ρ‚Π°ΠΊ:

Π¨Π°Π³ 5: МСню Π½Π°Π²ΠΈΠ³Π°Ρ†ΠΈΠΈ

Π― Π±ΡƒΠ΄Ρƒ ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚ΡŒ Π²Π΅Ρ€Ρ‚ΠΈΠΊΠ°Π»ΡŒΠ½ΠΎΠ΅ мСню Π½Π°Π²ΠΈΠ³Π°Ρ†ΠΈΠΈ сразу ΠΏΠΎΠ΄ Π·Π°Π³ΠΎΠ»ΠΎΠ²ΠΊΠΎΠΌ, ΠΊΠΎΡ‚ΠΎΡ€ΠΎΠ΅ Π±ΡƒΠ΄Π΅Ρ‚ Ρ€Π°ΡΠΏΠΎΠ»Π°Π³Π°Ρ‚ΡŒΡΡ ΠΏΠΎΠ²Π΅Ρ€Ρ… тСкстурированной области. МСню Π±ΡƒΠ΄Π΅Ρ‚ ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚ΡŒ Π½Π΅ΠΏΡ€ΠΎΠ·Ρ€Π°Ρ‡Π½ΠΎΡΡ‚ΡŒ, Ρ‡Ρ‚ΠΎΠ±Ρ‹ тСкстура ΠΏΡ€ΠΎΡΠΌΠ°Ρ‚Ρ€ΠΈΠ²Π°Π»Π°ΡΡŒ Ρ‡Π΅Ρ€Π΅Π· мСню. Π’Ρ‹ ΠΌΠΎΠΆΠ΅Ρ‚Π΅ ΡƒΡΡ‚Π°Π½ΠΎΠ²ΠΈΡ‚ΡŒ Π²Π΅Ρ€Ρ‚ΠΈΠΊΠ°Π»ΡŒΠ½Ρ‹Π΅ Π½Π°ΠΏΡ€Π°Π²Π»ΡΡŽΡ‰ΠΈΠ΅ Π½Π° 320 пиксСлСй ΠΈ 660 пиксСлСй, Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΠΊΠΎΠ½Ρ‚Ρ€ΠΎΠ»ΠΈΡ€ΠΎΠ²Π°Ρ‚ΡŒ ΡˆΠΈΡ€ΠΈΠ½Ρƒ мСню. Π˜ΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠΉΡ‚Π΅ инструмСнт ΠΏΡ€ΡΠΌΠΎΡƒΠ³ΠΎΠ»ΡŒΠ½ΠΎΠΉ области, Ρ‡Ρ‚ΠΎΠ±Ρ‹ Π²Ρ‹Π΄Π΅Π»ΠΈΡ‚ΡŒ ΠΎΠ±Π»Π°ΡΡ‚ΡŒ. Π—Π°Ρ‚Π΅ΠΌ установитС Ρ†Π²Π΅Ρ‚ ΠΏΠ΅Ρ€Π΅Π΄Π½Π΅Π³ΠΎ ΠΏΠ»Π°Π½Π° Π½Π° # 312517 (Ρ‚Π΅ΠΌΠ½ΠΎ-ΠΊΠΎΡ€ΠΈΡ‡Π½Π΅Π²Ρ‹ΠΉ, ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠ΅ΠΌΡ‹ΠΉ для Ρ„ΠΎΠ½Π°) ΠΈ Π²Ρ‹Π±Π΅Ρ€ΠΈΡ‚Π΅ инструмСнт Β«Π’Π΅Π΄Ρ€ΠΎ с краской».Π—Π°Ρ‚Π΅ΠΌ установитС Π½Π΅ΠΏΡ€ΠΎΠ·Ρ€Π°Ρ‡Π½ΠΎΡΡ‚ΡŒ Π½Π° 40% (Π²Ρ‹ ΠΌΠΎΠΆΠ΅Ρ‚Π΅ ΠΏΠΎΡΠΊΡΠΏΠ΅Ρ€ΠΈΠΌΠ΅Π½Ρ‚ΠΈΡ€ΠΎΠ²Π°Ρ‚ΡŒ с Ρ€Π°Π·Π½Ρ‹ΠΌΠΈ уровнями нСпрозрачности ΠΈ ΠΏΠΎΡΠΌΠΎΡ‚Ρ€Π΅Ρ‚ΡŒ, Ρ‡Ρ‚ΠΎ Π²Π°ΠΌ нравится).

Π’Π΅ΠΏΠ΅Ρ€ΡŒ Π²Ρ‹ ΠΌΠΎΠΆΠ΅Ρ‚Π΅ Π΄ΠΎΠ±Π°Π²ΠΈΡ‚ΡŒ Π±ΠΎΠΊΠΎΠ²Ρ‹Π΅ Π³Ρ€Π°Π½ΠΈΡ†Ρ‹ области Π½Π°Π²ΠΈΠ³Π°Ρ†ΠΈΠΈ, ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΡ Ρ†Π²Π΅Ρ‚ # 675138. Для этого я Π²Ρ‹Π±Ρ€Π°Π» инструмСнт Β«ΠšΠ°Ρ€Π°Π½Π΄Π°ΡˆΒ», Π²Ρ‹Π±Ρ€Π°Π» ΠΊΠ²Π°Π΄Ρ€Π°Ρ‚Π½ΡƒΡŽ ΠΊΠΈΡΡ‚ΡŒ ΠΈ установил ΡˆΠΈΡ€ΠΈΠ½Ρƒ 1 пиксСль. Π©Π΅Π»ΠΊΠ½ΠΈΡ‚Π΅ ΠΎΠ΄ΠΈΠ½ Ρ€Π°Π· Π² Ρ‚ΠΎΠΌ мСстС, Π³Π΄Π΅ Π²Ρ‹ Ρ…ΠΎΡ‚ΠΈΡ‚Π΅ Π½Π°Ρ‡Π°Ρ‚ΡŒ Π³Ρ€Π°Π½ΠΈΡ†Ρƒ. Π—Π°Ρ‚Π΅ΠΌ ΠΏΠ΅Ρ€Π΅ΠΌΠ΅ΡΡ‚ΠΈΡ‚Π΅ΡΡŒ Ρ‚ΡƒΠ΄Π°, Π³Π΄Π΅ ΠΎΠ½ Π΄ΠΎΠ»ΠΆΠ΅Π½ Π·Π°ΠΊΠΎΠ½Ρ‡ΠΈΡ‚ΡŒΡΡ, удСрТивая Shift, Ρ‰Π΅Π»ΠΊΠ½ΠΈΡ‚Π΅ ΠΌΡ‹ΡˆΡŒΡŽ. Π­Ρ‚ΠΎ сдСлаСт ΠΏΡ€ΡΠΌΡƒΡŽ линию ΠΌΠ΅ΠΆΠ΄Ρƒ двумя Ρ‚ΠΎΡ‡ΠΊΠ°ΠΌΠΈ. Π― Ρ‚Π°ΠΊΠΆΠ΅ установил Π³ΠΎΡ€ΠΈΠ·ΠΎΠ½Ρ‚Π°Π»ΡŒΠ½Ρ‹Π΅ Π³Ρ€Π°Π½ΠΈΡ†Ρ‹, Ρ‡Ρ‚ΠΎΠ±Ρ‹ Ρ€Π°Π·Π΄Π΅Π»ΠΈΡ‚ΡŒ элСмСнты Π½Π°Π²ΠΈΠ³Π°Ρ†ΠΈΠΈ.Для этого я установил Π³ΠΎΡ€ΠΈΠ·ΠΎΠ½Ρ‚Π°Π»ΡŒΠ½Ρ‹Π΅ Π½Π°ΠΏΡ€Π°Π²Π»ΡΡŽΡ‰ΠΈΠ΅ Π½Π° 130, 215, 300, 385 ΠΈ 470 пиксСлСй ΠΈ использовал эти Π½Π°ΠΏΡ€Π°Π²Π»ΡΡŽΡ‰ΠΈΠ΅, Ρ‡Ρ‚ΠΎΠ±Ρ‹ Π½Π°Ρ€ΠΈΡΠΎΠ²Π°Ρ‚ΡŒ Π³Ρ€Π°Π½ΠΈΡ†Ρ‹ с ΠΏΠΎΠΌΠΎΡ‰ΡŒΡŽ инструмСнта Β«ΠšΠ°Ρ€Π°Π½Π΄Π°ΡˆΒ».

Π’Π΅ΠΏΠ΅Ρ€ΡŒ ΠΌΡ‹ ΠΌΠΎΠΆΠ΅ΠΌ Π΄ΠΎΠ±Π°Π²ΠΈΡ‚ΡŒ тСкст для мСню Π½Π°Π²ΠΈΠ³Π°Ρ†ΠΈΠΈ. Π§Ρ‚ΠΎΠ±Ρ‹ всС Π±Ρ‹Π»ΠΎ Π²Ρ‹Ρ€ΠΎΠ²Π½Π΅Π½ΠΎ Ρ€Π°Π²Π½ΠΎΠΌΠ΅Ρ€Π½ΠΎ, Π²Ρ‹ ΠΌΠΎΠΆΠ΅Ρ‚Π΅ ΡƒΡΡ‚Π°Π½ΠΎΠ²ΠΈΡ‚ΡŒ Π²Π΅Ρ€Ρ‚ΠΈΠΊΠ°Π»ΡŒΠ½ΡƒΡŽ Π½Π°ΠΏΡ€Π°Π²Π»ΡΡŽΡ‰ΡƒΡŽ Π½Π° 340 пиксСлСй (которая Π±ΡƒΠ΄Π΅Ρ‚ Π²Ρ‹Ρ€Π°Π²Π½ΠΈΠ²Π°Ρ‚ΡŒ мСню ΠΏΠΎ Π²Π΅Ρ€Ρ‚ΠΈΠΊΠ°Π»ΠΈ с Π½Π°Ρ‡Π°Π»ΠΎΠΌ названия ΠΎΡ€Π³Π°Π½ΠΈΠ·Π°Ρ†ΠΈΠΈ Π² Π·Π°Π³ΠΎΠ»ΠΎΠ²ΠΊΠ΅) ΠΈ Π³ΠΎΡ€ΠΈΠ·ΠΎΠ½Ρ‚Π°Π»ΡŒΠ½Ρ‹Π΅ Π½Π°ΠΏΡ€Π°Π²Π»ΡΡŽΡ‰ΠΈΠ΅ Π½Π° 150, 195, 235, 280, 320, 365, 405 ΠΈ 450. Π˜ΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠΉΡ‚Π΅ эти Π½Π°ΠΏΡ€Π°Π²Π»ΡΡŽΡ‰ΠΈΠ΅ для выравнивания тСкста ΠΏΠΎ Π²Π΅Ρ€Ρ‚ΠΈΠΊΠ°Π»ΠΈ ΠΈ Π³ΠΎΡ€ΠΈΠ·ΠΎΠ½Ρ‚Π°Π»ΠΈ.Для Π±ΠΎΠ»Π΅Π΅ ΠΊΡ€ΡƒΠΏΠ½ΠΎΠ³ΠΎ тСкста, ΠΊΠΎΡ‚ΠΎΡ€Ρ‹ΠΉ Π½Π΅ Π±ΡƒΠ΄Π΅Ρ‚ ссылками, я ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΡŽ 18 pt Bebas ΠΈ Ρ†Π²Π΅Ρ‚ # 312517. А для тСкста, ΠΊΠΎΡ‚ΠΎΡ€Ρ‹ΠΉ Π±ΡƒΠ΄Π΅Ρ‚ ссылками, я ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΡŽ ΡˆΡ€ΠΈΡ„Ρ‚ Arial 14 pt ΠΈ Ρ†Π²Π΅Ρ‚ # 7b0900.

Π’ΠΎΡ‚ Ρ‡Ρ‚ΠΎ Ρƒ нас Π΅ΡΡ‚ΡŒ:

Π¨Π°Π³ 5: Основная ΠΎΠ±Π»Π°ΡΡ‚ΡŒ Ρ„ΠΎΡ‚ΠΎ

ΠœΡ‹ собираСмся ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚ΡŒ ΠΊΡ€ΡƒΠΏΠ½ΡƒΡŽ ΠΈΠ·Π±Ρ€Π°Π½Π½ΡƒΡŽ Ρ„ΠΎΡ‚ΠΎΠ³Ρ€Π°Ρ„ΠΈΡŽ с двумя Π΄Ρ€ΡƒΠ³ΠΈΠΌΠΈ фотографиями Π·Π° Π½Π΅ΠΉ. Π― Π΄ΡƒΠΌΠ°ΡŽ, Ρ‡Ρ‚ΠΎ самый простой ΠΏΠΎΠ΄Ρ…ΠΎΠ΄ — Π½Π°Ρ‡Π°Ρ‚ΡŒ с изобраТСния, ΠΊΠΎΡ‚ΠΎΡ€ΠΎΠ΅ Π±ΡƒΠ΄Π΅Ρ‚ спСрСди. Π­Ρ‚ΠΎ Ρ„ΠΎΡ‚ΠΎ, ΠΊΠΎΡ‚ΠΎΡ€ΠΎΠ΅ я ΠΊΡƒΠΏΠΈΠ» Π½Π° iStockphoto, Π΅Π³ΠΎ ΠΌΠΎΠΆΠ½ΠΎ Π½Π°ΠΉΡ‚ΠΈ здСсь.Ѐотография ΠΈΠΌΠ΅Π΅Ρ‚ ΡˆΠΈΡ€ΠΈΠ½Ρƒ 425 пиксСлСй ΠΈ высоту 282 пиксСля, Π° Π² ΠΎΠΊΠΎΠ½Ρ‡Π°Ρ‚Π΅Π»ΡŒΠ½ΠΎΠΌ Π΄ΠΈΠ·Π°ΠΉΠ½Π΅ ΠΎΠ½Π° Π±ΡƒΠ΄Π΅Ρ‚ ΠΈΠΌΠ΅Ρ‚ΡŒ Π³Ρ€Π°Π½ΠΈΡ†Ρƒ Π² 10 пиксСлСй ΠΏΠΎ всСму ΠΏΠ΅Ρ€ΠΈΠΌΠ΅Ρ‚Ρ€Ρƒ. Для мСня самый простой способ ΡΠ΄Π΅Π»Π°Ρ‚ΡŒ это — ΡΠΎΠ·Π΄Π°Ρ‚ΡŒ Π½ΠΎΠ²Ρ‹ΠΉ Π΄ΠΎΠΊΡƒΠΌΠ΅Π½Ρ‚ 445 Π½Π° 302 (добавляя пиксСли с ΠΊΠ°ΠΆΠ΄ΠΎΠΉ стороны для Π³Ρ€Π°Π½ΠΈΡ†Ρ‹) ΠΈ ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚ΡŒ инструмСнт Β«Π²Π΅Π΄Ρ€ΠΎ с краской», Ρ‡Ρ‚ΠΎΠ±Ρ‹ Π·Π°ΠΏΠΎΠ»Π½ΠΈΡ‚ΡŒ Π΅Π³ΠΎ Ρ†Π²Π΅Ρ‚ΠΎΠΌ # fdead8. Π—Π°Ρ‚Π΅ΠΌ Π²ΡΡ‚Π°Π²ΡŒΡ‚Π΅ Ρ„ΠΎΡ‚ΠΎΠ³Ρ€Π°Ρ„ΠΈΡŽ Π² Π½ΠΎΠ²Ρ‹ΠΉ Π΄ΠΎΠΊΡƒΠΌΠ΅Π½Ρ‚.

Π—Π°Ρ‚Π΅ΠΌ ΠΌΡ‹ Π΄ΠΎΠ±Π°Π²ΠΈΠΌ ΠΊ ΠΈΠ·ΠΎΠ±Ρ€Π°ΠΆΠ΅Π½ΠΈΡŽ Π³Ρ€Π°Π½ΠΈΡ†Ρƒ Π² 1 пиксСль Ρ†Π²Π΅Ρ‚Π° # 9b7853. Для этого Π²Ρ‹Π±Π΅Ρ€ΠΈΡ‚Π΅ инструмСнт Β«ΠšΠ°Ρ€Π°Π½Π΄Π°ΡˆΒ» ΠΈ ΠΊΠ²Π°Π΄Ρ€Π°Ρ‚Π½ΡƒΡŽ ΠΊΠΈΡΡ‚ΡŒ Ρ€Π°Π·ΠΌΠ΅Ρ€ΠΎΠΌ 1 пиксСль ΠΈ нарисуйтС линию ΠΏΠΎ краям с ΠΊΠ°ΠΆΠ΄ΠΎΠΉ стороны.Π—Π°Ρ‚Π΅ΠΌ ΠΌΡ‹ скопируСм это ΠΈΠ·ΠΎΠ±Ρ€Π°ΠΆΠ΅Π½ΠΈΠ΅, вставим Π΅Π³ΠΎ Π² наш ΠΌΠ°ΠΊΠ΅Ρ‚ ΠΈ размСстим Π² тСкстурированной области. Π’Ρ‹ ΠΌΠΎΠΆΠ΅Ρ‚Π΅ ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚ΡŒ Π²Π΅Ρ€Ρ‚ΠΈΠΊΠ°Π»ΡŒΠ½Ρ‹Π΅ Π½Π°ΠΏΡ€Π°Π²Π»ΡΡŽΡ‰ΠΈΠ΅ Π½Π° 660 пиксСлСй ΠΈ 1280 пиксСлСй, Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΠΏΠΎΠΊΠ°Π·Π°Ρ‚ΡŒ ΡˆΠΈΡ€ΠΈΠ½Ρƒ области, с ΠΊΠΎΡ‚ΠΎΡ€ΠΎΠΉ Π²Π°ΠΌ Π½ΡƒΠΆΠ½ΠΎ Ρ€Π°Π±ΠΎΡ‚Π°Ρ‚ΡŒ, ΠΈ Ρ€Π°Π·ΠΌΠ΅ΡΡ‚ΠΈΡ‚ΡŒ Π΅Π΅ посСрСдинС.

Π—Π°Ρ‚Π΅ΠΌ ΠΌΡ‹ ΠΏΡ€ΠΎΠ΄Π΅Π»Π°Π΅ΠΌ Ρ‚ΠΎΡ‚ ΠΆΠ΅ процСсс, Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΡΠΎΠ·Π΄Π°Ρ‚ΡŒ Π΄Π²Π΅ Π΄Ρ€ΡƒΠ³ΠΈΠ΅ Ρ„ΠΎΡ‚ΠΎΠ³Ρ€Π°Ρ„ΠΈΠΈ Ρ‚ΠΎΠ³ΠΎ ΠΆΠ΅ Ρ€Π°Π·ΠΌΠ΅Ρ€Π°, ΠΊΠΎΡ‚ΠΎΡ€Ρ‹Π΅ Π±ΡƒΠ΄ΡƒΡ‚ Π»Π΅ΠΆΠ°Ρ‚ΡŒ Π·Π° этой Ρ„ΠΎΡ‚ΠΎΠ³Ρ€Π°Ρ„ΠΈΠ΅ΠΉ. Π― просто Π²Ρ‹Π±ΠΈΡ€Π°ΡŽ Π΄Π²Π΅ Ρ„ΠΎΡ‚ΠΎΠ³Ρ€Π°Ρ„ΠΈΠΈ, ΠΊΠΎΡ‚ΠΎΡ€Ρ‹Π΅ Π±Ρ‹Π»ΠΈ доступны Π½Π° sxc.hu, добавляю Π³Ρ€Π°Π½ΠΈΡ†Ρƒ ΠΈ Π²ΡΡ‚Π°Π²Π»ΡΡŽ ΠΈΡ… Π² ΠΌΠ°ΠΊΠ΅Ρ‚. На этих фотографиях Π±ΡƒΠ΄ΡƒΡ‚ ΠΎΡ‚ΠΎΠ±Ρ€Π°ΠΆΠ°Ρ‚ΡŒΡΡ Ρ‚ΠΎΠ»ΡŒΠΊΠΎ нСсколько пиксСлСй, поэтому Π½Π° самом Π΄Π΅Π»Π΅ Π½Π΅ ΠΈΠΌΠ΅Π΅Ρ‚ значСния, Ρ‡Ρ‚ΠΎ Π²Ρ‹ ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠ΅Ρ‚Π΅.

Когда Π²Ρ‹ вставляСтС эти Ρ„ΠΎΡ‚ΠΎΠ³Ρ€Π°Ρ„ΠΈΠΈ, ΠΎΠ½ΠΈ Π±ΡƒΠ΄ΡƒΡ‚ Π»Π΅ΠΆΠ°Ρ‚ΡŒ ΠΏΠΎΠ²Π΅Ρ€Ρ… основной Ρ„ΠΎΡ‚ΠΎΠ³Ρ€Π°Ρ„ΠΈΠΈ. НаТмитС Ctrl + T (Ρ‚Ρ€Π°Π½ΡΡ„ΠΎΡ€ΠΌΠΈΡ€ΠΎΠ²Π°Ρ‚ΡŒ), ΠΈ Π²Ρ‹ смоТСтС Π½Π°ΠΊΠ»ΠΎΠ½ΠΈΡ‚ΡŒ Ρ„ΠΎΡ‚ΠΎΠ³Ρ€Π°Ρ„ΠΈΠΈ, Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΠΎΠ½ΠΈ Π»Π΅ΠΆΠ°Π»ΠΈ Π½Π΅ΠΌΠ½ΠΎΠ³ΠΎ ΠΊΡ€ΠΈΠ²ΠΎ ΠΏΠΎΠ΄ основной Ρ„ΠΎΡ‚ΠΎΠ³Ρ€Π°Ρ„ΠΈΠ΅ΠΉ.

Π‘ ΠΏΠΎΠΌΠΎΡ‰ΡŒΡŽ ΠΌΡ‹ΡˆΠΈ ΠΈ / ΠΈΠ»ΠΈ клавиш со стрСлками слСгка ΠΏΠΎΠ²Π΅Ρ€Π½ΠΈΡ‚Π΅ ΠΈΡ… ΠΈ пСрСмСститС Π½Π΅ΠΌΠ½ΠΎΠ³ΠΎ Π²Π»Π΅Π²ΠΎ ΠΈ Π²ΠΏΡ€Π°Π²ΠΎ ΠΎΡ‚ основной Ρ„ΠΎΡ‚ΠΎΠ³Ρ€Π°Ρ„ΠΈΠΈ, Ρ‡Ρ‚ΠΎΠ±Ρ‹ Π±Ρ‹Π»ΠΈ Π²ΠΈΠ΄Π½Ρ‹ края. Π—Π°Ρ‚Π΅ΠΌ ΠΏΠ΅Ρ€Π΅Ρ‚Π°Ρ‰ΠΈΡ‚Π΅ слой, содСрТащий ΠΎΡΠ½ΠΎΠ²Π½ΡƒΡŽ Ρ„ΠΎΡ‚ΠΎΠ³Ρ€Π°Ρ„ΠΈΡŽ, ΠΏΠΎΠ²Π΅Ρ€Ρ… Π΄Ρ€ΡƒΠ³ΠΈΡ… слоСв, ΠΈ ΠΎΠ½ Π±ΡƒΠ΄Π΅Ρ‚ Π²Ρ‹Π³Π»ΡΠ΄Π΅Ρ‚ΡŒ Ρ‚Π°ΠΊ:

Π― Ρ‚Π°ΠΊΠΆΠ΅ Π΄ΠΎΠ±Π°Π²ΠΈΠ» Ρ‚Π΅Π½ΡŒ Π½Π° ΠΊΠ°ΠΆΠ΄Ρ‹ΠΉ ΠΈΠ· Ρ‚Ρ€Π΅Ρ… слоСв, содСрТащих Ρ„ΠΎΡ‚ΠΎΠ³Ρ€Π°Ρ„ΠΈΠΈ.Π˜ΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠΉΡ‚Π΅ Ρ†Π²Π΅Ρ‚ # 555353, Π½Π΅ΠΏΡ€ΠΎΠ·Ρ€Π°Ρ‡Π½ΠΎΡΡ‚ΡŒ 75%, ΡƒΠ³ΠΎΠ» 90 градусов, расстояниС ΠΈ Ρ€Π°Π·ΠΌΠ΅Ρ€ 3.

Π¨Π°Π³ 6: тСмная Ρ€Π°ΠΌΠΊΠ°

Под ΠΎΠ±Π»Π°ΡΡ‚ΡŒΡŽ Π½Π°Π²ΠΈΠ³Π°Ρ†ΠΈΠΈ ΠΈ основной Ρ„ΠΎΡ‚ΠΎΠ³Ρ€Π°Ρ„ΠΈΠ΅ΠΉ создайтС Π³Ρ€Π°Π½ΠΈΡ†Ρƒ высотой 10 пиксСлСй, ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΡ Ρ‚Π΅ΠΌΠ½ΠΎ-ΠΊΠΎΡ€ΠΈΡ‡Π½Π΅Π²Ρ‹ΠΉ Ρ†Π²Π΅Ρ‚ (# 21190f). Π—Π°Ρ‚Π΅ΠΌ Π² Π½ΠΈΠΆΠ½Π΅ΠΉ части Π³Ρ€Π°Π½ΠΈΡ†Ρ‹ ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠΉΡ‚Π΅ инструмСнт Β«ΠšΠ°Ρ€Π°Π½Π΄Π°ΡˆΒ» с ΠΊΠ²Π°Π΄Ρ€Π°Ρ‚Π½ΠΎΠΉ ΠΊΠΈΡΡ‚ΡŒΡŽ ΡˆΠΈΡ€ΠΈΠ½ΠΎΠΉ 1 пиксСль ΠΈ нарисуйтС линию Ρ†Π²Π΅Ρ‚Π° # 433320.

Π¨Π°Π³ 7. Боковая панСль

Боковая панСль Π±ΡƒΠ΄Π΅Ρ‚ ΡΠΎΠ΄Π΅Ρ€ΠΆΠ°Ρ‚ΡŒ ΠΏΡ€ΠΈΠ·Ρ‹Π² ΠΊ подпискС Π½Π° рассылку новостСй ΠΈ список прСдстоящих событий.НачнСм с области рассылки новостСй. Π― ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΡŽ Π²Π΅Ρ€Ρ‚ΠΈΠΊΠ°Π»ΡŒΠ½Ρ‹Π΅ Π½Π°ΠΏΡ€Π°Π²Π»ΡΡŽΡ‰ΠΈΠ΅ Π½Π° 320 ΠΈ 660 пиксСлСй ΠΈ Π³ΠΎΡ€ΠΈΠ·ΠΎΠ½Ρ‚Π°Π»ΡŒΠ½Ρ‹Π΅ Π½Π°ΠΏΡ€Π°Π²Π»ΡΡŽΡ‰ΠΈΠ΅ Π½Π° 540 ΠΈ 715 пиксСлСй, Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΡΠΎΠ·Π΄Π°Ρ‚ΡŒ ΠΏΠΎΠ»Π΅, Π² ΠΊΠΎΡ‚ΠΎΡ€ΠΎΠΌ Π±ΡƒΠ΄Π΅Ρ‚ ΡΠΎΠ΄Π΅Ρ€ΠΆΠ°Ρ‚ΡŒΡΡ информация ΠΈΠ½Ρ„ΠΎΡ€ΠΌΠ°Ρ†ΠΈΠΎΠ½Π½ΠΎΠ³ΠΎ Π±ΡŽΠ»Π»Π΅Ρ‚Π΅Π½Ρ. Π¦Π²Π΅Ρ‚ поля Π±ΡƒΠ΄Π΅Ρ‚ # fdebd8, с 5 пиксСлями # e5d4c1 Π½Π° всСм протяТСнии (эти 5 пиксСлСй находятся Π²Π½ΡƒΡ‚Ρ€ΠΈ Π½Π°ΠΏΡ€Π°Π²Π»ΡΡŽΡ‰ΠΈΡ…, упомянутых Π²Ρ‹ΡˆΠ΅, Π° Π½Π΅ снаруТи). Π― использовал инструмСнт ΠΏΡ€ΡΠΌΠΎΡƒΠ³ΠΎΠ»ΡŒΠ½ΠΎΠΉ области, Ρ‡Ρ‚ΠΎΠ±Ρ‹ Π²Ρ‹Π΄Π΅Π»ΠΈΡ‚ΡŒ ΠΎΠ±Π»Π°ΡΡ‚ΡŒ, ΠΈ Π²Π΅Π΄Ρ€ΠΎ с краской, Ρ‡Ρ‚ΠΎΠ±Ρ‹ Π·Π°Π»ΠΈΡ‚ΡŒ Π΅Π΅ Ρ†Π²Π΅Ρ‚ΠΎΠΌ.

Для Π·Π½Π°Ρ‡ΠΊΠ° ΠΏΠΎΡ‡Ρ‚Ρ‹ я Π±ΡƒΠ΄Ρƒ ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚ΡŒ элСмСнт ΠΈΠ· Π½Π°Π±ΠΎΡ€Π° Π·Π½Π°Ρ‡ΠΊΠΎΠ² Practika, Π²Ρ‹ΠΏΡƒΡ‰Π΅Π½Π½ΠΎΠ³ΠΎ Smashing Magazine.УстановитС Π·Π½Π°Ρ‡ΠΎΠΊ Π² Π»Π΅Π²ΠΎΠΌ Π²Π΅Ρ€Ρ…Π½Π΅ΠΌ ΡƒΠ³Π»Ρƒ с тСкстом Β«ΠΈΠ½Ρ„ΠΎΡ€ΠΌΠ°Ρ†ΠΈΠΎΠ½Π½Ρ‹ΠΉ Π±ΡŽΠ»Π»Π΅Ρ‚Π΅Π½ΡŒΒ» 14 pt Bebas ΠΈ β„– 312517. НиТС я ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΡŽ строку тСкста ΡˆΡ€ΠΈΡ„Ρ‚ΠΎΠΌ Arial 12 pt Ρ‚ΠΎΠ³ΠΎ ΠΆΠ΅ Ρ†Π²Π΅Ρ‚Π°.

Π—Π°Ρ‚Π΅ΠΌ я установил Π³ΠΎΡ€ΠΈΠ·ΠΎΠ½Ρ‚Π°Π»ΡŒΠ½Ρ‹Π΅ Π½Π°ΠΏΡ€Π°Π²Π»ΡΡŽΡ‰ΠΈΠ΅ для создания Π΄Π²ΡƒΡ… ΠΏΠΎΠ»Π΅ΠΉ Ρ„ΠΎΡ€ΠΌΡ‹ ΠΈ ΠΊΠ½ΠΎΠΏΠΊΠΈ ΠΎΡ‚ΠΏΡ€Π°Π²ΠΊΠΈ. ΠΠ°ΠΏΡ€Π°Π²Π»ΡΡŽΡ‰ΠΈΠ΅ установлСны Π½Π° 625, 645, 655, 675, 685 ΠΈ 705. Π’Π΅Ρ€Ρ‚ΠΈΠΊΠ°Π»ΡŒΠ½Ρ‹Π΅ Π½Π°ΠΏΡ€Π°Π²Π»ΡΡŽΡ‰ΠΈΠ΅ Ρ‚Π°ΠΊΠΆΠ΅ установлСны Π½Π° 380 ΠΈ 550, Π° поля Ρ„ΠΎΡ€ΠΌΡ‹ ΠΌΠΎΠ³ΡƒΡ‚ Π±Ρ‹Ρ‚ΡŒ созданы с ΠΏΠΎΠΌΠΎΡ‰ΡŒΡŽ инструмСнта ΠΏΡ€ΡΠΌΠΎΡƒΠ³ΠΎΠ»ΡŒΠ½ΠΎΠΉ области ΠΈ Π²Π΅Π΄Ρ€Π° с краской.

Π—Π°Ρ‚Π΅ΠΌ Π²Ρ‹ ΠΌΠΎΠΆΠ΅Ρ‚Π΅ ΠΏΡ€ΠΈΠ΄Π°Ρ‚ΡŒ полям Ρ„ΠΎΡ€ΠΌΡ‹ Π³Ρ€Π°Π½ΠΈΡ†Ρƒ Π² 1 пиксСль с ΠΏΠΎΠΌΠΎΡ‰ΡŒΡŽ инструмСнта Β«ΠšΠ°Ρ€Π°Π½Π΄Π°ΡˆΒ» ΠΈ Ρ†Π²Π΅Ρ‚Π° # e5d4c1.ПослС Ρ‚ΠΎΠ³ΠΎ, ΠΊΠ°ΠΊ Π²Ρ‹ создали поля Ρ„ΠΎΡ€ΠΌΡ‹, Π° Π·Π°Ρ‚Π΅ΠΌ ΠΊΠ½ΠΎΠΏΠΊΡƒ, создайтС тСкст для «Имя», «ЭлСктронная ΠΏΠΎΡ‡Ρ‚Π°Β» ΠΈ «Подписка», ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΡ Arial 12 pt.

Π¨Π°Π³ 8: Бписок событий

Под ΠΎΠ±Π»Π°ΡΡ‚ΡŒΡŽ рассылки ΠΌΡ‹ создадим пространство, Π² ΠΊΠΎΡ‚ΠΎΡ€ΠΎΠΌ Π±ΡƒΠ΄ΡƒΡ‚ ΠΎΡΠ²Π΅Ρ‰Π°Ρ‚ΡŒΡΡ прСдстоящиС события. Π­Ρ‚ΠΎ ΠΏΠΎΠ»Π΅ Π±ΡƒΠ΄Π΅Ρ‚ ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚ΡŒ Ρ‚Π΅ ΠΆΠ΅ Ρ†Π²Π΅Ρ‚Π°, Ρ‚Ρƒ ΠΆΠ΅ Ρ€Π°ΠΌΠΊΡƒ Π² 5 пиксСлСй ΠΈ Ρ‚Π°ΠΊΡƒΡŽ ​​ТС ΡˆΠΈΡ€ΠΈΠ½Ρƒ (ΠΎΡ‚ 320 Π΄ΠΎ 660 пиксСлСй). Высота Π±ΡƒΠ΄Π΅Ρ‚ установлСна ​​с ΠΏΠΎΠΌΠΎΡ‰ΡŒΡŽ Π³ΠΎΡ€ΠΈΠ·ΠΎΠ½Ρ‚Π°Π»ΡŒΠ½Ρ‹Ρ… Π½Π°ΠΏΡ€Π°Π²Π»ΡΡŽΡ‰ΠΈΡ… Π½Π° 735 ΠΈ 1035.

Π’ этом Ρ€Π°Π·Π΄Π΅Π»Π΅ я Π±ΡƒΠ΄Ρƒ ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚ΡŒ Π·Π½Π°Ρ‡ΠΎΠΊ калСндаря, ΠΊΠΎΡ‚ΠΎΡ€Ρ‹ΠΉ являСтся Ρ‡Π°ΡΡ‚ΡŒΡŽ Π½Π°Π±ΠΎΡ€Π° Π·Π½Π°Ρ‡ΠΊΠΎΠ² Flavors, снова Π²Ρ‹ΠΏΡƒΡ‰Π΅Π½Π½ΠΎΠ³ΠΎ Smashing Magazine.УстановитС Π·Π½Π°Ρ‡ΠΎΠΊ ΠΈ тСкст Β«ΠŸΡ€Π΅Π΄ΡΡ‚ΠΎΡΡ‰ΠΈΠ΅ события» (14 pt Bebas, # 312517) Π½Π° мСсто.

Π― создал тСкстовоС ΠΏΠΎΠ»Π΅ с 5 пиксСлями ΠΏΠΎ Π±ΠΎΠΊΠ°ΠΌ, ΠΊΠΎΡ‚ΠΎΡ€ΠΎΠ΅ Π±ΡƒΠ΄Π΅Ρ‚ ΡΠΎΠ΄Π΅Ρ€ΠΆΠ°Ρ‚ΡŒ ссылки Π½Π° прСдстоящиС события ΠΈ ΠΈΡ… Π΄Π°Ρ‚Ρ‹. Π­Π»Π΅ΠΌΠ΅Π½Ρ‚Ρ‹ события Π²Ρ‹Π΄Π΅Π»Π΅Π½Ρ‹ ΠΆΠΈΡ€Π½Ρ‹ΠΌ ΡˆΡ€ΠΈΡ„Ρ‚ΠΎΠΌ Arial 14 ΠΏΡ‚, # 7b0900. Π”Π°Ρ‚Π° ΠΈ врСмя: 12 ΠΏΡƒΠ½ΠΊΡ‚ΠΎΠ², ΠΎΠ±Ρ‹Ρ‡Π½Ρ‹ΠΉ Arial, # 312517. А Π²Π½ΠΈΠ·Ρƒ ссылка Π½Π° ΠΏΠΎΠ»Π½Ρ‹ΠΉ ΠΊΠ°Π»Π΅Π½Π΄Π°Ρ€ΡŒ — ΠΎΠ±Ρ‹Ρ‡Π½Ρ‹ΠΉ Arial Ρ€Π°Π·ΠΌΠ΅Ρ€ΠΎΠΌ 12 ΠΏΡƒΠ½ΠΊΡ‚ΠΎΠ², # 7b0900.

Π¨Π°Π³ 9: Основная тСкстовая ΠΎΠ±Π»Π°ΡΡ‚ΡŒ

Π’Π΅ΠΏΠ΅Ρ€ΡŒ ΠΌΡ‹ ΠΌΠΎΠΆΠ΅ΠΌ ΠΏΠ΅Ρ€Π΅ΠΉΡ‚ΠΈ ΠΊ основному тСксту.УстановитС Π²Π΅Ρ€Ρ‚ΠΈΠΊΠ°Π»ΡŒΠ½ΡƒΡŽ Π½Π°ΠΏΡ€Π°Π²Π»ΡΡŽΡ‰ΡƒΡŽ Π½Π° 680 ΠΈ Π³ΠΎΡ€ΠΈΠ·ΠΎΠ½Ρ‚Π°Π»ΡŒΠ½ΡƒΡŽ Π½Π°ΠΏΡ€Π°Π²Π»ΡΡŽΡ‰ΡƒΡŽ Π½Π° 540 ΠΈ ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠΉΡ‚Π΅ эти Π½Π°ΠΏΡ€Π°Π²Π»ΡΡŽΡ‰ΠΈΠ΅ для выравнивания тСкстового поля Π½Π° Π½ΠΎΠ²ΠΎΠΌ слоС. Π’ этом тСкстовом ΠΏΠΎΠ»Π΅ создайтС Π·Π°Π³ΠΎΠ»ΠΎΠ²ΠΎΠΊ, ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΡ ΠΏΠΎΠ»ΡƒΠΆΠΈΡ€Π½Ρ‹ΠΉ ΡˆΡ€ΠΈΡ„Ρ‚ Arial 18 ΠΏΡƒΠ½ΠΊΡ‚ΠΎΠ² ΠΈ Ρ†Π²Π΅Ρ‚ # fdebd8. Под Π·Π°Π³ΠΎΠ»ΠΎΠ²ΠΊΠΎΠΌ Π²ΡΡ‚Π°Π²ΡŒΡ‚Π΅ нСсколько Π°Π±Π·Π°Ρ†Π΅Π² тСкста-заполнитСля (я ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΡŽ Lorem Ipsum). Основной тСкст — это ΡˆΡ€ΠΈΡ„Ρ‚ Arial Ρ€Π°Π·ΠΌΠ΅Ρ€ΠΎΠΌ 12 ΠΏΡƒΠ½ΠΊΡ‚ΠΎΠ², Ρ†Π²Π΅Ρ‚ ΠΊΠΎΡ‚ΠΎΡ€ΠΎΠ³ΠΎ совпадаСт с Ρ†Π²Π΅Ρ‚ΠΎΠΌ Π·Π°Π³ΠΎΠ»ΠΎΠ²ΠΊΠ°.

Π¨Π°Π³ 10. НиТний ΠΊΠΎΠ»ΠΎΠ½Ρ‚ΠΈΡ‚ΡƒΠ»

Π’Π΅ΠΏΠ΅Ρ€ΡŒ Π²Ρ‹ ΠΌΠΎΠΆΠ΅Ρ‚Π΅ ΡΠΎΠ·Π΄Π°Ρ‚ΡŒ Π½ΠΈΠΆΠ½ΠΈΠΉ ΠΊΠΎΠ»ΠΎΠ½Ρ‚ΠΈΡ‚ΡƒΠ», создав Π½ΠΎΠ²Ρ‹ΠΉ слой ΠΈ ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΡ инструмСнт ΠΏΡ€ΡΠΌΠΎΡƒΠ³ΠΎΠ»ΡŒΠ½ΠΎΠΉ области, Ρ‡Ρ‚ΠΎΠ±Ρ‹ Π²Ρ‹Π΄Π΅Π»ΠΈΡ‚ΡŒ ΠΎΠ±Π»Π°ΡΡ‚ΡŒ, ΠΈ инструмСнт рисования, Ρ‡Ρ‚ΠΎΠ±Ρ‹ Π·Π°ΠΏΠΎΠ»Π½ΠΈΡ‚ΡŒ Π΅Π΅ Ρ†Π²Π΅Ρ‚ΠΎΠΌ # 21190f.Π˜Π½ΡΡ‚Ρ€ΡƒΠΌΠ΅Π½Ρ‚ΠΎΠΌ Β«ΠšΠ°Ρ€Π°Π½Π΄Π°ΡˆΒ» нарисуйтС Π³Ρ€Π°Π½ΠΈΡ†Ρƒ Π² 1 пиксСль # 433320.

Под Π±ΠΎΠΊΠΎΠ²ΠΎΠΉ панСлью создайтС тСкстовоС ΠΏΠΎΠ»Π΅ для хранСния ссылок, ΠΊΠΎΡ‚ΠΎΡ€Ρ‹Π΅ Π±ΡƒΠ΄ΡƒΡ‚ ΠΏΠΎΠΌΠ΅Ρ‰Π΅Π½Ρ‹ Π² Π½ΠΈΠΆΠ½ΠΈΠΉ ΠΊΠΎΠ»ΠΎΠ½Ρ‚ΠΈΡ‚ΡƒΠ». Для этого тСкста я использовал Ρ‚Ρƒ ΠΆΠ΅ настройку, Ρ‡Ρ‚ΠΎ ΠΈ основной тСкст, 12 pt Arial, # fdebd8.

ПослСднСС, Ρ‡Ρ‚ΠΎ Π½ΡƒΠΆΠ½ΠΎ ΡΠ΄Π΅Π»Π°Ρ‚ΡŒ, это Π΄ΠΎΠ±Π°Π²ΠΈΡ‚ΡŒ ΠΎΠ±Π»Π°ΡΡ‚ΡŒ Ρ„ΠΎΡ‚ΠΎΠ³Ρ€Π°Ρ„ΠΈΠΈ Π² Π½ΠΈΠΆΠ½ΠΈΠΉ ΠΊΠΎΠ»ΠΎΠ½Ρ‚ΠΈΡ‚ΡƒΠ». Π― Π±ΡƒΠ΄Ρƒ ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚ΡŒ Ρ€Π°Π·ΠΌΠ΅Ρ€ Ρ„ΠΎΡ‚ΠΎΠ³Ρ€Π°Ρ„ΠΈΠΈ 100 Π½Π° 100 пиксСлСй, ΠΈ Π²Ρ‹ ΠΌΠΎΠΆΠ΅Ρ‚Π΅ Π²Ρ‹Ρ€ΠΎΠ²Π½ΡΡ‚ΡŒ всС, установив Π²Π΅Ρ€Ρ‚ΠΈΠΊΠ°Π»ΡŒΠ½Ρ‹Π΅ Π½Π°ΠΏΡ€Π°Π²Π»ΡΡŽΡ‰ΠΈΠ΅ Π½Π° 680, 780, 800, 900, 920, 1020, 1040, 1140, 1160 ΠΈ 1260.И Π³ΠΎΡ€ΠΈΠ·ΠΎΠ½Ρ‚Π°Π»ΡŒΠ½Ρ‹Π΅ Π½Π°ΠΏΡ€Π°Π²Π»ΡΡŽΡ‰ΠΈΠ΅ Π½Π° 1075 ΠΈ 1175. Π­Ρ‚ΠΎ создаст ΠΏΡΡ‚ΡŒ Π±Π»ΠΎΠΊΠΎΠ² 100 x 100, Π³Π΄Π΅ Π±ΡƒΠ΄ΡƒΡ‚ Ρ€Π°Π·ΠΌΠ΅Ρ‰Π°Ρ‚ΡŒΡΡ Ρ„ΠΎΡ‚ΠΎΠ³Ρ€Π°Ρ„ΠΈΠΈ, с 20 пиксСлями ΠΌΠ΅ΠΆΠ΄Ρƒ Π½ΠΈΠΌΠΈ.

Π― использовал Ρ„ΠΎΡ‚ΠΎΠ³Ρ€Π°Ρ„ΠΈΠΈ, ΠΊΠΎΡ‚ΠΎΡ€Ρ‹Π΅ нашСл Π½Π° sxc.hu, Π½ΠΎ Π²Ρ‹ ΠΌΠΎΠΆΠ΅Ρ‚Π΅ ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚ΡŒ здСсь Ρ‡Ρ‚ΠΎ ΡƒΠ³ΠΎΠ΄Π½ΠΎ ΠΈΠ»ΠΈ просто Π·Π°ΠΏΠΎΠ»Π½ΠΈΡ‚ΡŒ ΠΈΡ… ΡΠΏΠ»ΠΎΡˆΠ½Ρ‹ΠΌ Ρ†Π²Π΅Ρ‚ΠΎΠΌ, Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΡΠΎΡ…Ρ€Π°Π½ΠΈΡ‚ΡŒ мСсто для Ρ„ΠΎΡ‚ΠΎΠ³Ρ€Π°Ρ„ΠΈΠΈ.

ПослС вставки ΠΈΠ·ΠΎΠ±Ρ€Π°ΠΆΠ΅Π½ΠΈΠΉ ΠΌΠΎΠΈΠΌ послСдним дСйствиСм Π±Ρ‹Π»ΠΎ Π½Π°Ρ€ΠΈΡΠΎΠ²Π°Ρ‚ΡŒ Ρ€Π°ΠΌΠΊΡƒ Π² 1 пиксСль Π²ΠΎΠΊΡ€ΡƒΠ³ ΠΊΠ°ΠΆΠ΄ΠΎΠΉ Ρ„ΠΎΡ‚ΠΎΠ³Ρ€Π°Ρ„ΠΈΠΈ с ΠΏΠΎΠΌΠΎΡ‰ΡŒΡŽ инструмСнта Β«ΠšΠ°Ρ€Π°Π½Π΄Π°ΡˆΒ» ΠΈ Ρ†Π²Π΅Ρ‚Π° # 433320.

ΠžΠΊΠΎΠ½Ρ‡Π°Ρ‚Π΅Π»ΡŒΠ½Ρ‹ΠΉ Ρ€Π΅Π·ΡƒΠ»ΡŒΡ‚Π°Ρ‚:

Π’ΠΎΡ‚ ΠΎΠΊΠΎΠ½Ρ‡Π°Ρ‚Π΅Π»ΡŒΠ½Ρ‹ΠΉ Ρ€Π΅Π·ΡƒΠ»ΡŒΡ‚Π°Ρ‚ ΡƒΡ€ΠΎΠΊΠ° (Ρ‰Π΅Π»ΠΊΠ½ΠΈΡ‚Π΅ ΠΈΠ·ΠΎΠ±Ρ€Π°ΠΆΠ΅Π½ΠΈΠ΅, Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΡƒΠ²ΠΈΠ΄Π΅Ρ‚ΡŒ Π΅Π³ΠΎ Π² ΠΏΠΎΠ»Π½ΠΎΠΌ Ρ€Π°Π·ΠΌΠ΅Ρ€Π΅):

Π˜ΡΡ…ΠΎΠ΄Π½Ρ‹ΠΉ Ρ„Π°ΠΉΠ» Photoshop, ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Π½Π½Ρ‹ΠΉ Π² этом руководствС, доступСн для Π·Π°Π³Ρ€ΡƒΠ·ΠΊΠΈ, Ссли Π²Ρ‹ Ρ…ΠΎΡ‚ΠΈΡ‚Π΅ Π΅Π³ΠΎ ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚ΡŒ: Π—Π°Π³Ρ€ΡƒΠ·ΠΈΡ‚Π΅ zip-Ρ„Π°ΠΉΠ».

Если Π²Ρ‹ ΠΈΡ‰Π΅Ρ‚Π΅ Π²Π΄ΠΎΡ…Π½ΠΎΠ²Π΅Π½ΠΈΠ΅ Π² Π²Π΅Π±-Π΄ΠΈΠ·Π°ΠΉΠ½Π΅ для создания нСкоммСрчСского Π²Π΅Π±-сайта, посмотритС Π½ΠΎΠ²ΡƒΡŽ ΠΏΡƒΠ±Π»ΠΈΠΊΠ°Ρ†ΠΈΡŽ Π½Π° Vandelay Design, 40 Π»ΡƒΡ‡ΡˆΠΈΡ… нСкоммСрчСских Π²Π΅Π±-сайтах.

PS Web Design Tutorial IV-How to Create a Professional Blog Website Layout in Photoshop

Π”Π°Π½ΡŒ сайту Talk-Mania. Π“ΠΎΠ΄ Π½Π°Π·Π°Π΄ я Π²ΠΈΠ΄Π΅Π» Π½Π° этом сайтС ΠΌΠ½ΠΎΠ³ΠΎ Ρ…ΠΎΡ€ΠΎΡˆΠΈΡ… руководств ΠΏΠΎ Π²Π΅Π±-Π΄ΠΈΠ·Π°ΠΉΠ½Ρƒ. Π“ΠΎΠ΄ спустя, ΠΊΠΎΠ³Π΄Π° я оглянулся, Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΠΏΠΎΡΠΌΠΎΡ‚Ρ€Π΅Ρ‚ΡŒ, Π΅ΡΡ‚ΡŒ Π»ΠΈ ΠΊΠ°ΠΊΠΈΠ΅-Π½ΠΈΠ±ΡƒΠ΄ΡŒ Π½ΠΎΠ²Ρ‹Π΅ ΡƒΡ‡Π΅Π±Π½ΠΈΠΊΠΈ, я Π²Π½Π΅Π·Π°ΠΏΠ½ΠΎ ΠΎΠ±Π½Π°Ρ€ΡƒΠΆΠΈΠ», Ρ‡Ρ‚ΠΎ Π²Π΅Π±-сайт большС Π½Π΅ ΠΌΠΎΠΆΠ΅Ρ‚ Π±Ρ‹Ρ‚ΡŒ ΠΎΡ‚ΠΊΡ€Ρ‹Ρ‚.ΠœΠΎΠΆΠ΅Ρ‚ Π±Ρ‹Ρ‚ΡŒ, Π΅Π³ΠΎ Π·Π°ΠΊΡ€Ρ‹Π»ΠΈ, ΠΌΠΎΠΆΠ΅Ρ‚, ΠΈΠ·ΠΌΠ΅Π½ΠΈΠ»ΠΈ Π½Π°Π·Π²Π°Π½ΠΈΠ΅ сайта. К ΡΡ‡Π°ΡΡ‚ΡŒΡŽ, Π² ΠΏΡ€ΠΎΡˆΠ»ΠΎΠΌ Π³ΠΎΠ΄Ρƒ я Π·Π°Π³Ρ€ΡƒΠ·ΠΈΠ» ΠΈ сохранил нСсколько руководств, ΠΈ этот ΡƒΡ‡Π΅Π±Π½ΠΈΠΊ — ΠΎΠ΄Π½ΠΎ ΠΈΠ· Π½ΠΈΡ…. Π― Ρ‚Π°ΠΊΠΆΠ΅ надСюсь ΡƒΠ²ΠΈΠ΄Π΅Ρ‚ΡŒ большС ΠΎΠ±ΡƒΡ‡Π°ΡŽΡ‰ΠΈΡ… сайтов ΠΏΠΎ Π΄ΠΈΠ·Π°ΠΉΠ½Ρƒ Π²Π΅Π±-страниц PS ΠΈ большС ΠΎΡ‚Π»ΠΈΡ‡Π½Ρ‹Ρ… Π΄ΠΈΠ·Π°ΠΉΠ½ΠΎΠ².

ΠšΠΎΠ½Π²Π΅Π½Ρ†ΠΈΡ:

1. Π’ этой ΡΡ‚Π°Ρ‚ΡŒΠ΅ ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠ΅Ρ‚ΡΡ ΠΏΡ€ΠΎΠ³Ρ€Π°ΠΌΠΌΠ° Photoshop CS5 вСрсии

.

2. Π‘ΠΊΡ€ΠΈΠ½ΡˆΠΎΡ‚Ρ‹ ΠΎΡ€ΠΈΠ³ΠΈΠ½Π°Π»ΡŒΠ½ΠΎΠ³ΠΎ руководства Π½Π° английском языкС. На основС Ρ€Π΅ΠΏΡ€ΠΎΠ΄ΡƒΠΊΡ†ΠΈΠΈ ΠΏΠ΅Ρ€Π΅Π΄Π΅Π»Π°Π» китайский Π²Π°Ρ€ΠΈΠ°Π½Ρ‚ ΠΊΠ°Ρ€Ρ‚ΠΈΠ½ΠΊΠΈ

3.НСкоторыС ΠΎΠΏΠ΅Ρ€Π°Ρ†ΠΈΠΈ Π² исходном тСкстС Π½Π΅ Π΄Π°Π²Π°Π»ΠΈ ΠΏΠ°Ρ€Π°ΠΌΠ΅Ρ‚Ρ€ΠΎΠ². ПослС ΠΏΠΎΠ²Ρ‚ΠΎΡ€Π½Ρ‹Ρ… тСстов я ΠΈΠ·ΠΌΠ΅Ρ€ΠΈΠ» Π½Π΅ΠΊΠΎΡ‚ΠΎΡ€Ρ‹Π΅ ΠΏΠ°Ρ€Π°ΠΌΠ΅Ρ‚Ρ€Ρ‹, ΠΊΠΎΡ‚ΠΎΡ€Ρ‹Π΅ ΠΎΡ‚ΠΎΠ±Ρ€Π°ΠΆΠ°ΡŽΡ‚ΡΡ красным тСкстом. НСкоторыС Π½Π΅ΠΏΡ€Π°Π²ΠΈΠ»ΡŒΠ½Ρ‹Π΅ ΠΏΠ°Ρ€Π°ΠΌΠ΅Ρ‚Ρ€Ρ‹, ΠΏΡ€Π°Π²ΠΈΠ»ΡŒΠ½Ρ‹Π΅ ΠΏΠ°Ρ€Π°ΠΌΠ΅Ρ‚Ρ€Ρ‹ ΠΎΡ‚ΠΎΠ±Ρ€Π°ΠΆΠ°ΡŽΡ‚ΡΡ прямо красным тСкстом

НапримСр: (90,22,231,77οΌ‰. ΠšΠΎΠΎΡ€Π΄ΠΈΠ½Π°Ρ‚Ρ‹ Π²Π΅Ρ€Ρ…Π½Π΅Π³ΠΎ Π»Π΅Π²ΠΎΠ³ΠΎ ΡƒΠ³Π»Π° ΠΏΡ€ΡΠΌΠΎΡƒΠ³ΠΎΠ»ΡŒΠ½ΠΈΠΊΠ°: (90, 22), ΡˆΠΈΡ€ΠΈΠ½Π° 231, высота 77

НапримСр: (90,22οΌ‰, ΠšΠΎΠΎΡ€Π΄ΠΈΠ½Π°Ρ‚Ρ‹ Π²Π΅Ρ€Ρ…Π½Π΅Π³ΠΎ Π»Π΅Π²ΠΎΠ³ΠΎ ΡƒΠ³Π»Π° ΠΏΡ€ΡΠΌΠΎΡƒΠ³ΠΎΠ»ΡŒΠ½ΠΈΠΊΠ° (90, 22), Π° Π΄Π²Π° Π΄Ρ€ΡƒΠ³ΠΈΡ… ΠΏΠ°Ρ€Π°ΠΌΠ΅Ρ‚Ρ€Π° ΠΏΡ€ΡΠΌΠΎΡƒΠ³ΠΎΠ»ΡŒΠ½ΠΈΠΊΠ° Π±Ρ‹Π»ΠΈ ΡƒΠΊΠ°Π·Π°Π½Ρ‹ Π² ΡƒΡ‡Π΅Π±Π½ΠΎΠΌ пособии

Π’ этом ΡƒΡ€ΠΎΠΊΠ΅ я ΠΏΠΎΠΊΠ°ΠΆΡƒ Π²Π°ΠΌ, ΠΊΠ°ΠΊ ΡΠΎΠ·Π΄Π°Ρ‚ΡŒ ΠΏΡ€ΠΎΡ„Π΅ΡΡΠΈΠΎΠ½Π°Π»ΡŒΠ½Ρ‹ΠΉ Π²Π΅Π±-ΠΌΠ°ΠΊΠ΅Ρ‚ Π±Π»ΠΎΠ³Π° Π² Photoshop.

Π’ этом ΡƒΡ€ΠΎΠΊΠ΅ я ΠΏΠΎΠΊΠ°ΠΆΡƒ, ΠΊΠ°ΠΊ ΡΠΎΠ·Π΄Π°Ρ‚ΡŒ ΠΏΡ€ΠΎΡ„Π΅ΡΡΠΈΠΎΠ½Π°Π»ΡŒΠ½Ρ‹ΠΉ ΠΌΠ°ΠΊΠ΅Ρ‚ сайта Π±Π»ΠΎΠ³Π° Π² Photoshop.

ΠœΡ‹ Π±ΡƒΠ΄Π΅ΠΌ ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚ΡŒ систСму сСток 960 для создания Π²Π΅Π±-ΠΌΠ°ΠΊΠ΅Ρ‚Π°. Π‘ΠΊΠ°Ρ‡Π°ΠΉΡ‚Π΅ Ρ„Π°ΠΉΠ» Π°Ρ€Ρ…ΠΈΠ²Π° с сайта, распакуйтС Π΅Π³ΠΎ ΠΈ ΠΎΡ‚ΠΊΡ€ΠΎΠΉΡ‚Π΅ Ρ„Π°ΠΉΠ» «960_grid_12_col 2.psd» ΠΈΠ· ΠΏΠ°ΠΏΠΊΠΈ «Ρ„ΠΎΡ‚ΠΎΡˆΠΎΠΏ».

Π― Π±ΡƒΠ΄Ρƒ ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚ΡŒ 960 Grid System, Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΡΠΎΠ·Π΄Π°Ρ‚ΡŒ ΠΌΠ°ΠΊΠ΅Ρ‚ Π²Π΅Π±-сайта, Π·Π°Π³Ρ€ΡƒΠ·ΠΈΡ‚ΡŒ Ρ„Π°ΠΉΠ» с сайта, Ρ€Π°Π·Π°Ρ€Ρ…ΠΈΠ²ΠΈΡ€ΠΎΠ²Π°Ρ‚ΡŒ Π΅Π³ΠΎ ΠΈ ΠΎΡ‚ΠΊΡ€Ρ‹Ρ‚ΡŒ 960_grid_12_col 2.psd ΠΈΠ· ΠΏΠ°ΠΏΠΊΠΈ Ρ„ΠΎΡ‚ΠΎΡˆΠΎΠΏΠ°.

ΠŸΠΎΡΠΊΠΎΠ»ΡŒΠΊΡƒ Π²Π΅Π±-сайт Talk-Mania большС Π½Π΅ доступСн, Π° PSD фактичСски являСтся Ρ„Π°ΠΉΠ»ΠΎΠΌ ΠΏΠΎΠΌΠΎΡ‰ΠΈ ΠΏΡ€ΠΈ ΠΏΠΎΠ·ΠΈΡ†ΠΈΠΎΠ½ΠΈΡ€ΠΎΠ²Π°Π½ΠΈΠΈ, этот Ρ„Π°ΠΉΠ» Π½Π΅ ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠ΅Ρ‚ΡΡ Π² Π΄Π°Π½Π½ΠΎΠΌ ΠΏΠ΅Ρ€Π΅Π²ΠΎΠ΄Π΅.

Π¨Π°Π³ 1
Π£Π²Π΅Π»ΠΈΡ‡ΡŒΡ‚Π΅ Ρ€Π°Π·ΠΌΠ΅Ρ€ Π΄ΠΎΠΊΡƒΠΌΠ΅Π½Ρ‚Π°, Π²Ρ‹Π±Ρ€Π°Π² Β«Π˜Π·ΠΎΠ±Ρ€Π°ΠΆΠ΅Π½ΠΈΠ΅Β»> Β«Π Π°Π·ΠΌΠ΅Ρ€ холста». Π˜ΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠΉΡ‚Π΅ настройки со ΡΠ»Π΅Π΄ΡƒΡŽΡ‰Π΅Π³ΠΎ изобраТСния. Π—Π°Ρ‚Π΅ΠΌ Π²Ρ‹Π±Π΅Ρ€ΠΈΡ‚Π΅ инструмСнт Β«Π—Π°Π»ΠΈΠ²ΠΊΠ°Β» (G) ΠΈ Π·Π°Π»Π΅ΠΉΡ‚Π΅ Ρ„ΠΎΠ½ Ρ†Π²Π΅Ρ‚ΠΎΠΌ # f6f0e2.

шаг 1

Π’ мСню: Π˜Π·ΠΎΠ±Ρ€Π°ΠΆΠ΅Π½ΠΈΠ΅> Π Π°Π·ΠΌΠ΅Ρ€ холста ΡƒΠ²Π΅Π»ΠΈΡ‡ΡŒΡ‚Π΅ Ρ€Π°Π·ΠΌΠ΅Ρ€ Π΄ΠΎΠΊΡƒΠΌΠ΅Π½Ρ‚Π°. Π˜ΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠΉΡ‚Π΅ ΠΊΠΎΠ½Ρ„ΠΈΠ³ΡƒΡ€Π°Ρ†ΠΈΡŽ, ΠΏΠΎΠΊΠ°Π·Π°Π½Π½ΡƒΡŽ Π½Π° рисункС Π½ΠΈΠΆΠ΅, Π° Π·Π°Ρ‚Π΅ΠΌ Π²Ρ‹Π±Π΅Ρ€ΠΈΡ‚Π΅ инструмСнт Β«Π’Π΅Π΄Ρ€ΠΎ с краской», Ρ‡Ρ‚ΠΎΠ±Ρ‹ Π΄ΠΎΠ±Π°Π²ΠΈΡ‚ΡŒ Ρ†Π²Π΅Ρ‚ Ρ„ΠΎΠ½Π° ΠΊ Π΄ΠΎΠΊΡƒΠΌΠ΅Π½Ρ‚Ρƒ: # f6f0e2

ΠŸΠΎΡΠΊΠΎΠ»ΡŒΠΊΡƒ PSD Π½Π΅ открываСтся, этот шаг становится Π½ΠΎΠ²Ρ‹ΠΌ Π΄ΠΎΠΊΡƒΠΌΠ΅Π½Ρ‚ΠΎΠΌ Ρ€Π°Π·ΠΌΠ΅Ρ€ΠΎΠΌ 1200 * 1500 пиксСлСй.Π˜ΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠΉΡ‚Π΅ инструмСнт Β«Π’Π΅Π΄Ρ€ΠΎ с краской», Ρ‡Ρ‚ΠΎΠ±Ρ‹ Π΄ΠΎΠ±Π°Π²ΠΈΡ‚ΡŒ Ρ†Π²Π΅Ρ‚ Ρ„ΠΎΠ½Π° ΠΊ Π΄ΠΎΠΊΡƒΠΌΠ΅Π½Ρ‚Ρƒ: # f6f0e2

Π Π΅Π·ΡƒΠ»ΡŒΡ‚Π°Ρ‚Ρ‹ ΡΠ»Π΅Π΄ΡƒΡŽΡ‰ΠΈΠ΅:

Π¨Π°Π³ 2
Π’Ρ‹Π±Π΅Ρ€ΠΈΡ‚Π΅ инструмСнт Β«ΠŸΡ€ΡΠΌΠΎΡƒΠ³ΠΎΠ»ΡŒΠ½ΠΈΠΊΒ» (U) ΠΈ создайтС Π±Π΅Π»Ρ‹ΠΉ ΠΏΡ€ΡΠΌΠΎΡƒΠ³ΠΎΠ»ΡŒΠ½ΠΈΠΊ ΡˆΠΈΡ€ΠΈΠ½ΠΎΠΉ 940 пиксСлСй ΠΎΡ‚ Π²Π΅Ρ€Ρ…Π° Π΄ΠΎΠΊΡƒΠΌΠ΅Π½Ρ‚Π° Π΄ΠΎ Π½ΠΈΠ·Π°. ΠžΡΡ‚Π°Π²ΡŒΡ‚Π΅ расстояниС 30 пиксСлСй ΠΎΡ‚ Π½ΠΈΠΆΠ½Π΅Π³ΠΎ края Π΄ΠΎΠΊΡƒΠΌΠ΅Π½Ρ‚Π°. НазовитС этот слой content bg, Π΄Π²Π°ΠΆΠ΄Ρ‹ Ρ‰Π΅Π»ΠΊΠ½ΠΈΡ‚Π΅ ΠΏΠΎ Π½Π΅ΠΌΡƒ, Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΠΎΡ‚ΠΊΡ€Ρ‹Ρ‚ΡŒ ΠΎΠΊΠ½ΠΎ Layer Style, ΠΈ Π΄ΠΎΠ±Π°Π²ΡŒΡ‚Π΅ ΠΎΠ±Π²ΠΎΠ΄ΠΊΡƒ 1px, ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΡ Ρ†Π²Π΅Ρ‚ # ded6c4.

Π¨Π°Π³ 2

Π’ Π΄ΠΎΠΊΡƒΠΌΠ΅Π½Ρ‚Π΅ ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠΉΡ‚Π΅ инструмСнт Β«ΠŸΡ€ΡΠΌΠΎΡƒΠ³ΠΎΠ»ΡŒΠ½ΠΈΠΊΒ», Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΡΠΎΠ·Π΄Π°Ρ‚ΡŒ Π±Π΅Π»Ρ‹ΠΉ ΠΏΡ€ΡΠΌΠΎΡƒΠ³ΠΎΠ»ΡŒΠ½ΠΈΠΊ ΡˆΠΈΡ€ΠΈΠ½ΠΎΠΉ 940 пиксСлСй свСрху Π²Π½ΠΈΠ· (130,0,940,1470), 20 пиксСлСй ΠΎΡ‚ Π½ΠΈΠΆΠ½Π΅Π³ΠΎ края.НазовитС содСрТимоС слоя bg, Π΄Π²Π°ΠΆΠ΄Ρ‹ Ρ‰Π΅Π»ΠΊΠ½ΠΈΡ‚Π΅ слой, Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΠΎΡ‚ΠΊΡ€Ρ‹Ρ‚ΡŒ Π΄ΠΈΠ°Π»ΠΎΠ³ΠΎΠ²ΠΎΠ΅ ΠΎΠΊΠ½ΠΎ стиля слоя, Π΄ΠΎΠ±Π°Π²ΡŒΡ‚Π΅ ΡΡ‚ΠΈΠ»ΡŒ ΠΎΠ±Π²ΠΎΠ΄ΠΊΠΈ ΠΊ ΠΏΡ€ΡΠΌΠΎΡƒΠ³ΠΎΠ»ΡŒΠ½ΠΈΠΊΡƒ, ΡˆΠΈΡ€ΠΈΠ½ΠΎΠΉ 1 пиксСль, Ρ†Π²Π΅Ρ‚ΠΎΠΌ: # ded6c4

Π¨Π°Π³ 3 — Π‘ΠΎΠ·Π΄Π°Π½ΠΈΠ΅ Π·Π°Π³ΠΎΠ»ΠΎΠ²ΠΊΠ°
НаТмитС ΠΊΠ½ΠΎΠΏΠΊΡƒ Β«Π‘ΠΎΠ·Π΄Π°Ρ‚ΡŒ Π½ΠΎΠ²ΡƒΡŽ Π³Ρ€ΡƒΠΏΠΏΡƒΒ» Π² Π½ΠΈΠΆΠ½Π΅ΠΉ части ΠΏΠ°Π½Π΅Π»ΠΈ Β«Π‘Π»ΠΎΠΈΒ», Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΡΠΎΠ·Π΄Π°Ρ‚ΡŒ Π½ΠΎΠ²ΡƒΡŽ Π³Ρ€ΡƒΠΏΠΏΡƒ ΠΈ Π½Π°Π·ΠΎΠ²ΠΈΡ‚Π΅ Π΅Π΅ Β«Π·Π°Π³ΠΎΠ»ΠΎΠ²ΠΎΠΊΒ».
Π’Ρ‹Π±Π΅Ρ€ΠΈΡ‚Π΅ инструмСнт Β«ΠŸΡ€ΡΠΌΠΎΡƒΠ³ΠΎΠ»ΡŒΠ½ΠΈΠΊΒ» (U) ΠΈ создайтС ΠΏΡ€ΡΠΌΠΎΡƒΠ³ΠΎΠ»ΡŒΠ½ΠΈΠΊ высотой 10 пиксСлСй Π² Π²Π΅Ρ€Ρ…Π½Π΅ΠΉ части Π΄ΠΎΠΊΡƒΠΌΠ΅Π½Ρ‚Π°, ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΡ Ρ†Π²Π΅Ρ‚ # aa915c. НазовитС этот слой «вСрхняя панСль».

Π¨Π°Π³ 3 — создаСм Π³ΠΎΠ»ΠΎΠ²Ρƒ

НаТмитС ΠΊΠ½ΠΎΠΏΠΊΡƒ Β«Π‘ΠΎΠ·Π΄Π°Ρ‚ΡŒ Π½ΠΎΠ²ΡƒΡŽ Π³Ρ€ΡƒΠΏΠΏΡƒΒ» Π² Π½ΠΈΠΆΠ½Π΅ΠΉ части ΠΏΠ°Π½Π΅Π»ΠΈ Β«Π‘Π»ΠΎΠΈΒ», Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΡΠΎΠ·Π΄Π°Ρ‚ΡŒ Π½ΠΎΠ²ΡƒΡŽ Π³Ρ€ΡƒΠΏΠΏΡƒ ΠΈ Π½Π°Π·ΠΎΠ²ΠΈΡ‚Π΅ Π΅Π΅ Π·Π°Π³ΠΎΠ»ΠΎΠ²ΠΎΠΊ.

Π˜ΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠΉΡ‚Π΅ инструмСнт Β«ΠŸΡ€ΡΠΌΠΎΡƒΠ³ΠΎΠ»ΡŒΠ½ΠΈΠΊΒ», Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΡΠΎΠ·Π΄Π°Ρ‚ΡŒ ΠΏΡ€ΡΠΌΠΎΡƒΠ³ΠΎΠ»ΡŒΠ½ΠΈΠΊ высотой 10 пиксСлСй Π² Π²Π΅Ρ€Ρ…Π½Π΅ΠΉ части Π΄ΠΎΠΊΡƒΠΌΠ΅Π½Ρ‚Π° (0,0,1200,10), Ρ†Π²Π΅Ρ‚: # aa915c, с ΠΈΠΌΠ΅Π½Π΅ΠΌ top bar.

Π¨Π°Π³ 4
Π’Ρ‹Π±Π΅Ρ€ΠΈΡ‚Π΅ инструмСнт Line Tool (U), установитС Ρ‚ΠΎΠ»Ρ‰ΠΈΠ½Ρƒ 1px ΠΈ нарисуйтС Π³ΠΎΡ€ΠΈΠ·ΠΎΠ½Ρ‚Π°Π»ΡŒΠ½ΡƒΡŽ линию Π²Π½ΠΈΠ·Ρƒ ΠΏΡ€ΡΠΌΠΎΡƒΠ³ΠΎΠ»ΡŒΠ½ΠΈΠΊΠ°, ΠΊΠΎΡ‚ΠΎΡ€Ρ‹ΠΉ Π²Ρ‹ создали Π½Π° ΠΏΡ€Π΅Π΄Ρ‹Π΄ΡƒΡ‰Π΅ΠΌ шагС, ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΡ Ρ†Π²Π΅Ρ‚ # 968051.НазовитС этот слой «линия 1pxΒ».
НаТмитС Ctrl / Cmd + J, Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΠΏΡ€ΠΎΠ΄ΡƒΠ±Π»ΠΈΡ€ΠΎΠ²Π°Ρ‚ΡŒ этот слой. Π˜Π·ΠΌΠ΅Π½ΠΈΡ‚Π΅ Ρ†Π²Π΅Ρ‚ Π½ΠΎΠ²ΠΎΠΉ строки Π½Π° # c3a76a. Π—Π°Ρ‚Π΅ΠΌ Π²Ρ‹Π±Π΅Ρ€ΠΈΡ‚Π΅ инструмСнт Β«ΠŸΠ΅Ρ€Π΅ΠΌΠ΅Ρ‰Π΅Π½ΠΈΠ΅Β» (V) ΠΈ Π½Π°ΠΆΠΌΠΈΡ‚Π΅ стрСлку Π²Π²Π΅Ρ€Ρ… ΠΎΠ΄ΠΈΠ½ Ρ€Π°Π·, Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΠΏΠ΅Ρ€Π΅ΠΌΠ΅ΡΡ‚ΠΈΡ‚ΡŒ этот слой Π½Π° ΠΎΠ΄ΠΈΠ½ пиксСль Π²Π²Π΅Ρ€Ρ….

Π¨Π°Π³ 4

Π˜ΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠΉΡ‚Π΅ инструмСнт «Линия», Ρ‡Ρ‚ΠΎΠ±Ρ‹ Π½Π°Ρ€ΠΈΡΠΎΠ²Π°Ρ‚ΡŒ Π³ΠΎΡ€ΠΈΠ·ΠΎΠ½Ρ‚Π°Π»ΡŒΠ½ΡƒΡŽ линию ΡˆΠΈΡ€ΠΈΠ½ΠΎΠΉ 1 пиксСль Π²Π½ΠΈΠ·Ρƒ Ρ‚ΠΎΠ»ΡŒΠΊΠΎ Ρ‡Ρ‚ΠΎ созданного ΠΏΡ€ΡΠΌΠΎΡƒΠ³ΠΎΠ»ΡŒΠ½ΠΈΠΊΠ°. Π¦Π²Π΅Ρ‚: # 968051. ИмСнованная линия 1px

Ctrl + J, Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΡΠΊΠΎΠΏΠΈΡ€ΠΎΠ²Π°Ρ‚ΡŒ слой ΠΈ ΠΈΠ·ΠΌΠ΅Π½ΠΈΡ‚ΡŒ Ρ†Π²Π΅Ρ‚ Π½ΠΎΠ²ΠΎΠΉ Π»ΠΈΠ½ΠΈΠΈ Π½Π° # c3a76a. Π—Π°Ρ‚Π΅ΠΌ Π²Ρ‹Π±Π΅Ρ€ΠΈΡ‚Π΅ инструмСнт пСрСмСщСния ΠΈ ΠΎΠ΄ΠΈΠ½ Ρ€Π°Π· Π½Π°ΠΆΠΌΠΈΡ‚Π΅ ΠΊΠ»Π°Π²ΠΈΡˆΡƒ со стрСлкой Π²Π²Π΅Ρ€Ρ…, Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΠΏΠ΅Ρ€Π΅ΠΌΠ΅ΡΡ‚ΠΈΡ‚ΡŒ линию Π²Π²Π΅Ρ€Ρ… Π½Π° ΠΎΠ΄ΠΈΠ½ пиксСль.

Π¨Π°Π³ 5
Π’Ρ‹Π±Π΅Ρ€ΠΈΡ‚Π΅ инструмСнт Β«ΠŸΡ€ΡΠΌΠΎΡƒΠ³ΠΎΠ»ΡŒΠ½ΠΈΠΊΒ» (U) ΠΈ создайтС ΠΏΡ€ΡΠΌΠΎΡƒΠ³ΠΎΠ»ΡŒΠ½ΠΈΠΊ высотой 100 пиксСлСй ΠΈ Ρ†Π²Π΅Ρ‚ΠΎΠΌ # e8c271 ΠΏΠΎΠ΄ ΠΏΠ΅Ρ€Π²Ρ‹ΠΌ ΠΏΡ€ΡΠΌΠΎΡƒΠ³ΠΎΠ»ΡŒΠ½ΠΈΠΊΠΎΠΌ. НазовитС этот слой Β«header bgΒ».

Под Π²Π΅Ρ€Ρ…Π½ΠΈΠΌ ΠΏΡ€ΡΠΌΠΎΡƒΠ³ΠΎΠ»ΡŒΠ½ΠΈΠΊΠΎΠΌ с ΠΏΠΎΠΌΠΎΡ‰ΡŒΡŽ инструмСнта Β«ΠŸΡ€ΡΠΌΠΎΡƒΠ³ΠΎΠ»ΡŒΠ½ΠΈΠΊΒ» создайтС ΠΏΡ€ΡΠΌΠΎΡƒΠ³ΠΎΠ»ΡŒΠ½ΠΈΠΊ высотой 100 пиксСлСй, Ρ†Π²Π΅Ρ‚: # e8c271. Π˜ΠΌΠ΅Π½ΠΎΠ²Π°Π½Π½Ρ‹ΠΉ Π·Π°Π³ΠΎΠ»ΠΎΠ²ΠΎΠΊ bg

Π¨Π°Π³ 6
Ctrl / Cmd-Ρ‰Π΅Π»Ρ‡ΠΎΠΊ ΠΏΠΎ Π²Π΅ΠΊΡ‚ΠΎΡ€Π½ΠΎΠΉ маскС слоя «header bg», Ρ‡Ρ‚ΠΎΠ±Ρ‹ Π²Ρ‹Π±Ρ€Π°Ρ‚ΡŒ Π΅Π³ΠΎ. Π—Π°Ρ‚Π΅ΠΌ ΠΏΠ΅Ρ€Π΅ΠΉΠ΄ΠΈΡ‚Π΅ Π² Layer> New Fill Layer> Gradient.Π’Ρ‹Π΄Π΅Π»Π΅Π½ΠΈΠ΅, ΠΊΠΎΡ‚ΠΎΡ€ΠΎΠ΅ Π²Ρ‹ сдСлали, Ρ‚Π΅ΠΏΠ΅Ρ€ΡŒ ΠΏΡ€Π΅ΠΎΠ±Ρ€Π°Π·ΠΎΠ²Π°Π½ΠΎ Π² маску, ΠΈ Π³Ρ€Π°Π΄ΠΈΠ΅Π½Ρ‚ Π±ΡƒΠ΄Π΅Ρ‚ Π²ΠΈΠ΄Π΅Π½ Ρ‚ΠΎΠ»ΡŒΠΊΠΎ Π½Π°Π΄ Π·Π°Π³ΠΎΠ»ΠΎΠ²ΠΊΠΎΠΌ.
Π˜ΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠΉΡ‚Π΅ настройки ΠΈΠ· ΡΠ»Π΅Π΄ΡƒΡŽΡ‰Π΅Π³ΠΎ изобраТСния для слоя Gradient Fill ΠΈ пСрСмСститС Π³Ρ€Π°Π΄ΠΈΠ΅Π½Ρ‚ Π² Π»Π΅Π²ΡƒΡŽ Ρ‡Π°ΡΡ‚ΡŒ Π·Π°Π³ΠΎΠ»ΠΎΠ²ΠΊΠ° (Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΠΏΠ΅Ρ€Π΅ΠΌΠ΅ΡΡ‚ΠΈΡ‚ΡŒ Π³Ρ€Π°Π΄ΠΈΠ΅Π½Ρ‚, Ρ‰Π΅Π»ΠΊΠ½ΠΈΡ‚Π΅ ΠΈΠ·ΠΎΠ±Ρ€Π°ΠΆΠ΅Π½ΠΈΠ΅ ΠΈ ΠΏΠ΅Ρ€Π΅Ρ‚Π°Ρ‰ΠΈΡ‚Π΅ курсор Π½Π° Π±Π΅Π»Ρ‹ΠΉ Ρ†Π²Π΅Ρ‚, откроСтся ΠΎΠΊΠ½ΠΎ Gradient Fill). УстановитС Ρ€Π΅ΠΆΠΈΠΌ налоТСния этого слоя Π½Π° Overlay 20%.

Π¨Π°Π³ 6

Ctrl + Ρ‰Π΅Π»Ρ‡ΠΎΠΊ ΠΈ Ρ‰Π΅Π»ΠΊΠ½ΠΈΡ‚Π΅ слой bg Π·Π°Π³ΠΎΠ»ΠΎΠ²ΠΊΠ°, Ρ‡Ρ‚ΠΎΠ±Ρ‹ Π²Ρ‹Π±Ρ€Π°Ρ‚ΡŒ Π΅Π³ΠΎ. Π—Π°Ρ‚Π΅ΠΌ Π½Π°ΠΆΠΌΠΈΡ‚Π΅ Β«Π‘Π»ΠΎΠΉΒ»> «Новый слой Π·Π°Π»ΠΈΠ²ΠΊΠΈΒ»> Β«Π“Ρ€Π°Π΄ΠΈΠ΅Π½Ρ‚Β».ВыдСлСнная ΠΎΠ±Π»Π°ΡΡ‚ΡŒ прСобразуСтся Π² маску, Ρ‚Π°ΠΊ Ρ‡Ρ‚ΠΎ Π»ΠΈΠ½Π΅ΠΉΠ½Ρ‹ΠΉ Π³Ρ€Π°Π΄ΠΈΠ΅Π½Ρ‚ Π²ΠΈΠ΄Π΅Π½ Ρ‚ΠΎΠ»ΡŒΠΊΠΎ Π² области Π³ΠΎΠ»ΠΎΠ²Ρ‹.

ΠžΠ±Ρ€Π°Ρ‚ΠΈΡ‚Π΅ΡΡŒ ΠΊ ΠΈΠ·ΠΎΠ±Ρ€Π°ΠΆΠ΅Π½ΠΈΡŽ Π½ΠΈΠΆΠ΅, Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΡƒΠ·Π½Π°Ρ‚ΡŒ ΠΏΠ°Ρ€Π°ΠΌΠ΅Ρ‚Ρ€Ρ‹ Π³Ρ€Π°Π΄ΠΈΠ΅Π½Ρ‚Π½ΠΎΠΉ Π·Π°Π»ΠΈΠ²ΠΊΠΈ, Π° Π·Π°Ρ‚Π΅ΠΌ пСрСмСститС слой Π³Ρ€Π°Π΄ΠΈΠ΅Π½Ρ‚Π° Π²Π»Π΅Π²ΠΎ ΠΎΡ‚ области Π³ΠΎΠ»ΠΎΠ²Ρ‹ (ΠΏΡ€ΠΈ ΠΏΠ΅Ρ€Π΅ΠΌΠ΅Ρ‰Π΅Π½ΠΈΠΈ слоя Π³Ρ€Π°Π΄ΠΈΠ΅Π½Ρ‚Π° Ρ‰Π΅Π»ΠΊΠ½ΠΈΡ‚Π΅ слой ΠΈ ΠΎΠ±Ρ€Π°Ρ‚ΠΈΡ‚Π΅ Π²Π½ΠΈΠΌΠ°Π½ΠΈΠ΅ Π½Π° Π±Π΅Π»Ρ‹ΠΉ курсор ΠΏΡ€ΠΈ пСрСтаскивании), установитС Π½Π΅ΠΏΡ€ΠΎΠ·Ρ€Π°Ρ‡Π½ΠΎΡΡ‚ΡŒ слоя 20%


Π¨Π°Π³ 7
Π’Ρ‹Π±Π΅Ρ€ΠΈΡ‚Π΅ инструмСнт Line Tool (U) ΠΈ нарисуйтС Π΄Π²Π΅ Π»ΠΈΠ½ΠΈΠΈ Ρ‚ΠΎΠ»Ρ‰ΠΈΠ½ΠΎΠΉ 1px Π²Π½ΠΈΠ·Ρƒ Π·Π°Π³ΠΎΠ»ΠΎΠ²ΠΊΠ°.Π˜ΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠΉΡ‚Π΅ Ρ†Π²Π΅Ρ‚ # f4d48f для ΠΏΠ΅Ρ€Π²ΠΎΠΉ строки ΠΈ # c6a661 для Π²Ρ‚ΠΎΡ€ΠΎΠΉ.

Π¨Π°Π³ 7

Π˜ΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠΉΡ‚Π΅ инструмСнт «Линия», Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΡΠΎΠ·Π΄Π°Ρ‚ΡŒ 2 Π³ΠΎΡ€ΠΈΠ·ΠΎΠ½Ρ‚Π°Π»ΡŒΠ½Ρ‹Π΅ Π»ΠΈΠ½ΠΈΠΈ ΡˆΠΈΡ€ΠΈΠ½ΠΎΠΉ 1 пиксСль Π² Π½ΠΈΠΆΠ½Π΅ΠΉ части области Π³ΠΎΠ»ΠΎΠ²Ρ‹. Π¦Π²Π΅Ρ‚ ΠΏΠ΅Ρ€Π²ΠΎΠΉ строки: # f4d48f; Ρ†Π²Π΅Ρ‚ Π²Ρ‚ΠΎΡ€ΠΎΠΉ строки: # c6a661

Π¨Π°Π³ 8
Π’Ρ‹Π±Π΅Ρ€ΠΈΡ‚Π΅ инструмСнт «ВСкст» (T) ΠΈ Π½Π°ΠΏΠΈΡˆΠΈΡ‚Π΅ Π½Π°Π·Π²Π°Π½ΠΈΠ΅ вашСго Π²Π΅Π±-ΠΌΠ°ΠΊΠ΅Ρ‚Π° Π² Π»Π΅Π²ΠΎΠΉ части Π·Π°Π³ΠΎΠ»ΠΎΠ²ΠΊΠ°, ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΡ Ρ†Π²Π΅Ρ‚ # f6eedd ΠΈ ΡˆΡ€ΠΈΡ„Ρ‚ Myriad Pro Bold Italic.
АктивируйтС Π½Π°ΠΏΡ€Π°Π²Π»ΡΡŽΡ‰ΠΈΠ΅, Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΠΏΠΎΠΌΠΎΡ‡ΡŒ Π²Π°ΠΌ ΠΏΡ€Π°Π²ΠΈΠ»ΡŒΠ½ΠΎ Ρ€Π°ΡΠΏΠΎΠ»ΠΎΠΆΠΈΡ‚ΡŒ этот тСкстовый слой.
Π”Π²Π°ΠΆΠ΄Ρ‹ Ρ‰Π΅Π»ΠΊΠ½ΠΈΡ‚Π΅ этот слой, Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΠΎΡ‚ΠΊΡ€Ρ‹Ρ‚ΡŒ ΠΎΠΊΠ½ΠΎ Β«Π‘Ρ‚ΠΈΠ»ΡŒ слоя» ΠΈ ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚ΡŒ настройки со ΡΠ»Π΅Π΄ΡƒΡŽΡ‰Π΅Π³ΠΎ изобраТСния. Π― использовал Ρ†Π²Π΅Ρ‚ # 8e7849 для Drop Shadow.

Π¨Π°Π³ 8

Π˜ΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠΉΡ‚Π΅ тСкстовыС инструмСнты, Ρ‡Ρ‚ΠΎΠ±Ρ‹ Π½Π°ΠΏΠΈΡΠ°Ρ‚ΡŒ Π½Π°Π·Π²Π°Π½ΠΈΠ΅ вашСго Π²Π΅Π±-сайта Π² Π»Π΅Π²ΠΎΠΉ части области Π·Π°Π³ΠΎΠ»ΠΎΠ²ΠΊΠ° ΠΌΠ°ΠΊΠ΅Ρ‚Π° вашСго Π²Π΅Π±-сайта, Ρ†Π²Π΅Ρ‚: # f6eedd, ΡˆΡ€ΠΈΡ„Ρ‚: Myriad Pro, ΠΏΠΎΠ»ΡƒΠΆΠΈΡ€Π½Ρ‹ΠΉ ΠΈ курсив

АктивируйтС Π½Π°ΠΏΡ€Π°Π²Π»ΡΡŽΡ‰ΡƒΡŽ линию, Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΠΏΠΎΠΌΠΎΡ‡ΡŒ Π²Π°ΠΌ ΠΏΡ€Π°Π²ΠΈΠ»ΡŒΠ½ΠΎ Ρ€Π°ΡΠΏΠΎΠ»ΠΎΠΆΠΈΡ‚ΡŒ тСкстовый слой.

Π”Π²Π°ΠΆΠ΄Ρ‹ Ρ‰Π΅Π»ΠΊΠ½ΠΈΡ‚Π΅ тСкстовый слой, Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΠΎΡ‚ΠΊΡ€Ρ‹Ρ‚ΡŒ Π΄ΠΈΠ°Π»ΠΎΠ³ΠΎΠ²ΠΎΠ΅ ΠΎΠΊΠ½ΠΎ Β«Π‘Ρ‚ΠΈΠ»ΡŒ слоя», Π·Π°Ρ‚Π΅ΠΌ установитС ΠΏΠ°Ρ€Π°ΠΌΠ΅Ρ‚Ρ€Ρ‹ Π² соотвСтствии со ΡΠ»Π΅Π΄ΡƒΡŽΡ‰ΠΈΠΌ рисунком ΠΈ установитС Ρ†Π²Π΅Ρ‚ ΠΏΡ€ΠΎΠ΅ΠΊΡ†ΠΈΠΈ Π½Π° # 8e7849

Π¨Π°Π³ 9 — Π‘ΠΎΠ·Π΄Π°Π½ΠΈΠ΅ ΠΏΠ°Π½Π΅Π»ΠΈ Π½Π°Π²ΠΈΠ³Π°Ρ†ΠΈΠΈ
Π‘ΠΎΠ·Π΄Π°ΠΉΡ‚Π΅ Π½ΠΎΠ²ΡƒΡŽ Π³Ρ€ΡƒΠΏΠΏΡƒ ΠΈ Π½Π°Π·ΠΎΠ²ΠΈΡ‚Π΅ Π΅Π΅ «навигация».Π’Ρ‹Π±Π΅Ρ€ΠΈΡ‚Π΅ инструмСнт Β«ΠŸΡ€ΡΠΌΠΎΡƒΠ³ΠΎΠ»ΡŒΠ½ΠΈΠΊ со скруглСнными ΡƒΠ³Π»Π°ΠΌΠΈΒ» (U) ΠΈ создайтС ΠΏΡ€ΡΠΌΠΎΡƒΠ³ΠΎΠ»ΡŒΠ½ΠΈΠΊ со скруглСнными ΡƒΠ³Π»Π°ΠΌΠΈ Ρ€Π°Π·ΠΌΠ΅Ρ€ΠΎΠΌ 550 Π½Π° 50 пиксСлСй ΠΈ Ρ†Π²Π΅Ρ‚ΠΎΠΌ # e9d09b. НазовитС этот слой «панСль Π½Π°Π²ΠΈΠ³Π°Ρ†ΠΈΠΈΒ» ΠΈ с ΠΏΠΎΠΌΠΎΡ‰ΡŒΡŽ инструмСнта Β«ΠŸΠ΅Ρ€Π΅ΠΌΠ΅Ρ‰Π΅Π½ΠΈΠ΅Β» (V) пСрСмСститС Π΅Π³ΠΎ Π² ΠΏΡ€Π°Π²ΡƒΡŽ Ρ‡Π°ΡΡ‚ΡŒ ΠΌΠ°ΠΊΠ΅Ρ‚Π° Π½Π° 10 пиксСлСй ΠΏΠΎΠ΄ Π·Π°Π³ΠΎΠ»ΠΎΠ²ΠΊΠΎΠΌ. Π― использовал Ρ†Π²Π΅Ρ‚ # cdbd9b для Drop Shadow.

Π¨Π°Π³ 9 — созданиС ΠΏΠ°Π½Π΅Π»ΠΈ Π½Π°Π²ΠΈΠ³Π°Ρ†ΠΈΠΈ

Π‘ΠΎΠ·Π΄Π°ΠΉΡ‚Π΅ Π½ΠΎΠ²ΡƒΡŽ Π³Ρ€ΡƒΠΏΠΏΡƒ ΠΈ Π½Π°Π·ΠΎΠ²ΠΈΡ‚Π΅ Π΅Π΅ навигация. Π‘ΠΎΠ·Π΄Π°ΠΉΡ‚Π΅ ΠΏΡ€ΡΠΌΠΎΡƒΠ³ΠΎΠ»ΡŒΠ½ΠΈΠΊ с Π·Π°ΠΊΡ€ΡƒΠ³Π»Π΅Π½Π½Ρ‹ΠΌΠΈ ΡƒΠ³Π»Π°ΠΌΠΈ с ΠΏΠΎΠΌΠΎΡ‰ΡŒΡŽ инструмСнта Β«ΠŸΡ€ΡΠΌΠΎΡƒΠ³ΠΎΠ»ΡŒΠ½ΠΈΠΊ со скруглСнными ΡƒΠ³Π»Π°ΠΌΠΈΒ» (500,70), Ρ€Π°Π·ΠΌΠ΅Ρ€: 550 пиксСлСй * 50 пиксСлСй, Ρ†Π²Π΅Ρ‚: # e9d09b, с ΠΈΠΌΠ΅Π½Π΅ΠΌ navbar, ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠΉΡ‚Π΅ инструмСнт пСрСмСщСния, Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΠΏΠ΅Ρ€Π΅ΠΌΠ΅ΡΡ‚ΠΈΡ‚ΡŒΡΡ Π² ΠΏΡ€Π°Π²ΡƒΡŽ сторону Π΄ΠΎΠΊΡƒΠΌΠ΅Π½Ρ‚Π°, Π½ΠΈΠΆΠ½ΠΈΠΉ ΠΊΡ€Π°ΠΉ Π½Π° 10 пиксСлСй Π½ΠΈΠΆΠ΅. ΠΎΠ±Π»Π°ΡΡ‚ΡŒ Π³ΠΎΠ»ΠΎΠ²Ρ‹.Π”ΠΎΠ±Π°Π²ΡŒΡ‚Π΅ ΡΡ‚ΠΈΠ»ΡŒ, ΠΊΠ°ΠΊ ΠΏΠΎΠΊΠ°Π·Π°Π½ΠΎ Π½Π° рисункС, ΠΈ Ρ†Π²Π΅Ρ‚ ΠΏΡ€ΠΎΠ΅ΠΊΡ†ΠΈΠΈ: # cdbd9b

Π¨Π°Π³ 10
Π’Ρ‹Π±Π΅Ρ€ΠΈΡ‚Π΅ инструмСнт «ВСкст» (T) ΠΈ Π½Π°ΠΏΠΈΡˆΠΈΡ‚Π΅ названия ΠΏΡƒΠ½ΠΊΡ‚ΠΎΠ² мСню Π½Π°Π²ΠΈΠ³Π°Ρ†ΠΈΠΈ, ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΡ Ρ†Π²Π΅Ρ‚ # fffcf4. Π”ΠΎΠ±Π°Π²ΡŒΡ‚Π΅ Ρ‚Π΅Π½ΡŒ ΠΊ вашим тСкстовым слоям, ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΡ настройки со ΡΠ»Π΅Π΄ΡƒΡŽΡ‰Π΅Π³ΠΎ изобраТСния.

Π¨Π°Π³ 10

Π˜ΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠΉΡ‚Π΅ тСкстовый инструмСнт, Ρ‡Ρ‚ΠΎΠ±Ρ‹ Π΄ΠΎΠ±Π°Π²ΠΈΡ‚ΡŒ мСню ΠΏΠ°Π½Π΅Π»ΠΈ Π½Π°Π²ΠΈΠ³Π°Ρ†ΠΈΠΈ, Ρ†Π²Π΅Ρ‚: # fffcf4. Π”ΠΎΠ±Π°Π²ΡŒΡ‚Π΅ ΠΏΡ€ΠΎΠ΅ΠΊΡ†ΠΈΡŽ ΠΊ тСксту, ΠΊΠ°ΠΊ ΠΏΠΎΠΊΠ°Π·Π°Π½ΠΎ Π½Π° рисункС Π½ΠΈΠΆΠ΅:

Π¨Π°Π³ 11 — Π‘ΠΎΠ·Π΄Π°Π½ΠΈΠ΅ ΠΈΠ·Π±Ρ€Π°Π½Π½ΠΎΠΉ области
Π‘ΠΎΠ·Π΄Π°ΠΉΡ‚Π΅ Π½ΠΎΠ²ΡƒΡŽ Π³Ρ€ΡƒΠΏΠΏΡƒ ΠΈ Π½Π°Π·ΠΎΠ²ΠΈΡ‚Π΅ Π΅Π΅ «избранная».Π—Π°Ρ‚Π΅ΠΌ Π²Ρ‹Π±Π΅Ρ€ΠΈΡ‚Π΅ инструмСнт Β«ΠŸΡ€ΡΠΌΠΎΡƒΠ³ΠΎΠ»ΡŒΠ½ΠΈΠΊ со скруглСнными ΡƒΠ³Π»Π°ΠΌΠΈΒ» (U) ΠΈ создайтС ΠΏΡ€ΡΠΌΠΎΡƒΠ³ΠΎΠ»ΡŒΠ½ΠΈΠΊ Ρ€Π°Π·ΠΌΠ΅Ρ€ΠΎΠΌ 900 Π½Π° 280 пиксСлСй ΠΈ Ρ†Π²Π΅Ρ‚ΠΎΠΌ # d9cdb2. НазовитС этот слой Β«Feature bgΒ» ΠΈ пСрСмСститС Π΅Π³ΠΎ Π½Π° расстояниС 30 пиксСлСй ΠΎΡ‚ Π½ΠΈΠΆΠ½Π΅Π³ΠΎ края Π·Π°Π³ΠΎΠ»ΠΎΠ²ΠΊΠ°.

Π¨Π°Π³ 11 — созданиС Π²Ρ‹Π΄Π΅Π»Π΅Π½Π½ΠΎΠΉ области

Π‘ΠΎΠ·Π΄Π°ΠΉΡ‚Π΅ Π½ΠΎΠ²ΡƒΡŽ Π³Ρ€ΡƒΠΏΠΏΡƒ ΠΈ Π½Π°Π·ΠΎΠ²ΠΈΡ‚Π΅ Π΅Π΅ ΠΈΠ·Π±Ρ€Π°Π½Π½ΠΎΠΉ. Π—Π°Ρ‚Π΅ΠΌ ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠΉΡ‚Π΅ инструмСнт Β«ΠŸΡ€ΡΠΌΠΎΡƒΠ³ΠΎΠ»ΡŒΠ½ΠΈΠΊ с Π·Π°ΠΊΡ€ΡƒΠ³Π»Π΅Π½Π½Ρ‹ΠΌΠΈ ΡƒΠ³Π»Π°ΠΌΠΈΒ», Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΡΠΎΠ·Π΄Π°Ρ‚ΡŒ ΠΏΡ€ΡΠΌΠΎΡƒΠ³ΠΎΠ»ΡŒΠ½ΠΈΠΊ с Π·Π°ΠΊΡ€ΡƒΠ³Π»Π΅Π½Π½Ρ‹ΠΌΠΈ ΡƒΠ³Π»Π°ΠΌΠΈ (150 Γ— 140), Ρ€Π°Π·ΠΌΠ΅Ρ€: 900 пиксСлСй * 280 пиксСлСй, Ρ†Π²Π΅Ρ‚: # d9cdb2. НазовитС этот слой Feature bg ΠΈ пСрСмСститС Π΅Π³ΠΎ Π² ΠΏΠΎΠ»ΠΎΠΆΠ΅Π½ΠΈΠ΅ 30 пиксСлСй ΠΎΡ‚ Π½ΠΈΠΆΠ½Π΅ΠΉ части области Π³ΠΎΠ»ΠΎΠ²Ρ‹.

Π¨Π°Π³ 12.
Π’Ρ‹Π±Π΅Ρ€ΠΈΡ‚Π΅ инструмСнт Β«ΠŸΡ€ΡΠΌΠΎΡƒΠ³ΠΎΠ»ΡŒΠ½ΠΈΠΊΒ» (U) ΠΈ создайтС ΠΏΡ€ΡΠΌΠΎΡƒΠ³ΠΎΠ»ΡŒΠ½ΠΈΠΊ Π²Π½ΡƒΡ‚Ρ€ΠΈ большого скруглСнного ΠΏΡ€ΡΠΌΠΎΡƒΠ³ΠΎΠ»ΡŒΠ½ΠΈΠΊΠ° с Ρ€Π°Π·ΠΌΠ΅Ρ€Π°ΠΌΠΈ 600 пиксСлСй Π½Π° 260 пиксСлСй ΠΈ Ρ†Π²Π΅Ρ‚ΠΎΠΌ # f9f5ed.
АктивируйтС Π½Π°ΠΏΡ€Π°Π²Π»ΡΡŽΡ‰ΠΈΠ΅, Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΠΏΠΎΠΌΠΎΡ‡ΡŒ Π²Π°ΠΌ ΡΠΎΠ·Π΄Π°Ρ‚ΡŒ эту Ρ„ΠΎΡ€ΠΌΡƒ. Π—Π°Ρ‚Π΅ΠΌ Π½Π°Π·ΠΎΠ²ΠΈΡ‚Π΅ этот слой Β«Π”Π΅Ρ€ΠΆΠ°Ρ‚Π΅Π»ΡŒ изобраТСния».
ΠžΡ‚ΠΊΡ€ΠΎΠΉΡ‚Π΅ ΠΈΠ·ΠΎΠ±Ρ€Π°ΠΆΠ΅Π½ΠΈΠ΅ Π² Photoshop ΠΈ пСрСмСститС Π΅Π³ΠΎ Π² Π΄ΠΎΠΊΡƒΠΌΠ΅Π½Ρ‚ Π²Π΅Π±-ΠΌΠ°ΠΊΠ΅Ρ‚Π° с ΠΏΠΎΠΌΠΎΡ‰ΡŒΡŽ инструмСнта Β«ΠŸΠ΅Ρ€Π΅ΠΌΠ΅Ρ‰Π΅Π½ΠΈΠ΅Β» (V). НазовитС этот слой Β«ΠΈΠ·ΠΎΠ±Ρ€Π°ΠΆΠ΅Π½ΠΈΠ΅Β» ΠΈ помСститС это ΠΈΠ·ΠΎΠ±Ρ€Π°ΠΆΠ΅Π½ΠΈΠ΅ ΠΏΠΎΠ²Π΅Ρ€Ρ… слоя Β«Π΄Π΅Ρ€ΠΆΠ°Ρ‚Π΅Π»ΡŒ изобраТСния». Π©Π΅Π»ΠΊΠ½ΠΈΡ‚Π΅ ΠΏΡ€Π°Π²ΠΎΠΉ ΠΊΠ½ΠΎΠΏΠΊΠΎΠΉ ΠΌΡ‹ΡˆΠΈ слой Β«ΠΈΠ·ΠΎΠ±Ρ€Π°ΠΆΠ΅Π½ΠΈΠ΅Β» ΠΈ Π²Ρ‹Π±Π΅Ρ€ΠΈΡ‚Π΅ Β«Π‘ΠΎΠ·Π΄Π°Ρ‚ΡŒ ΠΎΠ±Ρ‚Ρ€Π°Π²ΠΎΡ‡Π½ΡƒΡŽ маску».

Π¨Π°Π³ 12

Π˜ΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠΉΡ‚Π΅ инструмСнт Β«ΠŸΡ€ΡΠΌΠΎΡƒΠ³ΠΎΠ»ΡŒΠ½ΠΈΠΊΒ», Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΡΠΎΠ·Π΄Π°Ρ‚ΡŒ ΠΏΡ€ΡΠΌΠΎΡƒΠ³ΠΎΠ»ΡŒΠ½ΠΈΠΊ Π² большом ΠΏΡ€ΡΠΌΠΎΡƒΠ³ΠΎΠ»ΡŒΠ½ΠΈΠΊΠ΅ с Π·Π°ΠΊΡ€ΡƒΠ³Π»Π΅Π½Π½Ρ‹ΠΌΠΈ ΡƒΠ³Π»Π°ΠΌΠΈ (160 Γ— 150), Ρ€Π°Π·ΠΌΠ΅Ρ€: 600 пиксСлСй * 260 пиксСлСй, Ρ†Π²Π΅Ρ‚: # f9f5ed

АктивируйтС Π½Π°ΠΏΡ€Π°Π²Π»ΡΡŽΡ‰ΡƒΡŽ линию, Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΠΏΠΎΠΌΠΎΡ‡ΡŒ Π²Π°ΠΌ ΡΠΎΠ·Π΄Π°Ρ‚ΡŒ ΠΏΡ€ΡΠΌΠΎΡƒΠ³ΠΎΠ»ΡŒΠ½ΠΈΠΊ прямо сСйчас, Π½Π°Π·ΠΎΠ²ΠΈΡ‚Π΅ этот слой Π΄Π΅Ρ€ΠΆΠ°Ρ‚Π΅Π»Π΅ΠΌ изобраТСния

ΠžΡ‚ΠΊΡ€ΠΎΠΉΡ‚Π΅ ΠΈΠ·ΠΎΠ±Ρ€Π°ΠΆΠ΅Π½ΠΈΠ΅ Π² PS ΠΈ с ΠΏΠΎΠΌΠΎΡ‰ΡŒΡŽ мобильного инструмСнта пСрСмСститС Π΅Π³ΠΎ Π² ΠΌΠ°ΠΊΠ΅Ρ‚ Π²Π΅Π±-страницы. НазовитС этот слой image ΠΈ пСрСмСститС этот слой Π½Π°Π΄ Π΄Π΅Ρ€ΠΆΠ°Ρ‚Π΅Π»Π΅ΠΌ изобраТСния слоя. Π©Π΅Π»ΠΊΠ½ΠΈΡ‚Π΅ ΠΏΡ€Π°Π²ΠΎΠΉ ΠΊΠ½ΠΎΠΏΠΊΠΎΠΉ ΠΌΡ‹ΡˆΠΈ слой изобраТСния ΠΈ Π²Ρ‹Π±Π΅Ρ€ΠΈΡ‚Π΅ Π‘ΠΎΠ·Π΄Π°Ρ‚ΡŒ ΠΎΠ±Ρ‚Ρ€Π°Π²ΠΎΡ‡Π½ΡƒΡŽ маску

.

Step 13
Π’Π΅ΠΏΠ΅Ρ€ΡŒ ΠΌΡ‹ создадим Π΄Π²Π΅ стрСлки для Π²Ρ‹Π΄Π΅Π»Π΅Π½Π½ΠΎΠΉ области.Π’Ρ‹Π±Π΅Ρ€ΠΈΡ‚Π΅ инструмСнт Β«ΠŸΡ€ΡΠΌΠΎΡƒΠ³ΠΎΠ»ΡŒΠ½ΠΈΠΊ со скруглСнными ΡƒΠ³Π»Π°ΠΌΠΈΒ» (U) ΠΈ создайтС нСбольшой ΠΏΡ€ΡΠΌΠΎΡƒΠ³ΠΎΠ»ΡŒΠ½ΠΈΠΊ со скруглСнными ΡƒΠ³Π»Π°ΠΌΠΈ Ρ†Π²Π΅Ρ‚Π° # d9cdb2. Π”Π²Π°ΠΆΠ΄Ρ‹ Ρ‰Π΅Π»ΠΊΠ½ΠΈΡ‚Π΅ этот слой, Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΠΎΡ‚ΠΊΡ€Ρ‹Ρ‚ΡŒ ΠΎΠΊΠ½ΠΎ Β«Π‘Ρ‚ΠΈΠ»ΡŒ слоя» ΠΈ ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚ΡŒ настройки со ΡΠ»Π΅Π΄ΡƒΡŽΡ‰Π΅Π³ΠΎ изобраТСния. Для ΠΎΠ±Π²ΠΎΠ΄ΠΊΠΈ я использовал Ρ†Π²Π΅Ρ‚ # aaa18c. НазовитС этот слой Β«ΠΏΡ€ΡΠΌΠΎΡƒΠ³ΠΎΠ»ΡŒΠ½ΠΈΠΊ с Π·Π°ΠΊΡ€ΡƒΠ³Π»Π΅Π½Π½Ρ‹ΠΌΠΈ ΡƒΠ³Π»Π°ΠΌΠΈΒ».

Π¨Π°Π³ 13

Π’Π΅ΠΏΠ΅Ρ€ΡŒ ΠΌΡ‹ собираСмся ΡΠΎΠ·Π΄Π°Ρ‚ΡŒ 2 стрСлки Π² Π²Ρ‹Π±Ρ€Π°Π½Π½ΠΎΠΉ области. Π’Ρ‹Π±Π΅Ρ€ΠΈΡ‚Π΅ инструмСнт Β«ΠŸΡ€ΡΠΌΠΎΡƒΠ³ΠΎΠ»ΡŒΠ½ΠΈΠΊ со скруглСнными ΡƒΠ³Π»Π°ΠΌΠΈΒ», Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΡΠΎΠ·Π΄Π°Ρ‚ΡŒ инструмСнт «МалСнький ΠΏΡ€ΡΠΌΠΎΡƒΠ³ΠΎΠ»ΡŒΠ½ΠΈΠΊ со скруглСнными ΡƒΠ³Π»Π°ΠΌΠΈΒ» (710,260,60,40), Ρ†Π²Π΅Ρ‚: # d9cdb2. Π”Π²Π°ΠΆΠ΄Ρ‹ Ρ‰Π΅Π»ΠΊΠ½ΠΈΡ‚Π΅ этот слой, Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΠΎΡ‚ΠΊΡ€Ρ‹Ρ‚ΡŒ ΠΎΠΊΠ½ΠΎ стиля слоя ΠΈ ΡƒΡΡ‚Π°Π½ΠΎΠ²ΠΈΡ‚ΡŒ ΠΏΠ°Ρ€Π°ΠΌΠ΅Ρ‚Ρ€Ρ‹, ΠΊΠ°ΠΊ ΠΏΠΎΠΊΠ°Π·Π°Π½ΠΎ Π½Π° рисункС Π½ΠΈΠΆΠ΅.Π¦Π²Π΅Ρ‚ ΠΎΠ±Π²ΠΎΠ΄ΠΊΠΈ: # aaa18c. НазовитС этот слой скруглСнным ΠΏΡ€ΡΠΌΠΎΡƒΠ³ΠΎΠ»ΡŒΠ½ΠΈΠΊΠΎΠΌ

.

Π¨Π°Π³ 14
Π’Ρ‹Π±Π΅Ρ€ΠΈΡ‚Π΅ инструмСнт Custom Shape Tool (U) ΠΈ создайтС Ρ„ΠΎΡ€ΠΌΡƒ стрСлки Π²Π½ΡƒΡ‚Ρ€ΠΈ скруглСнного ΠΏΡ€ΡΠΌΠΎΡƒΠ³ΠΎΠ»ΡŒΠ½ΠΈΠΊΠ°, ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΡ Ρ†Π²Π΅Ρ‚ # e8e0c8. Π”ΡƒΠ±Π»ΠΈΡ€ΡƒΠΉΡ‚Π΅ эту стрСлку ΠΈ пСрСмСститС Π½ΠΎΠ²ΡƒΡŽ Π²Π»Π΅Π²ΠΎ.
Π’Ρ‹Π±Π΅Ρ€ΠΈΡ‚Π΅ слой Β«ΠŸΡ€ΡΠΌΠΎΡƒΠ³ΠΎΠ»ΡŒΠ½ΠΈΠΊ с Π·Π°ΠΊΡ€ΡƒΠ³Π»Π΅Π½Π½Ρ‹ΠΌΠΈ ΡƒΠ³Π»Π°ΠΌΠΈΒ» ΠΈ Π΄Π²Π° слоя со стрСлками ΠΈ Π½Π°ΠΆΠΌΠΈΡ‚Π΅ Ctrl / Cmd + G, Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΠΏΠΎΠΌΠ΅ΡΡ‚ΠΈΡ‚ΡŒ ΠΈΡ… Π² Π³Ρ€ΡƒΠΏΠΏΡƒ. НазовитС Π³Ρ€ΡƒΠΏΠΏΡƒ «стрСлка Π²ΠΏΡ€Π°Π²ΠΎΒ».

Π¨Π°Π³ 14

Π’Ρ‹Π±Π΅Ρ€ΠΈΡ‚Π΅ инструмСнт ΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚Π΅Π»ΡŒΡΠΊΠΎΠΉ Ρ„ΠΎΡ€ΠΌΡ‹, Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΡΠΎΠ·Π΄Π°Ρ‚ΡŒ Ρ„ΠΎΡ€ΠΌΡƒ стрСлки Π² ΠΏΡ€ΡΠΌΠΎΡƒΠ³ΠΎΠ»ΡŒΠ½ΠΈΠΊΠ΅ с Π·Π°ΠΊΡ€ΡƒΠ³Π»Π΅Π½Π½Ρ‹ΠΌΠΈ ΡƒΠ³Π»Π°ΠΌΠΈ, Ρ†Π²Π΅Ρ‚: # e8e0c8.Π‘ΠΊΠΎΠΏΠΈΡ€ΡƒΠΉΡ‚Π΅ стрСлку ΠΈ пСрСмСститС Π΅Π΅ Π²Π»Π΅Π²ΠΎ

Π’Ρ‹Π±Π΅Ρ€ΠΈΡ‚Π΅ слой ΠΏΡ€ΡΠΌΠΎΡƒΠ³ΠΎΠ»ΡŒΠ½ΠΈΠΊΠ° с Π·Π°ΠΊΡ€ΡƒΠ³Π»Π΅Π½Π½Ρ‹ΠΌΠΈ ΡƒΠ³Π»Π°ΠΌΠΈ ΠΈ Π΄Π²Π° слоя со стрСлками, ΠΈ Ctrl + G ΠΎΠ±ΡŠΠ΅Π΄ΠΈΠ½ΠΈΡ‚ ΠΈΡ… Π² Π³Ρ€ΡƒΠΏΠΏΡƒ. НазовитС Π³Ρ€ΡƒΠΏΠΏΡƒ стрСлкой Π²ΠΏΡ€Π°Π²ΠΎ.

Π¨Π°Π³ 15
Π˜Π½ΡΡ‚Ρ€ΡƒΠΌΠ΅Π½Ρ‚ΠΎΠΌ Rectangular Marquee Tool (M) Π²Ρ‹Π΄Π΅Π»ΠΈΡ‚Π΅ ΠΏΡ€Π°Π²ΡƒΡŽ сторону малСнького ΠΏΡ€ΡΠΌΠΎΡƒΠ³ΠΎΠ»ΡŒΠ½ΠΈΠΊΠ° с Π·Π°ΠΊΡ€ΡƒΠ³Π»Π΅Π½Π½Ρ‹ΠΌΠΈ ΡƒΠ³Π»Π°ΠΌΠΈ. Π£Π±Π΅Π΄ΠΈΡ‚Π΅ΡΡŒ, Ρ‡Ρ‚ΠΎ Π³Ρ€ΡƒΠΏΠΏΠ° «стрСлка Π²ΠΏΡ€Π°Π²ΠΎΒ» Π²Ρ‹Π±Ρ€Π°Π½Π°, Π·Π°Ρ‚Π΅ΠΌ ΠΏΠ΅Ρ€Π΅ΠΉΠ΄ΠΈΡ‚Π΅ ΠΊ Layer> Layer Mask> Hide Selection.

Π¨Π°Π³ 15

Π˜ΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠΉΡ‚Π΅ инструмСнт выдСлСния ΠΏΡ€ΡΠΌΠΎΡƒΠ³ΠΎΠ»ΡŒΠ½ΠΈΠΊΠ°, Ρ‡Ρ‚ΠΎΠ±Ρ‹ Π²Ρ‹Π±Ρ€Π°Ρ‚ΡŒ ΠΏΡ€Π°Π²ΡƒΡŽ сторону нСбольшого ΠΏΡ€ΡΠΌΠΎΡƒΠ³ΠΎΠ»ΡŒΠ½ΠΈΠΊΠ° со скруглСнными ΡƒΠ³Π»Π°ΠΌΠΈ.Π£Π±Π΅Π΄ΠΈΡ‚Π΅ΡΡŒ, Ρ‡Ρ‚ΠΎ Π²Ρ‹Π±Ρ€Π°Π½Π° Π³Ρ€ΡƒΠΏΠΏΠ° со стрСлкой Π²ΠΏΡ€Π°Π²ΠΎ, Π° Π·Π°Ρ‚Π΅ΠΌ Ρ‰Π΅Π»ΠΊΠ½ΠΈΡ‚Π΅ мСню: Π‘Π»ΠΎΠΉ> Маска слоя> Π‘ΠΊΡ€Ρ‹Ρ‚ΡŒ Π²Ρ‹Π΄Π΅Π»Π΅Π½ΠΈΠ΅

.

Π¨Π°Π³ 16
Π©Π΅Π»ΠΊΠ½ΠΈΡ‚Π΅ ΠΏΡ€Π°Π²ΠΎΠΉ ΠΊΠ½ΠΎΠΏΠΊΠΎΠΉ ΠΌΡ‹ΡˆΠΈ слой «стрСлка Π²ΠΏΡ€Π°Π²ΠΎΒ» ΠΈ Π²Ρ‹Π±Π΅Ρ€ΠΈΡ‚Π΅ Β«ΠŸΡ€Π΅ΠΎΠ±Ρ€Π°Π·ΠΎΠ²Π°Ρ‚ΡŒ Π² смарт-ΠΎΠ±ΡŠΠ΅ΠΊΡ‚Β». Π”ΡƒΠ±Π»ΠΈΡ€ΡƒΠΉΡ‚Π΅ этот слой (Ctrl / Cmd + J). Π—Π°Ρ‚Π΅ΠΌ ΠΏΠ΅Ρ€Π΅ΠΉΠ΄ΠΈΡ‚Π΅ Π² Edit> Transform> Flip Horizontal. НазовитС Π½ΠΎΠ²Ρ‹ΠΉ слой «стрСлка Π²Π»Π΅Π²ΠΎΒ» ΠΈ пСрСмСститС Π΅Π³ΠΎ Π² Π»Π΅Π²ΡƒΡŽ Ρ‡Π°ΡΡ‚ΡŒ Π²Ρ‹Π΄Π΅Π»Π΅Π½Π½ΠΎΠΉ области.

Π¨Π°Π³ 16

Π©Π΅Π»ΠΊΠ½ΠΈΡ‚Π΅ ΠΏΡ€Π°Π²ΠΎΠΉ ΠΊΠ½ΠΎΠΏΠΊΠΎΠΉ ΠΌΡ‹ΡˆΠΈ слой со стрСлкой Π²ΠΏΡ€Π°Π²ΠΎ ΠΈ Π²Ρ‹Π±Π΅Ρ€ΠΈΡ‚Π΅ Β«ΠŸΡ€Π΅ΠΎΠ±Ρ€Π°Π·ΠΎΠ²Π°Ρ‚ΡŒ Π² смарт-ΠΎΠ±ΡŠΠ΅ΠΊΡ‚Β».Π‘ΠΊΠΎΠΏΠΈΡ€ΡƒΠΉΡ‚Π΅ этот слой (Ctrl + J). Π—Π°Ρ‚Π΅ΠΌ Ρ‰Π΅Π»ΠΊΠ½ΠΈΡ‚Π΅ мСню: ΠŸΡ€Π°Π²ΠΊΠ°> Π’Ρ€Π°Π½ΡΡ„ΠΎΡ€ΠΌΠΈΡ€ΠΎΠ²Π°Ρ‚ΡŒ> ΠžΡ‚Ρ€Π°Π·ΠΈΡ‚ΡŒ ΠΏΠΎ Π³ΠΎΡ€ΠΈΠ·ΠΎΠ½Ρ‚Π°Π»ΠΈ. НазовитС Π½ΠΎΠ²Ρ‹ΠΉ слой со стрСлкой Π²Π»Π΅Π²ΠΎ ΠΈ пСрСмСститС Π΅Π³ΠΎ Π²Π»Π΅Π²ΠΎ ΠΎΡ‚ Π²Ρ‹Π΄Π΅Π»Π΅Π½Π½ΠΎΠΉ области

.

Π¨Π°Π³ 17
Π’Ρ‹Π±Π΅Ρ€ΠΈΡ‚Π΅ инструмСнт Β«ΠŸΡ€ΡΠΌΠΎΡƒΠ³ΠΎΠ»ΡŒΠ½ΠΈΠΊΒ» (U) ΠΈ создайтС ΠΏΡ€ΡΠΌΠΎΡƒΠ³ΠΎΠ»ΡŒΠ½ΠΈΠΊ Ρ€Π°Π·ΠΌΠ΅Ρ€ΠΎΠΌ 280 Π½Π° 260 пиксСлСй ΠΈ Ρ†Π²Π΅Ρ‚ΠΎΠΌ # f4ecd8. ΠŸΠΎΠΌΠ΅ΡΡ‚ΠΈΡ‚Π΅ ΠΏΡ€ΡΠΌΠΎΡƒΠ³ΠΎΠ»ΡŒΠ½ΠΈΠΊ рядом с ΠΈΠ·ΠΎΠ±Ρ€Π°ΠΆΠ΅Π½ΠΈΠ΅ΠΌ ΠΈ Π½Π°Π·ΠΎΠ²ΠΈΡ‚Π΅ этот слой Β«text bgΒ». Π”Π²Π°ΠΆΠ΄Ρ‹ Ρ‰Π΅Π»ΠΊΠ½ΠΈΡ‚Π΅ этот слой, Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΠΎΡ‚ΠΊΡ€Ρ‹Ρ‚ΡŒ ΡΡ‚ΠΈΠ»ΡŒ слоя, ΠΈ Π΄ΠΎΠ±Π°Π²ΡŒΡ‚Π΅ ΠΎΠ±Π²ΠΎΠ΄ΠΊΡƒ Π² 1 пиксСль, ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΡ Ρ†Π²Π΅Ρ‚ # f8f4ea.

Π¨Π°Π³ 17

Π‘ΠΎΠ·Π΄Π°ΠΉΡ‚Π΅ ΠΏΡ€ΡΠΌΠΎΡƒΠ³ΠΎΠ»ΡŒΠ½ΠΈΠΊ с ΠΏΠΎΠΌΠΎΡ‰ΡŒΡŽ инструмСнта Β«ΠŸΡ€ΡΠΌΠΎΡƒΠ³ΠΎΠ»ΡŒΠ½ΠΈΠΊΒ» (760Ρ…150), Ρ€Π°Π·ΠΌΠ΅Ρ€: 280 пиксСлСй * 260 пиксСлСй, Ρ†Π²Π΅Ρ‚: # f4ecd8.ΠŸΡ€ΡΠΌΠΎΡƒΠ³ΠΎΠ»ΡŒΠ½ΠΈΠΊ ΠΏΡ€ΠΈΠΊΡ€Π΅ΠΏΠ»Π΅Π½ ΠΊ ΠΏΡ€Π°Π²ΠΎΠΉ сторонС изобраТСния Π² Π²Ρ‹Π΄Π΅Π»Π΅Π½Π½ΠΎΠΉ области ΠΈ ΠΈΠΌΠ΅Π΅Ρ‚ Π½Π°Π·Π²Π°Π½ΠΈΠ΅ text bg. Π”Π²Π°ΠΆΠ΄Ρ‹ Ρ‰Π΅Π»ΠΊΠ½ΠΈΡ‚Π΅ слой, Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΠΎΡ‚ΠΊΡ€Ρ‹Ρ‚ΡŒ ΡΡ‚ΠΈΠ»ΡŒ слоя, Π΄ΠΎΠ±Π°Π²ΡŒΡ‚Π΅ ΠΎΠ±Π²ΠΎΠ΄ΠΊΡƒ 1px, Ρ†Π²Π΅Ρ‚ ΠΎΠ±Π²ΠΎΠ΄ΠΊΠΈ: # f8f4ea

Π¨Π°Π³ 18
Ctrl / Cmd-Ρ‰Π΅Π»Ρ‡ΠΎΠΊ ΠΏΠΎ Π²Π΅ΠΊΡ‚ΠΎΡ€Π½ΠΎΠΉ маскС слоя «text bg», Ρ‡Ρ‚ΠΎΠ±Ρ‹ Π²Ρ‹Π±Ρ€Π°Ρ‚ΡŒ ΠΏΡ€ΡΠΌΠΎΡƒΠ³ΠΎΠ»ΡŒΠ½ΠΈΠΊ. Π—Π°Ρ‚Π΅ΠΌ ΠΏΠ΅Ρ€Π΅ΠΉΠ΄ΠΈΡ‚Π΅ Π² Layer> New Fill Layer> Gradient ΠΈ ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠΉΡ‚Π΅ настройки со ΡΠ»Π΅Π΄ΡƒΡŽΡ‰Π΅Π³ΠΎ изобраТСния. Π― использовал Π³Ρ€Π°Π΄ΠΈΠ΅Π½Ρ‚ # 362D1A-to-transparent. Пока ΠΎΡ‚ΠΊΡ€Ρ‹Ρ‚ΠΎ ΠΎΠΊΠ½ΠΎ «ГрадиСнтная Π·Π°Π»ΠΈΠ²ΠΊΠ°Β», Ρ‰Π΅Π»ΠΊΠ½ΠΈΡ‚Π΅ ΠΈΠ·ΠΎΠ±Ρ€Π°ΠΆΠ΅Π½ΠΈΠ΅ ΠΈ пСрСмСститС Π³Ρ€Π°Π΄ΠΈΠ΅Π½Ρ‚ Π² Π»Π΅Π²ΡƒΡŽ Ρ‡Π°ΡΡ‚ΡŒ ΠΏΡ€ΡΠΌΠΎΡƒΠ³ΠΎΠ»ΡŒΠ½ΠΈΠΊΠ°.Π—Π°Ρ‚Π΅ΠΌ установитС Π½Π΅ΠΏΡ€ΠΎΠ·Ρ€Π°Ρ‡Π½ΠΎΡΡ‚ΡŒ этого слоя Π½Π° 10%.

Π¨Π°Π³ 18

Ctrl + Ρ‰Π΅Π»Ρ‡ΠΎΠΊ ΠΏΠΎ тСкстовому слою bg, Ρ‡Ρ‚ΠΎΠ±Ρ‹ Π²Ρ‹Π±Ρ€Π°Ρ‚ΡŒ ΠΏΡ€ΡΠΌΠΎΡƒΠ³ΠΎΠ»ΡŒΠ½ΠΈΠΊ. Π—Π°Ρ‚Π΅ΠΌ Ρ‰Π΅Π»ΠΊΠ½ΠΈΡ‚Π΅ мСню: Β«Π‘Π»ΠΎΠΉΒ»> «Новый слой Π·Π°Π»ΠΈΠ²ΠΊΠΈΒ»> Β«Π“Ρ€Π°Π΄ΠΈΠ΅Π½Ρ‚Β», Π° Π·Π°Ρ‚Π΅ΠΌ установитС ΠΏΠ°Ρ€Π°ΠΌΠ΅Ρ‚Ρ€Ρ‹ Π² соотвСтствии с рисунком Π½ΠΈΠΆΠ΅. Π’ Π»ΠΈΠ½Π΅ΠΉΠ½ΠΎΠΌ Π³Ρ€Π°Π΄ΠΈΠ΅Π½Ρ‚Π΅ установитС Ρ†Π²Π΅Ρ‚ # 362D1A Π½Π° ΠΏΡ€ΠΎΠ·Ρ€Π°Ρ‡Π½Ρ‹ΠΉ. Когда откроСтся ΠΎΠΊΠ½ΠΎ Π³Ρ€Π°Π΄ΠΈΠ΅Π½Ρ‚Π½ΠΎΠΉ Π·Π°Π»ΠΈΠ²ΠΊΠΈ, Ρ‰Π΅Π»ΠΊΠ½ΠΈΡ‚Π΅ Π³Ρ€Π°Π΄ΠΈΠ΅Π½Ρ‚, Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΠΏΠ΅Ρ€Π΅ΠΌΠ΅ΡΡ‚ΠΈΡ‚ΡŒΡΡ Π²Π»Π΅Π²ΠΎ ΠΎΡ‚ ΠΏΡ€ΡΠΌΠΎΡƒΠ³ΠΎΠ»ΡŒΠ½ΠΈΠΊΠ°. Π—Π°Ρ‚Π΅ΠΌ установитС Π½Π΅ΠΏΡ€ΠΎΠ·Ρ€Π°Ρ‡Π½ΠΎΡΡ‚ΡŒ 10%.

Π¨Π°Π³ 19
Π‘ΠΎΠ·Π΄Π°ΠΉΡ‚Π΅ Π΄Π²Π΅ Π²Π΅Ρ€Ρ‚ΠΈΠΊΠ°Π»ΡŒΠ½Ρ‹Π΅ Π»ΠΈΠ½ΠΈΠΈ Π² Π»Π΅Π²ΠΎΠΉ части ΠΏΡ€ΡΠΌΠΎΡƒΠ³ΠΎΠ»ΡŒΠ½ΠΈΠΊΠ°.Π˜ΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠΉΡ‚Π΅ Ρ†Π²Π΅Ρ‚ # c7bca0 для ΠΏΠ΅Ρ€Π²ΠΎΠΉ строки ΠΈ # fffdf7 для Π²Ρ‚ΠΎΡ€ΠΎΠΉ.

Π¨Π°Π³ 19

Π‘ΠΎΠ·Π΄Π°ΠΉΡ‚Π΅ Π΄Π²Π΅ Π²Π΅Ρ€Ρ‚ΠΈΠΊΠ°Π»ΡŒΠ½Ρ‹Π΅ Π»ΠΈΠ½ΠΈΠΈ Π² Π»Π΅Π²ΠΎΠΉ части ΠΏΡ€ΡΠΌΠΎΡƒΠ³ΠΎΠ»ΡŒΠ½ΠΈΠΊΠ°, Ρ†Π²Π΅Ρ‚ ΠΏΠ΅Ρ€Π²ΠΎΠΉ Π»ΠΈΠ½ΠΈΠΈ: # c7bca0, Ρ†Π²Π΅Ρ‚ Π²Ρ‚ΠΎΡ€ΠΎΠΉ Π»ΠΈΠ½ΠΈΠΈ: # fffdf7

Π¨Π°Π³ 20.
Π’Ρ‹Π±Π΅Ρ€ΠΈΡ‚Π΅ инструмСнт «ВСкст» (T) ΠΈ Π΄ΠΎΠ±Π°Π²ΡŒΡ‚Π΅ тСкст для Π²Ρ‹Π΄Π΅Π»Π΅Π½Π½ΠΎΠΉ области, ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΡ Ρ†Π²Π΅Ρ‚ # 6e6758 ΠΈ ΡˆΡ€ΠΈΡ„Ρ‚ Helvetica.

Π¨Π°Π³ 20

Π˜ΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠΉΡ‚Π΅ инструмСнт «ВСкст», Ρ‡Ρ‚ΠΎΠ±Ρ‹ Π΄ΠΎΠ±Π°Π²ΠΈΡ‚ΡŒ тСкст Π² Π²Ρ‹Π΄Π΅Π»Π΅Π½Π½ΡƒΡŽ ΠΎΠ±Π»Π°ΡΡ‚ΡŒ, Ρ†Π²Π΅Ρ‚: # 6e6758, ΡˆΡ€ΠΈΡ„Ρ‚: Helvetica (Π² этом ΠΏΠ΅Ρ€Π΅Π²ΠΎΠ΄Π΅ вмСсто этого ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠ΅Ρ‚ΡΡ ΡˆΡ€ΠΈΡ„Ρ‚ Verdana)

Π¨Π°Π³ 21
Π’Ρ‹Π±Π΅Ρ€ΠΈΡ‚Π΅ инструмСнт «Линия» (U) ΠΈ нарисуйтС Π³ΠΎΡ€ΠΈΠ·ΠΎΠ½Ρ‚Π°Π»ΡŒΠ½ΡƒΡŽ линию ΠΏΠΎΠ΄ Π²Ρ‹Π΄Π΅Π»Π΅Π½Π½ΠΎΠΉ ΠΎΠ±Π»Π°ΡΡ‚ΡŒΡŽ, ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΡ Ρ†Π²Π΅Ρ‚ # e7e1d5.

Π¨Π°Π³ 21

Π‘ΠΎΠ·Π΄Π°ΠΉΡ‚Π΅ Π³ΠΎΡ€ΠΈΠ·ΠΎΠ½Ρ‚Π°Π»ΡŒΠ½ΡƒΡŽ линию с ΠΏΠΎΠΌΠΎΡ‰ΡŒΡŽ инструмСнта «Линия» (150,445,900,1). НиТС Π²Ρ‹Π΄Π΅Π»Π΅Π½Π½ΠΎΠΉ области Ρ†Π²Π΅Ρ‚: # e7e1d5

Π¨Π°Π³ 22 — Π‘ΠΎΠ·Π΄Π°Π½ΠΈΠ΅ области содСрТимого
Π‘ΠΎΠ·Π΄Π°ΠΉΡ‚Π΅ Π½ΠΎΠ²ΡƒΡŽ Π³Ρ€ΡƒΠΏΠΏΡƒ ΠΈ Π½Π°Π·ΠΎΠ²ΠΈΡ‚Π΅ Π΅Π΅ «содСрТимоС». Π—Π°Ρ‚Π΅ΠΌ Π²Ρ‹Π±Π΅Ρ€ΠΈΡ‚Π΅ инструмСнт Β«ΠŸΡ€ΡΠΌΠΎΡƒΠ³ΠΎΠ»ΡŒΠ½ΠΈΠΊΒ» (U), удСрТивая ΠΊΠ»Π°Π²ΠΈΡˆΡƒ Shift, создайтС ΠΊΠ²Π°Π΄Ρ€Π°Ρ‚ Ρ€Π°Π·ΠΌΠ΅Ρ€ΠΎΠΌ 200 Π½Π° 200 пиксСлСй ΠΈ Ρ†Π²Π΅Ρ‚ΠΎΠΌ # d9cdb2. НазовитС этот слой Β«Π΄Π΅Ρ€ΠΆΠ°Ρ‚Π΅Π»ΡŒ изобраТСния», Π΄Π²Π°ΠΆΠ΄Ρ‹ Ρ‰Π΅Π»ΠΊΠ½ΠΈΡ‚Π΅ ΠΏΠΎ Π½Π΅ΠΌΡƒ ΠΈ ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠΉΡ‚Π΅ настройки со ΡΠ»Π΅Π΄ΡƒΡŽΡ‰Π΅Π³ΠΎ изобраТСния, Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΡΠΎΠ·Π΄Π°Ρ‚ΡŒ эффСкт Π΄Π²ΠΎΠΉΠ½ΠΎΠΉ ΠΎΠ±Π²ΠΎΠ΄ΠΊΠΈ.Π― использовал Ρ†Π²Π΅Ρ‚ # f4ecd8 для Inner Glow ΠΈ # ada48f для Stroke.
Π’Ρ‹Π±Π΅Ρ€ΠΈΡ‚Π΅ инструмСнт «ВСкст» (T) ΠΈ Π΄ΠΎΠ±Π°Π²ΡŒΡ‚Π΅ тСкст рядом с ΠΊΠ²Π°Π΄Ρ€Π°Ρ‚ΠΎΠΌ.

Π¨Π°Π³ 22 — созданиС области содСрТимого

Π‘ΠΎΠ·Π΄Π°ΠΉΡ‚Π΅ Π½ΠΎΠ²ΡƒΡŽ Π³Ρ€ΡƒΠΏΠΏΡƒ ΠΈ Π½Π°Π·ΠΎΠ²ΠΈΡ‚Π΅ Π΅Π΅ content. Π˜ΡΠΏΠΎΠ»ΡŒΠ·ΡƒΡ инструмСнт Β«ΠŸΡ€ΡΠΌΠΎΡƒΠ³ΠΎΠ»ΡŒΠ½ΠΈΠΊΒ», ΡƒΠ΄Π΅Ρ€ΠΆΠΈΠ²Π°ΠΉΡ‚Π΅ ΠΊΠ»Π°Π²ΠΈΡˆΡƒ Shift, Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΡΠΎΠ·Π΄Π°Ρ‚ΡŒ ΠΊΠ²Π°Π΄Ρ€Π°Ρ‚ (150 Γ— 470), Ρ€Π°Π·ΠΌΠ΅Ρ€: 200 пиксСлСй * 200 пиксСлСй, Ρ†Π²Π΅Ρ‚: # d9cdb2. НазовитС этот слой Β«Π΄Π΅Ρ€ΠΆΠ°Ρ‚Π΅Π»ΡŒ изобраТСния», Π΄Π²Π°ΠΆΠ΄Ρ‹ Ρ‰Π΅Π»ΠΊΠ½ΠΈΡ‚Π΅ слой, Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΡΠΎΠ·Π΄Π°Ρ‚ΡŒ эффСкт Π΄Π²ΡƒΡ…Ρ†Π²Π΅Ρ‚Π½ΠΎΠΉ ΠΎΠ±Π²ΠΎΠ΄ΠΊΠΈ, ΠΊΠ°ΠΊ ΠΏΠΎΠΊΠ°Π·Π°Π½ΠΎ Π½Π° рисункС Π½ΠΈΠΆΠ΅. Π¦Π²Π΅Ρ‚ Π²Π½ΡƒΡ‚Ρ€Π΅Π½Π½Π΅Π³ΠΎ свСчСния: # f4ecd8; Ρ†Π²Π΅Ρ‚ ΠΎΠ±Π²ΠΎΠ΄ΠΊΠΈ: # ada48f.

Π˜ΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠΉΡ‚Π΅ инструмСнт «ВСкст», Ρ‡Ρ‚ΠΎΠ±Ρ‹ Π΄ΠΎΠ±Π°Π²ΠΈΡ‚ΡŒ тСкст справа ΠΎΡ‚ ΠΊΠ²Π°Π΄Ρ€Π°Ρ‚Π°

Π¨Π°Π³ 23
Π”ΡƒΠ±Π»ΠΈΡ€ΡƒΠΉΡ‚Π΅ слои, ΠΊΠΎΡ‚ΠΎΡ€Ρ‹Π΅ Π²Ρ‹ создали Π½Π° ΠΏΡ€Π΅Π΄Ρ‹Π΄ΡƒΡ‰Π΅ΠΌ шагС, ΠΏΠ°Ρ€Ρƒ Ρ€Π°Π·. Π˜ΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠΉΡ‚Π΅ инструмСнт Β«ΠŸΠ΅Ρ€Π΅ΠΌΠ΅Ρ‰Π΅Π½ΠΈΠ΅Β» (V), Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΠΏΠ΅Ρ€Π΅ΠΌΠ΅ΡΡ‚ΠΈΡ‚ΡŒ Π½ΠΎΠ²Ρ‹Π΅ слои ΠΏΠΎΠ΄ исходныС.

Π¨Π°Π³ 23

Π”ΡƒΠ±Π»ΠΈΡ€ΡƒΠΉΡ‚Π΅ слои Π½Π΅ΡΠΊΠΎΠ»ΡŒΠΊΠΈΡ… ΠΏΡ€Π΅Π΄Ρ‹Π΄ΡƒΡ‰ΠΈΡ… шагов нСсколько Ρ€Π°Π· ΠΈ с ΠΏΠΎΠΌΠΎΡ‰ΡŒΡŽ инструмСнта пСрСмСщСния пСрСмСститС Π½ΠΎΠ²Ρ‹ΠΉ слой Π½ΠΈΠΆΠ΅ исходного слоя

Π¨Π°Π³ 24 — Π‘ΠΎΠ·Π΄Π°Π½ΠΈΠ΅ Π±ΠΎΠΊΠΎΠ²ΠΎΠΉ ΠΏΠ°Π½Π΅Π»ΠΈ
Π‘ΠΎΠ·Π΄Π°ΠΉΡ‚Π΅ Π½ΠΎΠ²ΡƒΡŽ Π³Ρ€ΡƒΠΏΠΏΡƒ ΠΈ Π½Π°Π·ΠΎΠ²ΠΈΡ‚Π΅ Π΅Π΅ «боковая панСль».Π’Ρ‹Π±Π΅Ρ€ΠΈΡ‚Π΅ инструмСнт «Линия» (U) ΠΈ нарисуйтС Π²Π΅Ρ€Ρ‚ΠΈΠΊΠ°Π»ΡŒΠ½ΡƒΡŽ линию рядом с сообщСниями Π² Π±Π»ΠΎΠ³Π΅, ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΡ Ρ†Π²Π΅Ρ‚ # e7e1d5.

Π’Ρ‹Π±Π΅Ρ€ΠΈΡ‚Π΅ инструмСнт Β«ΠŸΡ€ΡΠΌΠΎΡƒΠ³ΠΎΠ»ΡŒΠ½ΠΈΠΊΒ» (U) ΠΈ создайтС ΠΏΡ€ΡΠΌΠΎΡƒΠ³ΠΎΠ»ΡŒΠ½ΠΈΠΊ Ρ€Π°Π·ΠΌΠ΅Ρ€ΠΎΠΌ 270 Π½Π° 30 пиксСлСй ΠΈ Ρ†Π²Π΅Ρ‚ΠΎΠΌ # fcf9f4. Π”ΠΎΠ±Π°Π²ΡŒΡ‚Π΅ ΠΎΠ±Π²ΠΎΠ΄ΠΊΡƒ Π² 1 пиксСль ΠΊ этому слою с ΠΏΡ€ΡΠΌΠΎΡƒΠ³ΠΎΠ»ΡŒΠ½ΠΈΠΊΠΎΠΌ, ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΡ Ρ†Π²Π΅Ρ‚ # e0dace. НазовитС этот слой «панСль поиска». Π—Π°Ρ‚Π΅ΠΌ Π²Ρ‹Π±Π΅Ρ€ΠΈΡ‚Π΅ инструмСнт «ВСкст» (T) ΠΈ Π΄ΠΎΠ±Π°Π²ΡŒΡ‚Π΅ ΠΊΠΎΠ½Ρ‚Π΅Π½Ρ‚ для Π±ΠΎΠΊΠΎΠ²ΠΎΠΉ ΠΏΠ°Π½Π΅Π»ΠΈ.

Π¨Π°Π³ 24 — созданиС Π±ΠΎΠΊΠΎΠ²ΠΎΠΉ ΠΏΠ°Π½Π΅Π»ΠΈ

Π‘ΠΎΠ·Π΄Π°ΠΉΡ‚Π΅ Π½ΠΎΠ²ΡƒΡŽ Π³Ρ€ΡƒΠΏΠΏΡƒ ΠΈ Π½Π°Π·ΠΎΠ²ΠΈΡ‚Π΅ Π΅Π΅ боковая панСль. Π˜ΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠΉΡ‚Π΅ инструмСнт «Линия», Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΡΠΎΠ·Π΄Π°Ρ‚ΡŒ Π²Π΅Ρ€Ρ‚ΠΈΠΊΠ°Π»ΡŒΠ½ΡƒΡŽ ΠΏΡ€ΡΠΌΡƒΡŽ линию Π½Π° ΠΏΡ€Π°Π²ΠΎΠΉ сторонС области Ρ‚ΠΎΠ»ΡŒΠΊΠΎ Ρ‡Ρ‚ΠΎ (760,470,1,675), Ρ†Π²Π΅Ρ‚: # e7e1d5.

Π‘ΠΎΠ·Π΄Π°ΠΉΡ‚Π΅ ΠΏΡ€ΡΠΌΠΎΡƒΠ³ΠΎΠ»ΡŒΠ½ΠΈΠΊ с ΠΏΠΎΠΌΠΎΡ‰ΡŒΡŽ инструмСнта Β«ΠŸΡ€ΡΠΌΠΎΡƒΠ³ΠΎΠ»ΡŒΠ½ΠΈΠΊΒ» (780 Γ— 500), Ρ€Π°Π·ΠΌΠ΅Ρ€: 270 пиксСлСй * 30 пиксСлСй, Ρ†Π²Π΅Ρ‚: # fcf9f4. Π”ΠΎΠ±Π°Π²ΡŒΡ‚Π΅ ΠΎΠ±Π²ΠΎΠ΄ΠΊΡƒ 1px, Ρ†Π²Π΅Ρ‚: # e0dace. НазовитС эту панСль поиска слоя. Π—Π°Ρ‚Π΅ΠΌ ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠΉΡ‚Π΅ тСкстовый инструмСнт, Ρ‡Ρ‚ΠΎΠ±Ρ‹ Π΄ΠΎΠ±Π°Π²ΠΈΡ‚ΡŒ тСкстовоС содСрТимоС Π±ΠΎΠΊΠΎΠ²ΠΎΠΉ ΠΏΠ°Π½Π΅Π»ΠΈ.

Π¨Π°Π³ 25 — Π‘ΠΎΠ·Π΄Π°Π½ΠΈΠ΅ области Π½ΠΈΠΆΠ½Π΅Π³ΠΎ ΠΊΠΎΠ»ΠΎΠ½Ρ‚ΠΈΡ‚ΡƒΠ»Π°
Π‘ΠΎΠ·Π΄Π°ΠΉΡ‚Π΅ Π½ΠΎΠ²ΡƒΡŽ Π³Ρ€ΡƒΠΏΠΏΡƒ ΠΈ Π½Π°Π·ΠΎΠ²ΠΈΡ‚Π΅ Π΅Π΅ «НиТний ΠΊΠΎΠ»ΠΎΠ½Ρ‚ΠΈΡ‚ΡƒΠ»Β». Π—Π°Ρ‚Π΅ΠΌ Π²Ρ‹Π±Π΅Ρ€ΠΈΡ‚Π΅ инструмСнт Β«ΠŸΡ€ΡΠΌΠΎΡƒΠ³ΠΎΠ»ΡŒΠ½ΠΈΠΊΒ» (U) ΠΈ создайтС ΠΏΡ€ΡΠΌΠΎΡƒΠ³ΠΎΠ»ΡŒΠ½ΠΈΠΊ высотой 40 пиксСлСй ΠΈ Ρ†Π²Π΅Ρ‚ΠΎΠΌ # b3a078 Π²Π½ΠΈΠ·Ρƒ ΠΌΠ°ΠΊΠ΅Ρ‚Π°. НазовитС этот слой «ниТняя полоса». Π—Π°Ρ‚Π΅ΠΌ Π²Ρ‹Π±Π΅Ρ€ΠΈΡ‚Π΅ инструмСнт Line Tool (U) ΠΈ нарисуйтС Π³ΠΎΡ€ΠΈΠ·ΠΎΠ½Ρ‚Π°Π»ΡŒΠ½ΡƒΡŽ линию Π²Π²Π΅Ρ€Ρ…Ρƒ этого ΠΏΡ€ΡΠΌΠΎΡƒΠ³ΠΎΠ»ΡŒΠ½ΠΈΠΊΠ°, ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΡ Ρ†Π²Π΅Ρ‚ # 918161.

Π¨Π°Π³ 25 — созданиС Π½ΠΈΠΆΠ½Π΅ΠΉ части

Π‘ΠΎΠ·Π΄Π°ΠΉΡ‚Π΅ Π½ΠΎΠ²ΡƒΡŽ Π³Ρ€ΡƒΠΏΠΏΡƒ ΠΈ Π½Π°Π·ΠΎΠ²ΠΈΡ‚Π΅ Π΅Π΅ Π½ΠΈΠΆΠ½ΠΈΠΉ ΠΊΠΎΠ»ΠΎΠ½Ρ‚ΠΈΡ‚ΡƒΠ». Π—Π°Ρ‚Π΅ΠΌ Π²Ρ‹Π±Π΅Ρ€ΠΈΡ‚Π΅ инструмСнт Β«ΠŸΡ€ΡΠΌΠΎΡƒΠ³ΠΎΠ»ΡŒΠ½ΠΈΠΊΒ», Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΡΠΎΠ·Π΄Π°Ρ‚ΡŒ ΠΏΡ€ΡΠΌΠΎΡƒΠ³ΠΎΠ»ΡŒΠ½ΠΈΠΊ высотой 40 пиксСлСй Π²Π½ΠΈΠ·Ρƒ Π΄ΠΎΠΊΡƒΠΌΠ΅Π½Ρ‚Π° (130,1430,940,40), Ρ†Π²Π΅Ρ‚: # b3a078. НазовитС Π΅Π³ΠΎ ниТняя панСль. Π‘ ΠΏΠΎΠΌΠΎΡ‰ΡŒΡŽ инструмСнта «Линия» нарисуйтС Π³ΠΎΡ€ΠΈΠ·ΠΎΠ½Ρ‚Π°Π»ΡŒΠ½ΡƒΡŽ линию ΠΏΠΎΠ²Π΅Ρ€Ρ… ΠΏΡ€ΡΠΌΠΎΡƒΠ³ΠΎΠ»ΡŒΠ½ΠΈΠΊΠ°, Ρ†Π²Π΅Ρ‚: # 918161

.


Π¨Π°Π³ 26
Π‘ΠΎΠ·Π΄Π°ΠΉΡ‚Π΅ Π΅Ρ‰Π΅ ΠΎΠ΄ΠΈΠ½ ΠΏΡ€ΡΠΌΠΎΡƒΠ³ΠΎΠ»ΡŒΠ½ΠΈΠΊ высотой 250 пиксСлСй ΠΈ Ρ†Π²Π΅Ρ‚ΠΎΠΌ # d8c293. ΠŸΠΎΠΌΠ΅ΡΡ‚ΠΈΡ‚Π΅ этот ΠΏΡ€ΡΠΌΠΎΡƒΠ³ΠΎΠ»ΡŒΠ½ΠΈΠΊ ΠΏΠΎΠ²Π΅Ρ€Ρ… ΠΏΡ€Π΅Π΄Ρ‹Π΄ΡƒΡ‰Π΅Π³ΠΎ.НазовитС этот слой Β«footer bgΒ».
Π’Ρ‹Π±Π΅Ρ€ΠΈΡ‚Π΅ инструмСнт «Линия» (U) ΠΈ нарисуйтС Π΄Π²Π΅ Π»ΠΈΠ½ΠΈΠΈ Π² Π²Π΅Ρ€Ρ…Π½Π΅ΠΉ части этого ΠΏΡ€ΡΠΌΠΎΡƒΠ³ΠΎΠ»ΡŒΠ½ΠΈΠΊΠ°. Π˜ΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠΉΡ‚Π΅ Ρ†Π²Π΅Ρ‚ # ece4d1 для ΠΏΠ΅Ρ€Π²ΠΎΠΉ строки ΠΈ # ada28b для Π²Ρ‚ΠΎΡ€ΠΎΠΉ.

Π¨Π°Π³ 26

Π‘ΠΎΠ·Π΄Π°ΠΉΡ‚Π΅ Π΅Ρ‰Π΅ ΠΎΠ΄ΠΈΠ½ ΠΏΡ€ΡΠΌΠΎΡƒΠ³ΠΎΠ»ΡŒΠ½ΠΈΠΊ высотой 250 пиксСлСй (130,1180,940,250), Ρ†Π²Π΅Ρ‚: # d8c293. ΠŸΠ΅Ρ€Π΅ΠΌΠ΅ΡΡ‚ΠΈΡ‚Π΅ этот ΠΏΡ€ΡΠΌΠΎΡƒΠ³ΠΎΠ»ΡŒΠ½ΠΈΠΊ Π² Π²Π΅Ρ€Ρ…Π½ΡŽΡŽ Ρ‡Π°ΡΡ‚ΡŒ ΠΏΡ€ΡΠΌΠΎΡƒΠ³ΠΎΠ»ΡŒΠ½ΠΈΠΊΠ° ΠΈ Π½Π°Π·ΠΎΠ²ΠΈΡ‚Π΅ Π΅Π³ΠΎ footer bg

.

Π˜ΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠΉΡ‚Π΅ инструмСнт «Линия», Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΡΠΎΠ·Π΄Π°Ρ‚ΡŒ Π΄Π²Π΅ Π»ΠΈΠ½ΠΈΠΈ Π² Π²Π΅Ρ€Ρ…Π½Π΅ΠΉ части этого ΠΏΡ€ΡΠΌΠΎΡƒΠ³ΠΎΠ»ΡŒΠ½ΠΈΠΊΠ°, Ρ†Π²Π΅Ρ‚ ΠΏΠ΅Ρ€Π²ΠΎΠΉ Π»ΠΈΠ½ΠΈΠΈ: # ece4d1; Ρ†Π²Π΅Ρ‚ Π²Ρ‚ΠΎΡ€ΠΎΠΉ строки: # ada28b

Π¨Π°Π³ 27
Π˜ΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠΉΡ‚Π΅ инструмСнт «Линия» (U), Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΡΠΎΠ·Π΄Π°Ρ‚ΡŒ Π΄Π²Π° раздСлитСля, ΠΊΠ°ΠΆΠ΄Ρ‹ΠΉ ΠΈΠ· ΠΊΠΎΡ‚ΠΎΡ€Ρ‹Ρ… содСрТит Π΄Π²Π΅ Π»ΠΈΠ½ΠΈΠΈ — ΠΎΠ΄Π½Ρƒ Ρ†Π²Π΅Ρ‚Π° # ece4d1, Π° Π΄Ρ€ΡƒΠ³ΡƒΡŽ — Ρ†Π²Π΅Ρ‚Π° # ada28b.ΠŸΠΎΠΌΠ΅ΡΡ‚ΠΈΡ‚Π΅ эти слои Π² Π³Ρ€ΡƒΠΏΠΏΡƒ ΠΈ Π½Π°Π·ΠΎΠ²ΠΈΡ‚Π΅ Π³Ρ€ΡƒΠΏΠΏΡƒ Β«Ρ€Π°Π·Π΄Π΅Π»ΠΈΡ‚Π΅Π»ΠΈΒ».

Π¨Π°Π³ 27

Π˜ΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠΉΡ‚Π΅ инструмСнт «Линия» для создания Π΄Π²ΡƒΡ… Ρ€Π°Π·Π΄Π΅Π»ΠΈΡ‚Π΅Π»ΡŒΠ½Ρ‹Ρ… Π»ΠΈΠ½ΠΈΠΉ, каТдая Ρ€Π°Π·Π΄Π΅Π»ΠΈΡ‚Π΅Π»ΡŒΠ½Π°Ρ линия Π²ΠΊΠ»ΡŽΡ‡Π°Π΅Ρ‚ Π΄Π²Π΅ прямыС Π»ΠΈΠ½ΠΈΠΈ, Ρ†Π²Π΅Ρ‚ ΠΎΠ΄Π½ΠΎΠΉ Π»ΠΈΠ½ΠΈΠΈ: # ece4d1, Ρ†Π²Π΅Ρ‚ Π΄Ρ€ΡƒΠ³ΠΎΠΉ Π»ΠΈΠ½ΠΈΠΈ: # ada28b. ΠžΠ±ΡŠΠ΅Π΄ΠΈΠ½ΠΈΡ‚Π΅ эти слои Π² Π³Ρ€ΡƒΠΏΠΏΡƒ ΠΈ Π½Π°Π·ΠΎΠ²ΠΈΡ‚Π΅ Ρ€Π°Π·Π΄Π΅Π»ΠΈΡ‚Π΅Π»ΠΈ Π³Ρ€ΡƒΠΏΠΏ

.

Π§Π΅Ρ‚Ρ‹Ρ€Π΅ прямыС слСва Π½Π°ΠΏΡ€Π°Π²ΠΎ — это

(440,1200,1,210οΌ‰ , # ece4d1

(441,1200,1,210οΌ‰ , # ada28b

(760,1200,1,210οΌ‰ , # ece4d1

(761,1200,1,210οΌ‰ , # ada28b

Π¨Π°Π³ 28
Π”ΠΎΠ±Π°Π²ΡŒΡ‚Π΅ маску ΠΊ Π³Ρ€ΡƒΠΏΠΏΠ΅ «Ρ€Π°Π·Π΄Π΅Π»ΠΈΡ‚Π΅Π»ΠΈ», Π²Ρ‹Π±Ρ€Π°Π² Layer> Layer Mask> Reveal All.Π—Π°Ρ‚Π΅ΠΌ Π²Ρ‹Π±Π΅Ρ€ΠΈΡ‚Π΅ инструмСнт Β«Π“Ρ€Π°Π΄ΠΈΠ΅Π½Ρ‚Β» (G) ΠΈ ΠΏΠ΅Ρ€Π΅Ρ‚Π°Ρ‰ΠΈΡ‚Π΅ Π΄Π²Π° Π³Ρ€Π°Π΄ΠΈΠ΅Π½Ρ‚Π° ΠΎΡ‚ Ρ‡Π΅Ρ€Π½ΠΎΠ³ΠΎ ΠΊ ΠΏΡ€ΠΎΠ·Ρ€Π°Ρ‡Π½ΠΎΠΌΡƒ — ΠΎΠ΄ΠΈΠ½ Π²Π²Π΅Ρ€Ρ…Ρƒ Ρ€Π°Π·Π΄Π΅Π»ΠΈΡ‚Π΅Π»Π΅ΠΉ, Π° Π΄Ρ€ΡƒΠ³ΠΎΠΉ — Π²Π½ΠΈΠ·Ρƒ.

Π¨Π°Π³ 28

Π§Ρ‚ΠΎΠ±Ρ‹ Π΄ΠΎΠ±Π°Π²ΠΈΡ‚ΡŒ маску Π² Π³Ρ€ΡƒΠΏΠΏΡƒ Ρ€Π°Π·Π΄Π΅Π»ΠΈΡ‚Π΅Π»Π΅ΠΉ, Ρ‰Π΅Π»ΠΊΠ½ΠΈΡ‚Π΅ мСню: Β«Π‘Π»ΠΎΠΉΒ»> «Маска слоя»> Β«ΠŸΠΎΠΊΠ°Π·Π°Ρ‚ΡŒ всС». Π’Ρ‹Π±Π΅Ρ€ΠΈΡ‚Π΅ инструмСнт Π³Ρ€Π°Π΄ΠΈΠ΅Π½Ρ‚Π° ΠΈ ΠΏΠ΅Ρ€Π΅Ρ‚Π°Ρ‰ΠΈΡ‚Π΅ Π΄Π²Π° Π³Ρ€Π°Π΄ΠΈΠ΅Π½Ρ‚Π° ΠΎΡ‚ Ρ‡Π΅Ρ€Π½ΠΎΠ³ΠΎ ΠΊ ΠΏΡ€ΠΎΠ·Ρ€Π°Ρ‡Π½ΠΎΠΌΡƒ — ΠΎΠ΄ΠΈΠ½ Π²Π²Π΅Ρ€Ρ…Ρƒ Ρ€Π°Π·Π΄Π΅Π»ΠΈΡ‚Π΅Π»ΡŒΠ½ΠΎΠΉ Π»ΠΈΠ½ΠΈΠΈ ΠΈ ΠΎΠ΄ΠΈΠ½ Π²Π½ΠΈΠ·Ρƒ Ρ€Π°Π·Π΄Π΅Π»ΠΈΡ‚Π΅Π»ΡŒΠ½ΠΎΠΉ Π»ΠΈΠ½ΠΈΠΈ

НСт нСобходимости ΠΏΠ΅Ρ€Π΅Ρ‚Π°ΡΠΊΠΈΠ²Π°Ρ‚ΡŒ инструмСнт Π³Ρ€Π°Π΄ΠΈΠ΅Π½Ρ‚Π° Π΄Π²Π°ΠΆΠ΄Ρ‹, просто установитС инструмСнт Π³Ρ€Π°Π΄ΠΈΠ΅Π½Ρ‚Π° ΠΎΠ΄ΠΈΠ½ Ρ€Π°Π·, ΠΊΠ°ΠΊ ΠΏΠΎΠΊΠ°Π·Π°Π½ΠΎ Π½Π° рисункС Π½ΠΈΠΆΠ΅, Π° Π·Π°Ρ‚Π΅ΠΌ ΠΏΠ΅Ρ€Π΅Ρ‚Π°Ρ‰ΠΈΡ‚Π΅ Π΅Π³ΠΎ ΠΎΠ΄ΠΈΠ½ Ρ€Π°Π·.


Π¨Π°Π³ 29
Π’Ρ‹Π±Π΅Ρ€ΠΈΡ‚Π΅ инструмСнт «ВСкст» (T) ΠΈ Π΄ΠΎΠ±Π°Π²ΡŒΡ‚Π΅ ΠΊΠΎΠ½Ρ‚Π΅Π½Ρ‚ Π² Π½ΠΈΠΆΠ½ΠΈΠΉ ΠΊΠΎΠ»ΠΎΠ½Ρ‚ΠΈΡ‚ΡƒΠ» вашСго Π²Π΅Π±-ΠΌΠ°ΠΊΠ΅Ρ‚Π°.

Π¨Π°Π³ 29

Π˜ΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠΉΡ‚Π΅ тСкстовый инструмСнт, Ρ‡Ρ‚ΠΎΠ±Ρ‹ Π΄ΠΎΠ±Π°Π²ΠΈΡ‚ΡŒ ΠΊΠΎΠ½Ρ‚Π΅Π½Ρ‚ Π² ниТнюю ΠΎΠ±Π»Π°ΡΡ‚ΡŒ.

Π¨Π°Π³ 30
Π’Ρ‹Π±Π΅Ρ€ΠΈΡ‚Π΅ инструмСнт «ВСкст» (T) ΠΈ Π΄ΠΎΠ±Π°Π²ΡŒΡ‚Π΅ заявлСниС ΠΎΠ± авторских ΠΏΡ€Π°Π²Π°Ρ… Π²Π½ΠΈΠ·Ρƒ ΠΌΠ°ΠΊΠ΅Ρ‚Π°, ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΡ Ρ†Π²Π΅Ρ‚ # 867859.

Π¨Π°Π³ 30

Π˜ΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠΉΡ‚Π΅ тСкстовый инструмСнт, Ρ‡Ρ‚ΠΎΠ±Ρ‹ Π΄ΠΎΠ±Π°Π²ΠΈΡ‚ΡŒ ΠΈΠ½Ρ„ΠΎΡ€ΠΌΠ°Ρ†ΠΈΡŽ ΠΎΠ± авторских ΠΏΡ€Π°Π²Π°Ρ… Π²Π½ΠΈΠ·Ρƒ ΠΌΠ°ΠΊΠ΅Ρ‚Π°, Ρ†Π²Π΅Ρ‚: # 867859

ΠšΠΎΠ½Π΅Ρ‡Π½Ρ‹ΠΉ ΠΏΡ€ΠΎΠ΄ΡƒΠΊΡ‚ выглядит ΡΠ»Π΅Π΄ΡƒΡŽΡ‰ΠΈΠΌ ΠΎΠ±Ρ€Π°Π·ΠΎΠΌ:

ΠžΠΏΡ‹Ρ‚:

Π’ этом руководствС Π΅ΡΡ‚ΡŒ 2 особСнности: ΠΎΠ΄Π½Π° — это маска, которая ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠ΅Ρ‚ΡΡ Ρ‡Π°Ρ‰Π΅, другая — эффСкт Π΄Π²ΠΎΠΉΠ½ΠΎΠ³ΠΎ ΠΎΠ±Π²ΠΎΠ΄ΠΊΠΈ (с использованиСм Π²Π½ΡƒΡ‚Ρ€Π΅Π½Π½Π΅Π³ΠΎ свСчСния ΠΈ ΠΎΠ±Π²ΠΎΠ΄ΠΊΠΈ для ΠΈΠΌΠΈΡ‚Π°Ρ†ΠΈΠΈ эффСкта Π΄Π²ΠΎΠΉΠ½ΠΎΠ³ΠΎ ΠΎΠ±Π²ΠΎΠ΄ΠΊΠΈ).

Π”Π°Π½ΡŒ Talk-Mania, надСюсь, я смогу ΡƒΠ²ΠΈΠ΄Π΅Ρ‚ΡŒ ΠΏΠΎΡ…ΠΎΠΆΠΈΠ΅ высококачСствСнныС ΡƒΡ‡Π΅Π±Π½Ρ‹Π΅ сайты для PS

Π­Ρ‚Π° ΡΡ‚Π°Ρ‚ΡŒΡ воспроизвСдСна ΠΈΠ· Π±Π»ΠΎΠ³Π° Wancang Yimi Blog Park, исходная ссылка: http: // www.cnblogs.com/grenet/archive/2012/06/21/2553566.html, ΠŸΠΎΠΆΠ°Π»ΡƒΠΉΡΡ‚Π°, ΡΠ²ΡΠΆΠΈΡ‚Π΅ΡΡŒ с ΠΏΠ΅Ρ€Π²ΠΎΠ½Π°Ρ‡Π°Π»ΡŒΠ½Ρ‹ΠΌ Π°Π²Ρ‚ΠΎΡ€ΠΎΠΌ, Ссли Π²Π°ΠΌ Π½ΡƒΠΆΠ½ΠΎ ΠΏΠ΅Ρ€Π΅ΠΏΠ΅Ρ‡Π°Ρ‚Π°Ρ‚ΡŒ

Π‘ΠΎΠ·Π΄Π°ΠΉΡ‚Π΅ ΡƒΠ½ΠΈΠΊΠ°Π»ΡŒΠ½Ρ‹ΠΉ Π±Π΅Π·ΠΎΠ±Ρ€Π°Π·Π½Ρ‹ΠΉ ΠΌΠ°ΠΊΠ΅Ρ‚ Π²Π΅Π±-сайта

Π’Π²Π΅Π΄Π΅Π½ΠΈΠ΅

Из этого Ρ‚ΡƒΡ‚ΠΎΡ€ΠΈΠ°Π»Π° Π’Ρ‹ ΡƒΠ·Π½Π°Π΅Ρ‚Π΅, ΠΊΠ°ΠΊ ΡΠΎΠ·Π΄Π°Ρ‚ΡŒ ΡƒΠ½ΠΈΠΊΠ°Π»ΡŒΠ½Ρ‹ΠΉ ΡˆΠ΅Ρ€ΠΎΡ…ΠΎΠ²Π°Ρ‚Ρ‹ΠΉ Π΄ΠΈΠ·Π°ΠΉΠ½ Π²Π΅Π±-сайта. МногиС ΠΈΠ· задСйствованных Ρ‚Π΅Ρ…Π½ΠΈΠΊ довольно просты, Π½ΠΎ Π² этом ΡƒΡ€ΠΎΠΊΠ΅ я попытался ΠΎΠ±ΡŠΡΡΠ½ΠΈΡ‚ΡŒ свой ΠΌΡ‹ΡΠ»ΠΈΡ‚Π΅Π»ΡŒΠ½Ρ‹ΠΉ процСсс, Π»Π΅ΠΆΠ°Ρ‰ΠΈΠΉ Π² основС ΠΎΠΏΡ€Π΅Π΄Π΅Π»Π΅Π½Π½Ρ‹Ρ… дизайнСрских Ρ€Π΅ΡˆΠ΅Π½ΠΈΠΉ, Π° Ρ‚Π°ΠΊΠΆΠ΅ обрисовал, ΠΊΠ°ΠΊ ΠΏΠΎΠ»ΡƒΡ‡ΠΈΡ‚ΡŒ ΠΌΠ°ΠΊΡΠΈΠΌΠ°Π»ΡŒΠ½ΡƒΡŽ ΠΎΡ‚Π΄Π°Ρ‡Ρƒ ΠΎΡ‚ Π²Π°ΡˆΠΈΡ… Π³Ρ€Π°Π½ΠΆΠ΅Π²Ρ‹Ρ… Π΄ΠΈΠ·Π°ΠΉΠ½ΠΎΠ².

ΠžΠΊΠΎΠ½Ρ‡Π°Ρ‚Π΅Π»ΡŒΠ½ΠΎΠ΅ ΠΈΠ·ΠΎΠ±Ρ€Π°ΠΆΠ΅Π½ΠΈΠ΅

Π­Ρ‚ΠΎ послСднСС ΠΈΠ·ΠΎΠ±Ρ€Π°ΠΆΠ΅Π½ΠΈΠ΅, ΠΊΠΎΡ‚ΠΎΡ€ΠΎΠ΅ ΠΌΡ‹ Π±ΡƒΠ΄Π΅ΠΌ ΡΠΎΠ·Π΄Π°Π²Π°Ρ‚ΡŒ:

Π¨Π°Π³ 1

Π‘ΠΎΠ·Π΄Π°ΠΉΡ‚Π΅ Π½ΠΎΠ²Ρ‹ΠΉ Π΄ΠΎΠΊΡƒΠΌΠ΅Π½Ρ‚ (1000X800 пиксСлСй).Π‘ΠΎΠ·Π΄Π°ΠΉΡ‚Π΅ Π½ΠΎΠ²Ρ‹ΠΉ слой для вашСго Ρ„ΠΎΠ½Π° ΠΈ Π·Π°Π»Π΅ΠΉΡ‚Π΅ Π΅Π³ΠΎ E3D4B9.

Π¨Π°Π³ 2

Π’Π΅ΠΏΠ΅Ρ€ΡŒ Π²ΡΡ‚Π°Π²ΡŒΡ‚Π΅ ΠΈΠ·ΠΎΠ±Ρ€Π°ΠΆΠ΅Π½ΠΈΠ΅ Π»ΠΈΠ½ΠΎΠ²Π°Π½Π½ΠΎΠΉ Π±ΡƒΠΌΠ°Π³ΠΈ. Π― использовал ΠΏΠ΅Ρ€Π²ΡƒΡŽ Ρ„ΠΎΡ‚ΠΎΠ³Ρ€Π°Ρ„ΠΈΡŽ ΠΈΠ· нашСго бСсплатного Π½Π°Π±ΠΎΡ€Π° тСкстур Π±ΡƒΠΌΠ°Π³ΠΈ, Π²Ρ‹ΠΏΡƒΡ‰Π΅Π½Π½ΠΎΠ³ΠΎ прямо здСсь, Π² PSDFAN. Π’Ρ‹Ρ€Π΅ΠΆΡŒΡ‚Π΅ Π±ΡƒΠΌΠ°Π³Ρƒ с ΠΏΠΎΠΌΠΎΡ‰ΡŒΡŽ инструмСнта «волшСбная ΠΏΠ°Π»ΠΎΡ‡ΠΊΠ°Β» ΠΈ ΠΏΠ΅Ρ€Π΅ΠΉΠ΄ΠΈΡ‚Π΅ Π² мСню Β«Π˜Π·ΠΎΠ±Ρ€Π°ΠΆΠ΅Π½ΠΈΠ΅Β»> Β«ΠšΠΎΡ€Ρ€Π΅ΠΊΡ†ΠΈΡΒ»> Β«ΠžΠ±Π΅ΡΡ†Π²Π΅Ρ‚ΠΈΡ‚ΡŒΒ». Π—Π°Ρ‚Π΅ΠΌ ΠΏΡ€ΠΈΠΌΠ΅Π½ΠΈΡ‚Π΅ ΠΏΠ°Ρ€Π°ΠΌΠ΅Ρ‚Ρ€Ρ‹ Ρ‚Π΅Π½ΠΈ, ΠΏΠΎΠΊΠ°Π·Π°Π½Π½Ρ‹Π΅ Π½ΠΈΠΆΠ΅:

Π¨Π°Π³ 3

Π’Π΅ΠΏΠ΅Ρ€ΡŒ я взял нСсколько ΠΈΠ·ΠΎΠ±Ρ€Π°ΠΆΠ΅Π½ΠΈΠΉ ΠΈΠ· нашСго ΠΏΠ°ΠΊΠ΅Ρ‚Π° «ΠžΡΠ½ΠΎΠ²Ρ‹ Π³Ρ€Π°Π½ΠΆ».Π― Π½Π°Ρ‡ΠΈΠ½Π°ΡŽ с размСщСния ΠΊΠΎΡ„Π΅ΠΉΠ½Ρ‹Ρ… пятСн Π½Π° Π»ΠΈΠ½ΠΎΠ²Π°Π½Π½ΠΎΠΉ Π±ΡƒΠΌΠ°Π³Π΅, Π·Π°Ρ‚Π΅ΠΌ, Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΡƒΠ±Π΅Π΄ΠΈΡ‚ΡŒΡΡ, Ρ‡Ρ‚ΠΎ ΠΎΠ½ΠΈ Π²ΠΈΠ΄Π½Ρ‹ Ρ‚ΠΎΠ»ΡŒΠΊΠΎ Π½Π° ΠΌΠΎΠ΅ΠΉ Π±ΡƒΠΌΠ°Π³Π΅, Π° Π½Π΅ Π½Π° ΠΌΠΎΠ΅ΠΌ Ρ„ΠΎΠ½Π΅, я Π²Ρ‹Π±ΠΈΡ€Π°ΡŽ свой Π±ΡƒΠΌΠ°ΠΆΠ½Ρ‹ΠΉ слой, Ρ‰Π΅Π»ΠΊΠ°ΡŽ Π³Π΄Π΅-Π½ΠΈΠ±ΡƒΠ΄ΡŒ Π²ΠΎΠΊΡ€ΡƒΠ³ Π½Π΅Π³ΠΎ с ΠΏΠΎΠΌΠΎΡ‰ΡŒΡŽ инструмСнта волшСбной ΠΏΠ°Π»ΠΎΡ‡ΠΊΠΈ, Π·Π°Ρ‚Π΅ΠΌ Π²Ρ‹Π±ΠΈΡ€Π°ΡŽ ΠΌΠΎΠΉ слой с ΠΊΠΎΡ„Π΅ΠΉΠ½Ρ‹ΠΌΠΈ пятнами ΠΈ Π½Π°ΠΆΠΌΠΈΡ‚Π΅ ΡƒΠ΄Π°Π»ΠΈΡ‚ΡŒ. Π£ΠΌΠ΅Π½ΡŒΡˆΠΈΡ‚Π΅ Π½Π΅ΠΏΡ€ΠΎΠ·Ρ€Π°Ρ‡Π½ΠΎΡΡ‚ΡŒ слоСв ΠΊΠΎΡ„Π΅ΠΉΠ½Ρ‹Ρ… пятСн Π΄ΠΎ 25%. Π’Π΅ΠΏΠ΅Ρ€ΡŒ помСститС ΠΈΠ·ΠΎΠ±Ρ€Π°ΠΆΠ΅Π½ΠΈΠ΅ скрСпки ΠΏΠΎΠ²Π΅Ρ€Ρ… Π±ΡƒΠΌΠ°Π³ΠΈ ΠΈ с ΠΏΠΎΠΌΠΎΡ‰ΡŒΡŽ инструмСнта лассо ΠΎΡ‚Ρ€Π΅ΠΆΡŒΡ‚Π΅ Ρ‡Π°ΡΡ‚ΡŒ скрСпки, которая Π΄ΠΎΠ»ΠΆΠ½Π° Π±Ρ‹Ρ‚ΡŒ ΠΏΠΎΠ·Π°Π΄ΠΈ Π±ΡƒΠΌΠ°Π³ΠΈ. Π—Π°Ρ‚Π΅ΠΌ ΠΏΡ€ΠΈΠ΄Π°ΠΉΡ‚Π΅ Π΅ΠΌΡƒ Π»Π΅Π³ΠΊΡƒΡŽ Ρ‚Π΅Π½ΡŒ. Π—Π°Ρ‚Π΅ΠΌ Π²ΡΡ‚Π°Π²ΡŒΡ‚Π΅ изобраТСния ΠΈΠ· Π»ΠΈΠΏΠΊΠΎΠΉ Π»Π΅Π½Ρ‚Ρ‹ (Ρ‚Π°ΠΊΠΆΠ΅ ΠΈΠ· нашСго Π½Π°Π±ΠΎΡ€Π° ΠΏΡ€Π΅Π΄ΠΌΠ΅Ρ‚ΠΎΠ² ΠΏΠ΅Ρ€Π²ΠΎΠΉ нСобходимости Π² стилС Π³Ρ€Π°Π½ΠΆ).Π― Ρ‚Π°ΠΊΠΆΠ΅ помСстил это ΠΈΠ·ΠΎΠ±Ρ€Π°ΠΆΠ΅Π½ΠΈΠ΅, хотя Π½Π° ΡΠ»Π΅Π΄ΡƒΡŽΡ‰Π΅ΠΌ шагС я объясню, ΠΊΠ°ΠΊ я это сдСлал, Π±ΠΎΠ»Π΅Π΅ ΠΏΠΎΠ΄Ρ€ΠΎΠ±Π½ΠΎ. НаконСц, я Π΄ΠΎΠ±Π°Π²ΠΈΠ» тСкст Π² свою Π·Π°ΠΌΠ΅Ρ‚ΠΊΡƒ (ΡˆΡ€ΠΈΡ„Ρ‚: Handwriting Dakota).

НСкоторыС ΡƒΠΊΠ°Π·Π°Ρ‚Π΅Π»ΠΈ

Π“Ρ€Π°Π½ΠΆ-Π΄ΠΈΠ·Π°ΠΉΠ½ — это идСальноС сочСтаниС ΠΈΠ·ΠΎΠ±Ρ€Π°ΠΆΠ΅Π½ΠΈΠΉ. Π§Ρ‚ΠΎΠ±Ρ‹ клСйкая Π»Π΅Π½Ρ‚Π° смСшалась с ΠΎΡΡ‚Π°Π»ΡŒΠ½ΠΎΠΉ Ρ‡Π°ΡΡ‚ΡŒΡŽ ΠΌΠΎΠ΅Π³ΠΎ ΠΌΠ°ΠΊΠ΅Ρ‚Π°, я ΡƒΠΌΠ΅Π½ΡŒΡˆΠ°ΡŽ Π½Π°ΡΡ‹Ρ‰Π΅Π½Π½ΠΎΡΡ‚ΡŒ изобраТСния Π΄ΠΎ -45 (ΠΈΠ·ΠΎΠ±Ρ€Π°ΠΆΠ΅Π½ΠΈΠ΅> настройки> ΠΎΡ‚Ρ‚Π΅Π½ΠΎΠΊ / Π½Π°ΡΡ‹Ρ‰Π΅Π½Π½ΠΎΡΡ‚ΡŒ). Π― Ρ‚Π°ΠΊΠΆΠ΅ ΡƒΠΌΠ΅Π½ΡŒΡˆΠ°ΡŽ Π½Π΅ΠΏΡ€ΠΎΠ·Ρ€Π°Ρ‡Π½ΠΎΡΡ‚ΡŒ слоя с Π»ΠΈΠΏΠΊΠΎΠΉ Π»Π΅Π½Ρ‚ΠΎΠΉ Π΄ΠΎ 90%, Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΡΠΎΠ·Π΄Π°Ρ‚ΡŒ иллюзию Π½Π΅Π±ΠΎΠ»ΡŒΡˆΠΈΡ… Π²Π°Ρ€ΠΈΠ°Ρ†ΠΈΠΉ Π½Π° повСрхностях, ΠΊΠΎΡ‚ΠΎΡ€Ρ‹Π΅ ΠΎΠ½ ΠΏΠΎΠΊΡ€Ρ‹Π²Π°Π΅Ρ‚.Для своСго изобраТСния я ΠΊΠ°Ρ€Π΄ΠΈΠ½Π°Π»ΡŒΠ½ΠΎ ΠΈΠ·ΠΌΠ΅Π½ΠΈΠ» Π½Π°ΡΡ‹Ρ‰Π΅Π½Π½ΠΎΡΡ‚ΡŒ ΠΈ ΡΡ€ΠΊΠΎΡΡ‚ΡŒ / Ρ‚Π΅ΠΌΠ½ΠΎΡ‚Ρƒ, Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΠΎΠ½ Ρ…ΠΎΡ€ΠΎΡˆΠΎ сочСтался с Π΄Ρ€ΡƒΠ³ΠΈΠΌΠΈ ΠΌΠΎΠΈΠΌΠΈ элСмСнтами Π³Ρ€Π°Π½ΠΆΠ°.

Π•Ρ‰Π΅ ΠΎΠ΄ΠΈΠ½ совСт для Π³Ρ€Π°Π½ΠΆΠ΅Π²ΠΎΠ³ΠΎ Π΄ΠΈΠ·Π°ΠΉΠ½Π° — Π²Π°Ρ€ΡŒΠΈΡ€ΡƒΠΉΡ‚Π΅ Π²ΠΈΠ·ΡƒΠ°Π»ΡŒΠ½Ρ‹Π΅ элСмСнты. МоТно ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚ΡŒ ΠΎΠ΄Π½ΠΈ ΠΈ Ρ‚Π΅ ΠΆΠ΅ изобраТСния снова ΠΈ снова, Π½ΠΎ Π²Ρ‹ Π½Π΅ ΠΌΠΎΠΆΠ΅Ρ‚Π΅ ΡΠ΄Π΅Π»Π°Ρ‚ΡŒ Ρ‚Π°ΠΊ, Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΠΎΠ½ΠΈ выглядСли ΠΎΠ΄ΠΈΠ½Π°ΠΊΠΎΠ²ΠΎ. ΠŸΡ€ΠΈ ΠΊΠ°ΠΆΠ΄ΠΎΠΌ использовании ΠΌΠΎΠ΅Π³ΠΎ изобраТСния Π½Π° Π»ΠΈΠΏΠΊΠΎΠΉ Π»Π΅Π½Ρ‚Π΅ я пытался Π½Π΅ΠΌΠ½ΠΎΠ³ΠΎ ΠΈΠ·ΠΌΠ΅Π½ΠΈΡ‚ΡŒ Π΅Π³ΠΎ Ρ€Π°Π·ΠΌΠ΅Ρ€ / ΠΏΠΎΠ²Π΅Ρ€Π½ΡƒΡ‚ΡŒ, Π° Ρ‚Π°ΠΊΠΆΠ΅ слСгка ΠΈΠ·ΠΌΠ΅Π½ΠΈΡ‚ΡŒ ΡΡ€ΠΊΠΎΡΡ‚ΡŒ / Π½Π°ΡΡ‹Ρ‰Π΅Π½Π½ΠΎΡΡ‚ΡŒ. Π­Ρ‚ΠΎ ΠΏΠΎΠΌΠΎΠ³Π°Π΅Ρ‚ ΡΠΎΠ·Π΄Π°Ρ‚ΡŒ Π½Π΅Π°ΠΊΠΊΡƒΡ€Π°Ρ‚Π½Ρ‹ΠΉ ΠΎΠ±Ρ‰ΠΈΠΉ Π²ΠΈΠ΄ Π³Ρ€Π°Π½ΠΆΠ°.

Π¨Π°Π³ 4

ΠŸΠΎΠ΄ΡƒΠΌΠ°Π² ΠΎ Ρ‚ΠΎΠΌ, ΠΊΠ°ΠΊ Ρ€Π°Π·Π½Ρ‹Π΅ элСмСнты Ρ…ΠΎΡ€ΠΎΡˆΠΎ ΡΠΎΡ‡Π΅Ρ‚Π°ΡŽΡ‚ΡΡ Π΄Ρ€ΡƒΠ³ с Π΄Ρ€ΡƒΠ³ΠΎΠΌ, я Π½Π΅ ΠΌΠΎΠ³ Π½Π΅ Π·Π°ΠΌΠ΅Ρ‚ΠΈΡ‚ΡŒ, ΠΊΠ°ΠΊ Ρ‡Π΅Ρ€Π½ΠΎ-Π±Π΅Π»ΠΎΠ΅ ΠΈΠ·ΠΎΠ±Ρ€Π°ΠΆΠ΅Π½ΠΈΠ΅ с Π»ΠΈΠ½ΠΎΠ²Π°Π½Π½ΠΎΠΉ Π±ΡƒΠΌΠ°Π³ΠΎΠΉ Π² ΠΎΡ‚Ρ‚Π΅Π½ΠΊΠ°Ρ… сСрого выглядСло Π½Π΅ΠΌΠ½ΠΎΠ³ΠΎ плоским, Π±ΡƒΠ΄ΡƒΡ‡ΠΈ Ρ‡Π΅Ρ€Π½ΠΎ-Π±Π΅Π»Ρ‹ΠΌ.Π§Ρ‚ΠΎΠ±Ρ‹ ΠΏΡ€ΠΈΠ΄Π°Ρ‚ΡŒ Π΅ΠΌΡƒ ΠΎΡ‚Ρ‚Π΅Π½ΠΎΠΊ Ρ†Π²Π΅Ρ‚Π°, я ΠΏΠ΅Ρ€Π΅ΡˆΠ΅Π» Π² Π˜Π·ΠΎΠ±Ρ€Π°ΠΆΠ΅Π½ΠΈΠ΅> ΠšΠΎΡ€Ρ€Π΅ΠΊΡ†ΠΈΡ> Π¦Π²Π΅Ρ‚ΠΎΠ²ΠΎΠΉ баланс ΠΈ ΠΏΡ€ΠΈΠΌΠ΅Π½ΠΈΠ» настройки, ΠΏΠΎΠΊΠ°Π·Π°Π½Π½Ρ‹Π΅ Π½ΠΈΠΆΠ΅. Π­Ρ‚ΠΎ ΠΏΠΎΠ·Π²ΠΎΠ»ΠΈΠ»ΠΎ Π΅ΠΌΡƒ Π»ΡƒΡ‡ΡˆΠ΅ ΡΠΎΡ‡Π΅Ρ‚Π°Ρ‚ΡŒΡΡ с Π΄Ρ€ΡƒΠ³ΠΈΠΌΠΈ элСмСнтами.

Π¨Π°Π³ 5

Π’Π΅ΠΏΠ΅Ρ€ΡŒ я Π±Π΅Ρ€Ρƒ ΠΈΠ·ΠΎΠ±Ρ€Π°ΠΆΠ΅Π½ΠΈΠ΅ солнСчных Π»ΡƒΡ‡Π΅ΠΉ ΠΈΠ· нашСго Π½Π°Π±ΠΎΡ€Π° Sunburst Π² высоком Ρ€Π°Π·Ρ€Π΅ΡˆΠ΅Π½ΠΈΠΈ. Π― Π²ΡΡ‚Π°Π²Π»ΡΡŽ Π΅Π³ΠΎ Ρ‚Π°ΠΊ, Ρ‡Ρ‚ΠΎΠ±Ρ‹ Ρ†Π΅Π½Ρ‚Ρ€ солнСчных Π»ΡƒΡ‡Π΅ΠΉ находился Π·Π° ΠΌΠΎΠΈΠΌ пост-ΠΈΠ·ΠΎΠ±Ρ€Π°ΠΆΠ΅Π½ΠΈΠ΅ΠΌ. Π§Ρ‚ΠΎΠ±Ρ‹ ΡƒΠ΄Π°Π»ΠΈΡ‚ΡŒ части солнСчных Π»ΡƒΡ‡Π΅ΠΉ, ΠΏΠ΅Ρ€Π΅ΠΊΡ€Ρ‹Π²Π°ΡŽΡ‰ΠΈΠ΅ мою Π±ΡƒΠΌΠ°Π³Ρƒ, я Π²Ρ‹Π±ΠΈΡ€Π°ΡŽ свой Π±ΡƒΠΌΠ°ΠΆΠ½Ρ‹ΠΉ слой, Ρ‰Π΅Π»ΠΊΠ°ΡŽ Π·Π° Π΅Π³ΠΎ ΠΏΡ€Π΅Π΄Π΅Π»Π°ΠΌΠΈ с ΠΏΠΎΠΌΠΎΡ‰ΡŒΡŽ волшСбной ΠΏΠ°Π»ΠΎΡ‡ΠΊΠΈ, Π·Π°Ρ‚Π΅ΠΌ Π²Ρ‹Π±ΠΈΡ€Π°ΡŽ ΠΌΠΎΠΉ слой солнСчных Π»ΡƒΡ‡Π΅ΠΉ ΠΈ наТимаю ΡƒΠ΄Π°Π»ΠΈΡ‚ΡŒ.Π― Ρ‚Π°ΠΊΠΆΠ΅ Π²Ρ‹Π΄Π΅Π»ΡΡŽ ΠΊΠ°ΠΆΠ΄ΠΎΠ΅ отвСрстиС Π² Π²Π΅Ρ€Ρ…Π½Π΅ΠΉ части Π±ΡƒΠΌΠ°ΠΆΠ½ΠΎΠ³ΠΎ изобраТСния ΠΈ ΠΏΠΎΠ²Ρ‚ΠΎΡ€ΡΡŽ Ρ‚ΠΎΡ‚ ΠΆΠ΅ шаг. Π—Π°Ρ‚Π΅ΠΌ установитС Ρ€Π΅ΠΆΠΈΠΌ налоТСния ΠΌΠΎΠ΅Π³ΠΎ слоя с солнСчными Π»ΡƒΡ‡Π°ΠΌΠΈ Π½Π° Β«Π·Π°Ρ‚Π΅ΠΌΠ½Π΅Π½ΠΈΠ΅ Ρ†Π²Π΅Ρ‚Π°Β» ΠΈ ΡƒΠΌΠ΅Π½ΡŒΡˆΠΈΡ‚Π΅ Π½Π΅ΠΏΡ€ΠΎΠ·Ρ€Π°Ρ‡Π½ΠΎΡΡ‚ΡŒ слоя Π΄ΠΎ 8%. Π­Ρ‚ΠΎ Π΄Π°Π΅Ρ‚ эффСкт Π°ΠΊΠ²Π°Ρ€Π΅Π»ΠΈ.

Π¨Π°Π³ 6

Π’Π΅ΠΏΠ΅Ρ€ΡŒ создайтС Π½ΠΎΠ²Ρ‹ΠΉ Π΄ΠΎΠΊΡƒΠΌΠ΅Π½Ρ‚ ΠΈ нарисуйтС Ρ‚Π΅ΠΌΠ½ΠΎ-ΠΊΠΎΡ€ΠΈΡ‡Π½Π΅Π²Ρ‹ΠΉ ΠΊΠ²Π°Π΄Ρ€Π°Ρ‚ ΠΏΡ€ΠΈΠΌΠ΅Ρ€Π½ΠΎ посСрСдинС изобраТСния. Π’Ρ‹Π΄Π΅Π»ΠΈΠ² ΠΊΠ²Π°Π΄Ρ€Π°Ρ‚, Π²Ρ‹Π±Π΅Ρ€ΠΈΡ‚Π΅> ΠΈΠ·ΠΌΠ΅Π½ΠΈΡ‚ΡŒ> ΡΠΆΠ°Ρ‚ΡŒ ΠΈ ΡΡƒΠ·ΠΈΡ‚ΡŒ Π²Ρ‹Π΄Π΅Π»Π΅Π½ΠΈΠ΅ Π½Π° 10 пиксСлСй, Π·Π°Ρ‚Π΅ΠΌ Π½Π°ΠΆΠΌΠΈΡ‚Π΅ Β«Π£Π΄Π°Π»ΠΈΡ‚ΡŒΒ», Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΠΎΡΡ‚Π°Π²ΠΈΡ‚ΡŒ своСго Ρ€ΠΎΠ΄Π° Ρ€Π°ΠΌΠΊΡƒ.Π—Π°Ρ‚Π΅ΠΌ Π²ΠΎΠ·ΡŒΠΌΠΈΡ‚Π΅ ΠΊΠΈΡΡ‚ΡŒ-ластик ΠΈ сотритС ΠΊΠΎΡ€ΠΈΡ‡Π½Π΅Π²ΡƒΡŽ Ρ€Π°ΠΌΠΊΡƒ, ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΡ Π°ΠΊΠ²Π°Ρ€Π΅Π»ΡŒΠ½ΡƒΡŽ ΠΊΠΈΡΡ‚ΡŒ с Π½ΠΈΠ·ΠΊΠΎΠΉ Π½Π΅ΠΏΡ€ΠΎΠ·Ρ€Π°Ρ‡Π½ΠΎΡΡ‚ΡŒΡŽ. Π’Π΅ΠΏΠ΅Ρ€ΡŒ Π²ΠΎΠ·ΡŒΠΌΠΈΡ‚Π΅ ΠΈΠ·ΠΎΠ±Ρ€Π°ΠΆΠ΅Π½ΠΈΠ΅, ΠΊΠΎΡ‚ΠΎΡ€ΠΎΠ΅ Π²Ρ‹ Ρ…ΠΎΡ‚ΠΈΡ‚Π΅ ΠΏΠΎΠΌΠ΅ΡΡ‚ΠΈΡ‚ΡŒ Π² Ρ€Π°ΠΌΠΊΡƒ, ΠΈ ΠΈΠ·ΠΌΠ΅Π½ΠΈΡ‚Π΅ Π΅Π³ΠΎ Ρ€Π°Π·ΠΌΠ΅Ρ€ / ΠΎΠ±Ρ€Π΅ΠΆΡŒΡ‚Π΅ ΠΏΠΎ Ρ€Π°Π·ΠΌΠ΅Ρ€Ρƒ.

Π¨Π°Π³ 7

Π’ Ρ€Π°ΠΌΠΊΠ΅ Π΄ΠΎΠΊΡƒΠΌΠ΅Π½Ρ‚Π° скройтС основной Π±Π΅Π»Ρ‹ΠΉ Ρ„ΠΎΠ½ΠΎΠ²Ρ‹ΠΉ слой, Π° Π·Π°Ρ‚Π΅ΠΌ ΠΏΠ΅Ρ€Π΅ΠΉΠ΄ΠΈΡ‚Π΅ ΠΊ слою> ΠΎΠ±ΡŠΠ΅Π΄ΠΈΠ½ΠΈΡ‚ΡŒ Π²ΠΈΠ΄ΠΈΠΌΡ‹ΠΉ, Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΠΎΠ±ΡŠΠ΅Π΄ΠΈΠ½ΠΈΡ‚ΡŒ Ρ€Π°ΠΌΠΊΡƒ ΠΈ ΠΈΠ·ΠΎΠ±Ρ€Π°ΠΆΠ΅Π½ΠΈΠ΅. Π—Π°Ρ‚Π΅ΠΌ скопируйтС объСдинСнноС ΠΈΠ·ΠΎΠ±Ρ€Π°ΠΆΠ΅Π½ΠΈΠ΅ ΠΎΠ±Ρ€Π°Ρ‚Π½ΠΎ Π² исходный Π΄ΠΎΠΊΡƒΠΌΠ΅Π½Ρ‚. ΠŸΠΎΠ²Ρ‚ΠΎΡ€ΠΈΡ‚Π΅ этот этап, ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΡ Ρ€Π°Π·Π½Ρ‹Π΅ изобраТСния, ΠΏΠΎΠΊΠ° Ρƒ вас Π½Π΅ Π±ΡƒΠ΄Π΅Ρ‚ ΠΏΡ€ΠΈΠΌΠ΅Ρ€Π½ΠΎ 3 Π² вашСм основном Π΄ΠΈΠ·Π°ΠΉΠ½Π΅.ΠŸΡ€Π΅ΠΈΠΌΡƒΡ‰Π΅ΡΡ‚Π²ΠΎ создания ΠΈΠ·ΠΎΠ±Ρ€Π°ΠΆΠ΅Π½ΠΈΠΉ Π² Π½ΠΎΠ²ΠΎΠΌ Π΄ΠΎΠΊΡƒΠΌΠ΅Π½Ρ‚Π΅ Π·Π°ΠΊΠ»ΡŽΡ‡Π°Π΅Ρ‚ΡΡ Π² Ρ‚ΠΎΠΌ, Ρ‡Ρ‚ΠΎ Π²Ρ‹ ΠΌΠΎΠΆΠ΅Ρ‚Π΅ Π»Π΅Π³ΠΊΠΎ ΠΈΠ·ΠΌΠ΅Π½ΠΈΡ‚ΡŒ ΠΎΠ±Ρ€Π°ΠΌΠ»Π΅Π½Π½ΠΎΠ΅ ΠΈΠ·ΠΎΠ±Ρ€Π°ΠΆΠ΅Π½ΠΈΠ΅, Π° Π·Π°Ρ‚Π΅ΠΌ ΠΎΠ±ΡŠΠ΅Π΄ΠΈΠ½ΠΈΡ‚ΡŒ / ΡΠΊΠΎΠΏΠΈΡ€ΠΎΠ²Π°Ρ‚ΡŒ Π΅Π³ΠΎ ΠΎΠ±Ρ€Π°Ρ‚Π½ΠΎ Π² исходный Π΄ΠΈΠ·Π°ΠΉΠ½. Π― Ρ‚Π°ΠΊΠΆΠ΅ Π΄ΠΎΠ±Π°Π²ΠΈΠ» тСкст ΠΈ стрСлку Π½Π°Π΄ этими изобраТСниями.

Π¨Π°Π³ 8

Π’Π΅ΠΏΠ΅Ρ€ΡŒ Π²ΡΡ‚Π°Π²ΡŒΡ‚Π΅ Π΄Ρ€ΡƒΠ³ΠΎΠ΅ ΠΈΠ·ΠΎΠ±Ρ€Π°ΠΆΠ΅Π½ΠΈΠ΅ ΠΈΠ· нашСго Π½Π°Π±ΠΎΡ€Π° тСкстур Π±ΡƒΠΌΠ°Π³ΠΈ Π² ниТнюю Ρ‡Π°ΡΡ‚ΡŒ Π΄ΠΈΠ·Π°ΠΉΠ½Π°. ΠžΠ±ΡΠ·Π°Ρ‚Π΅Π»ΡŒΠ½ΠΎ создайтС Π½ΠΎΠ²Ρ‹ΠΉ Π½Π°Π±ΠΎΡ€ слоСв ΠΏΠΎΠ΄ основной ΠΎΠ±Π»Π°ΡΡ‚ΡŒΡŽ Π»ΠΈΠ½ΠΎΠ²Π°Π½Π½ΠΎΠΉ Π±ΡƒΠΌΠ°Π³ΠΈ, Ρ‚Π°ΠΊ ΠΊΠ°ΠΊ ΠΌΡ‹ Ρ…ΠΎΡ‚ΠΈΠΌ, Ρ‡Ρ‚ΠΎΠ±Ρ‹ этот Ρ€Π°Π·Π΄Π΅Π» располагался Π½ΠΈΠΆΠ΅ этой области. Π§Ρ‚ΠΎΠ±Ρ‹ красиво ΡΠΌΠ΅ΡˆΠ°Ρ‚ΡŒ Π΅Π³ΠΎ с Ρ„ΠΎΠ½ΠΎΠΌ, я установил Ρ€Π΅ΠΆΠΈΠΌ налоТСния слоя Π½Π° Β«linear BurnΒ» ΠΈ ΡƒΠΌΠ΅Π½ΡŒΡˆΠΈΠ» Π΅Π³ΠΎ Π½Π΅ΠΏΡ€ΠΎΠ·Ρ€Π°Ρ‡Π½ΠΎΡΡ‚ΡŒ Π΄ΠΎ 30%.Π― Ρ‚Π°ΠΊΠΆΠ΅ ΠΏΡ€ΠΈΠΌΠ΅Π½ΠΈΠ» настройки Π²Π½ΡƒΡ‚Ρ€Π΅Π½Π½Π΅ΠΉ Ρ‚Π΅Π½ΠΈ, ΠΏΠΎΠΊΠ°Π·Π°Π½Π½Ρ‹Π΅ Π½ΠΈΠΆΠ΅, Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΠΏΡ€ΠΈΠ΄Π°Ρ‚ΡŒ эффСкт Π³Π»ΡƒΠ±ΠΈΠ½Ρ‹.

Π¨Π°Π³ 9

Π­Ρ‚Π° Ρ‡Π°ΡΡ‚ΡŒ Π΄Π΅ΠΉΡΡ‚Π²ΠΈΡ‚Π΅Π»ΡŒΠ½ΠΎ зависит ΠΎΡ‚ вашСго творчСства. Π˜ΡΠΏΠΎΠ»ΡŒΠ·ΡƒΡ ΠΊΠ°ΠΊ ΠΌΠΎΠΆΠ½ΠΎ большС тСкстур Π±ΡƒΠΌΠ°Π³ΠΈ, Π½Π°Ρ‡Π½ΠΈΡ‚Π΅ Π½Π°ΠΊΠ»Π΅ΠΈΠ²Π°Ρ‚ΡŒ кусочки Π±ΡƒΠΌΠ°Π³ΠΈ ΠΏΠΎ всСму Π΄ΠΈΠ·Π°ΠΉΠ½Ρƒ. Π£Π±Π΅Π΄ΠΈΡ‚Π΅ΡΡŒ, Ρ‡Ρ‚ΠΎ ΠΎΠ½ΠΈ Ρ…ΠΎΡ€ΠΎΡˆΠΎ ΡΠΎΡ‡Π΅Ρ‚Π°ΡŽΡ‚ΡΡ Π΄Ρ€ΡƒΠ³ с Π΄Ρ€ΡƒΠ³ΠΎΠΌ, ΠΎΡ‚Ρ€Π΅Π³ΡƒΠ»ΠΈΡ€ΠΎΠ²Π°Π² ΠΎΡ‚Ρ‚Π΅Π½ΠΊΠΈ / ΡΡ€ΠΊΠΎΡΡ‚ΡŒ изобраТСния. Π― Ρ‚Π°ΠΊΠΆΠ΅ Π½Π°ΠΊΠ»Π΅ΠΈΠ» ΠΈΠ·ΠΎΠ±Ρ€Π°ΠΆΠ΅Π½ΠΈΠ΅ Π½Π° Π»ΠΈΠΏΠΊΠΎΠΉ Π»Π΅Π½Ρ‚Π΅ Π΅Ρ‰Π΅ нСсколько Ρ€Π°Π·, Ρ‡Ρ‚ΠΎΠ±Ρ‹ Π΄ΠΎΠ±Π°Π²ΠΈΡ‚ΡŒ Ρ„ΠΎΠ½Π°, Π½ΠΎ слСдил Π·Π° Ρ‚Π΅ΠΌ, Ρ‡Ρ‚ΠΎΠ±Ρ‹ Π½Π΅ΠΏΡ€ΠΎΠ·Ρ€Π°Ρ‡Π½ΠΎΡΡ‚ΡŒ ΠΎΡΡ‚Π°Π²Π°Π»Π°ΡΡŒ Π½ΠΈΠ·ΠΊΠΎΠΉ, Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΠΎΠ½Π° Π½Π΅ Π±Ρ‹Π»Π° Ρ‡Ρ€Π΅Π·ΠΌΠ΅Ρ€Π½ΠΎΠΉ.Π₯ΠΈΡ‚Ρ€ΠΎΡΡ‚ΡŒ Π·Π°ΠΊΠ»ΡŽΡ‡Π°Π΅Ρ‚ΡΡ Π² Ρ‚ΠΎΠΌ, Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΠΎΠ±ΡŠΠ΅Π΄ΠΈΠ½ΠΈΡ‚ΡŒ ΠΊΠ°ΠΊ ΠΌΠΎΠΆΠ½ΠΎ большС ΠΈΠ·ΠΎΠ±Ρ€Π°ΠΆΠ΅Π½ΠΈΠΉ, Π½Π΅ ΠΎΡ‚Π²Π»Π΅ΠΊΠ°ΡΡΡŒ ΠΈ Π½Π΅ ΠΎΡ‚Π²Π»Π΅ΠΊΠ°ΡΡΡŒ. Π›ΡƒΡ‡ΡˆΠ΅ всСго, Ρ‡Ρ‚ΠΎΠ±Ρ‹ Π½Π΅ΠΏΡ€ΠΎΠ·Ρ€Π°Ρ‡Π½ΠΎΡΡ‚ΡŒ Π±ΠΎΠ»ΡŒΡˆΠΈΠ½ΡΡ‚Π²Π° слоСв Π±Ρ‹Π»Π° ΠΎΡ‡Π΅Π½ΡŒ Π½ΠΈΠ·ΠΊΠΎΠΉ, Ρ‚Π°ΠΊ ΠΊΠ°ΠΊ Ρ‚ΠΎΠ³Π΄Π° Π²Ρ‹ ΠΌΠΎΠΆΠ΅Ρ‚Π΅ ΡΠΎΠ·Π΄Π°Ρ‚ΡŒ Π΄Π΅ΠΉΡΡ‚Π²ΠΈΡ‚Π΅Π»ΡŒΠ½ΠΎ ΡˆΠ΅Ρ€ΠΎΡ…ΠΎΠ²Π°Ρ‚Ρ‹ΠΉ Π²ΠΈΠ΄, Π½Π΅ отвлСкая Π²Π½ΠΈΠΌΠ°Π½ΠΈΠ΅ ΠΎΡ‚ областСй содСрТимого.

Π¨Π°Π³ 10

Π’Π΅ΠΏΠ΅Ρ€ΡŒ я добавляю Π΅Ρ‰Π΅ нСсколько Π΄Π΅Ρ‚Π°Π»Π΅ΠΉ, Ρ‚Π°ΠΊΠΈΡ… ΠΊΠ°ΠΊ пятна ΠΎΡ‚ ΠΊΠΎΡ„Π΅ / скрСпки, ΠΈ добавляю этикСтку ΠΈΠ· своСго Π½Π°Π±ΠΎΡ€Π° Grunge Essentials Pack. НаконСц, я добавляю тСкст ΠΊ ΠΌΠ΅Ρ‚ΠΊΠ΅, просто набирая Π΅Π³ΠΎ, Π° Π·Π°Ρ‚Π΅ΠΌ ΠΏΠ΅Ρ€Π΅Ρ…ΠΎΠΆΡƒ ΠΊ Ρ€Π΅Π΄Π°ΠΊΡ‚ΠΈΡ€ΠΎΠ²Π°Π½ΠΈΡŽ> ΠΏΡ€Π΅ΠΎΠ±Ρ€Π°Π·ΠΎΠ²Π°Π½ΠΈΡŽ> ΠΏΠΎΠ²ΠΎΡ€ΠΎΡ‚Ρƒ ΠΈ ΠΏΡ€Π°Π²ΠΈΠ»ΡŒΠ½ΠΎΠΉ ΠΏΠΎΠ΄Π³ΠΎΠ½ΠΊΠ΅.

Π¨Π°Π³ 11

Π’Π΅ΠΏΠ΅Ρ€ΡŒ создадим мСню сайта. Π― Π½Π°Π±ΠΈΡ€Π°ΡŽ ссылки мСню Π½Π° листС Π±ΡƒΠΌΠ°Π³ΠΈ Ρ‡ΡƒΡ‚ΡŒ Π½ΠΈΠΆΠ΅ ΠΌΠΎΠ΅Π³ΠΎ ярлыка. Π—Π°Ρ‚Π΅ΠΌ я ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΡŽ свой инструмСнт Π»ΠΈΠ½ΠΈΠΈ ΠΈ инструмСнт ΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚Π΅Π»ΡŒΡΠΊΠΈΡ… Ρ„ΠΈΠ³ΡƒΡ€, Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΡΠΎΠ·Π΄Π°Ρ‚ΡŒ нСсколько Ρ€Π°Π·Π΄Π΅Π»ΠΈΡ‚Π΅Π»ΡŒΠ½Ρ‹Ρ… Π»ΠΈΠ½ΠΈΠΉ ΠΈ стрСлок рядом со ссылками Π² мСню. Π“Ρ€Π°Π½ΠΆ-Π΄ΠΈΠ·Π°ΠΉΠ½ Ρ…ΠΎΡ€ΠΎΡˆ Ρ‚Π΅ΠΌ, Ρ‡Ρ‚ΠΎ Π·Π°Ρ‡Π°ΡΡ‚ΡƒΡŽ Π½Π΅ Π½ΡƒΠΆΠ½ΠΎ Π±Ρ‹Ρ‚ΡŒ слишком Ρ‚ΠΎΡ‡Π½Ρ‹ΠΌ. ΠŸΡ€ΠΈ рисовании стрСлок ΠΈ Π»ΠΈΠ½ΠΈΠΉ Π²Π°ΠΌ Π½Π΅ Π½ΡƒΠΆΠ½ΠΎ Π±Π΅ΡΠΏΠΎΠΊΠΎΠΈΡ‚ΡŒΡΡ ΠΎ Ρ‚ΠΎΠΌ, Ρ‡Ρ‚ΠΎ всС ΠΎΠ½ΠΈ Π±ΡƒΠ΄ΡƒΡ‚ ΠΎΠ΄ΠΈΠ½Π°ΠΊΠΎΠ²ΠΎΠ³ΠΎ Ρ€Π°Π·ΠΌΠ΅Ρ€Π° ΠΈΠ»ΠΈ идСально Π²Ρ‹Ρ€ΠΎΠ²Π½Π΅Π½Ρ‹, просто нарисуйтС ΠΈΡ… Ρ‚Π°ΠΊ быстро ΠΈ Π³Ρ€ΡƒΠ±ΠΎ, ΠΊΠ°ΠΊ Π·Π°Ρ…ΠΎΡ‚ΠΈΡ‚Π΅.НаконСц, ΠΎΠ±ΡŠΠ΅Π΄ΠΈΠ½ΠΈΡ‚Π΅ всС ваши стрСлки Π² ΠΎΠ΄ΠΈΠ½ слой, Π° Π·Π°Ρ‚Π΅ΠΌ всС ваши Ρ€Π°Π·Π΄Π΅Π»ΠΈΡ‚Π΅Π»ΡŒΠ½Ρ‹Π΅ Π»ΠΈΠ½ΠΈΠΈ Π² ΠΎΠ΄ΠΈΠ½ слой. Π’ΠΎΠ·ΡŒΠΌΠΈΡ‚Π΅ ластик Π°ΠΊΠ²Π°Ρ€Π΅Π»ΡŒΠ½ΠΎΠΉ кисти с Π½ΠΈΠ·ΠΊΠΎΠΉ Π½Π΅ΠΏΡ€ΠΎΠ·Ρ€Π°Ρ‡Π½ΠΎΡΡ‚ΡŒΡŽ ΠΈ сотритС части Π»ΠΈΠ½ΠΈΠΉ / стрСлок, Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΡΠΎΠ·Π΄Π°Ρ‚ΡŒ Π±ΠΎΠ»Π΅Π΅ ΡˆΠ΅Ρ€ΠΎΡ…ΠΎΠ²Π°Ρ‚Ρ‹ΠΉ Π²ΠΈΠ΄.

Π¨Π°Π³ 12

Π’ΡΡ‚Π°Π²ΡŒΡ‚Π΅ красивоС ΠΈΠ·ΠΎΠ±Ρ€Π°ΠΆΠ΅Π½ΠΈΠ΅ Π½Π° Π»ΠΈΠ½ΠΎΠ²Π°Π½Π½ΡƒΡŽ Π±ΡƒΠΌΠ°Π³Ρƒ, ΡƒΠ±Π΅Π΄ΠΈΠ²ΡˆΠΈΡΡŒ, Ρ‡Ρ‚ΠΎ этот Π½ΠΎΠ²Ρ‹ΠΉ слой располоТСн ΠΏΠΎΠ΄ Π²Π°ΠΌΠΈ, размСститС слой ΠΈ слои с ΠΌΠΈΠ½ΠΈΠ°Ρ‚ΡŽΡ€Π°ΠΌΠΈ ΠΈΠ·ΠΎΠ±Ρ€Π°ΠΆΠ΅Π½ΠΈΠΉ. Π’Ρ‹Ρ€Π΅ΠΆΡŒΡ‚Π΅ Π΅Π³ΠΎ, ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΡ Ρ‚Π΅Ρ…Π½ΠΈΠΊΡƒ волшСбной ΠΏΠ°Π»ΠΎΡ‡ΠΊΠΈ, ΠΎΠΏΠΈΡΠ°Π½Π½ΡƒΡŽ Ρ€Π°Π½Π΅Π΅.Π—Π°Ρ‚Π΅ΠΌ установитС Ρ€Π΅ΠΆΠΈΠΌ налоТСния слоя Π½Π° «ТСсткий свСт» ΠΈ ΡƒΠΌΠ΅Π½ΡŒΡˆΠΈΡ‚Π΅ Π½Π΅ΠΏΡ€ΠΎΠ·Ρ€Π°Ρ‡Π½ΠΎΡΡ‚ΡŒ Π΄ΠΎ 70%. НаконСц, ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠΉΡ‚Π΅ ластик для Π°ΠΊΠ²Π°Ρ€Π΅Π»ΡŒΠ½ΠΎΠΉ кисти, Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΡΡ‚Π΅Ρ€Π΅Ρ‚ΡŒ ниТнюю / Π±ΠΎΠΊΠΎΠ²ΡƒΡŽ Ρ‡Π°ΡΡ‚ΡŒ изобраТСния Π² бСспорядочном стилС.

Π¨Π°Π³ 13

ΠŸΠ»Π°Π½ΠΈΡ€ΠΎΠ²ΠΊΠ° ΠΏΠΎΠΊΠ° выглядит Π½Π΅ΠΏΠ»ΠΎΡ…ΠΎ, Π½ΠΎ отсутствуСт структура, особСнно вСрхняя Ρ‡Π°ΡΡ‚ΡŒ. НСсмотря Π½Π° Ρ‚ΠΎ, Ρ‡Ρ‚ΠΎ Π³Ρ€Π°Π½ΠΆ-Π΄ΠΈΠ·Π°ΠΉΠ½ ΠΎΠ±Ρ‹Ρ‡Π½ΠΎ ΠΎΡ‡Π΅Π½ΡŒ бСспорядочный, это Π½Π΅ Π·Π½Π°Ρ‡ΠΈΡ‚, Ρ‡Ρ‚ΠΎ Π΅ΠΌΡƒ Π½Π΅ Ρ…Π²Π°Ρ‚Π°Π΅Ρ‚ структуры. НСкоторыС ΠΈΠ· Π»ΡƒΡ‡ΡˆΠΈΡ… Π³Ρ€Π°Π½ΠΆΠ΅Π²Ρ‹Ρ… Π΄ΠΈΠ·Π°ΠΉΠ½ΠΎΠ² ΠΏΠΎ-ΠΏΡ€Π΅ΠΆΠ½Π΅ΠΌΡƒ ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΡŽΡ‚ довольно ТСсткиС структуры просто ΠΏΠΎΡ‚ΠΎΠΌΡƒ, Ρ‡Ρ‚ΠΎ это ΠΏΠΎΠΌΠΎΠ³Π°Π΅Ρ‚ Ρ…ΠΎΡ€ΠΎΡˆΠΎ ΡΠ²ΡΠ·Π°Ρ‚ΡŒ ΠΌΠ°ΠΊΠ΅Ρ‚.Π’ этом случаС я Ρ€Π΅ΡˆΠΈΠ» ΡΠΎΠ·Π΄Π°Ρ‚ΡŒ 2 Ρ‚Π΅ΠΌΠ½Ρ‹Ρ… полосы, проходящих Ρ‡Π΅Ρ€Π΅Π· ΠΌΠΎΠΉ ΠΌΠ°ΠΊΠ΅Ρ‚. Π­Ρ‚ΠΎ ΠΌΠΎΠΆΠ΅Ρ‚ Π±Ρ‹Ρ‚ΡŒ довольно просто ΡΠ΄Π΅Π»Π°Ρ‚ΡŒ, Π½ΠΎ это Π΄Π΅ΠΉΡΡ‚Π²ΠΈΡ‚Π΅Π»ΡŒΠ½ΠΎ ΠΏΠΎΠΌΠΎΠ³Π°Π΅Ρ‚ ΠΌΠ°ΠΊΠ΅Ρ‚Ρƒ, ΠΏΠΎΡΠΊΠΎΠ»ΡŒΠΊΡƒ Ρ€Π°Π½ΡŒΡˆΠ΅ ΠΎΠ½ Π½Π΅ ΠΈΠΌΠ΅Π» ΠΊΠ°ΠΊΠΎΠΉ-Π»ΠΈΠ±ΠΎ Ρ€Π΅Π°Π»ΡŒΠ½ΠΎΠΉ Ρ„ΠΎΡ€ΠΌΡ‹ ΠΈΠ»ΠΈ опрСдСлСния. Π”Π²Π΅ Π»ΠΈΠ½ΠΈΠΈ ΡΠΎΠ·Π΄Π°ΡŽΡ‚ плоскости, ΠΏΠΎ ΠΊΠΎΡ‚ΠΎΡ€Ρ‹ΠΌ ΠΌΠΎΠΆΠ΅Ρ‚ Π±Π΅Π³Π°Ρ‚ΡŒ взгляд, ΠΈ ΠΏΠΎΠΌΠΎΠ³Π°ΡŽΡ‚ ΠΎΠ±Ρ€Π°ΠΌΠ»ΡΡ‚ΡŒ бСспорядочныС изобраТСния Π² ΠΎΡΡ‚Π°Π»ΡŒΠ½ΠΎΠΉ части Π΄ΠΈΠ·Π°ΠΉΠ½Π°. ΠŸΠΎΠΌΠ½ΠΈΡ‚Π΅ — бСспорядок Π½Π΅ ΠΎΠ·Π½Π°Ρ‡Π°Π΅Ρ‚ Π½Π΅ΡΡ‚Ρ€ΡƒΠΊΡ‚ΡƒΡ€ΠΈΡ€ΠΎΠ²Π°Π½Π½ΠΎΡΡ‚ΡŒ.

Π¨Π°Π³ 14

Π’Π΅ΠΏΠ΅Ρ€ΡŒ я создаю ΠΎΠ±Π»Π°ΡΡ‚ΡŒ подписки Π½Π° рассылку новостСй ΠΏΠΎΠ΄ своим мСню. Π­Ρ‚ΠΈ Ρ‚Π΅Ρ…Π½ΠΈΠΊΠΈ довольно ΠΎΡ‡Π΅Π²ΠΈΠ΄Π½Ρ‹, Ссли ΠΏΠΎΡΠΌΠΎΡ‚Ρ€Π΅Ρ‚ΡŒ Π½Π° ΠΈΠ·ΠΎΠ±Ρ€Π°ΠΆΠ΅Π½ΠΈΠ΅ Π½ΠΈΠΆΠ΅, Π½ΠΎ, ΠΎΠΏΡΡ‚ΡŒ ΠΆΠ΅, ΠΈΡ… Π»ΠΎΠ³ΠΈΠΊΠ° являСтся Π½Π΅ΠΎΡ‚ΡŠΠ΅ΠΌΠ»Π΅ΠΌΠΎΠΉ Ρ‡Π°ΡΡ‚ΡŒΡŽ понимания Π³Ρ€Π°Π½ΠΆΠ΅Π²ΠΎΠ³ΠΎ Π΄ΠΈΠ·Π°ΠΉΠ½Π°.Π― Π½Π°ΠΌΠ΅Ρ€Π΅Π½Π½ΠΎ ΠΈΠ·ΠΌΠ΅Π½ΠΈΠ» Ρ‚Π΅ΠΌΠ½ΠΎΡ‚Ρƒ тСкста (Β«Π˜Π½Ρ„ΠΎΡ€ΠΌΠ°Ρ†ΠΈΠΎΠ½Π½Ρ‹ΠΉ Π±ΡŽΠ»Π»Π΅Ρ‚Π΅Π½ΡŒΒ» Ρ‚Π΅ΠΌΠ½Π΅Π΅, Ρ‡Π΅ΠΌ «Имя» ΠΈ «ЭлСктронная ΠΏΠΎΡ‡Ρ‚Π°Β», Ρ‚Π°ΠΊ ΠΊΠ°ΠΊ это создаСт многослойный Π²ΠΈΠ΄. Π― создаю структурированныС поля для Ρ„ΠΎΡ€ΠΌΡ‹ подписки, Π½ΠΎ ΡƒΠΌΠ΅Π½ΡŒΡˆΠ°ΡŽ ΠΈΡ… Π½Π΅ΠΏΡ€ΠΎΠ·Ρ€Π°Ρ‡Π½ΠΎΡΡ‚ΡŒ ΠΈ Π°ΠΊΠΊΡƒΡ€Π°Ρ‚Π½ΠΎ ΡΡ‚ΠΈΡ€Π°ΡŽ ΠΈΡ… края. Π½Π΅ΠΌΠ½ΠΎΠ³ΠΎ, Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΠΏΡ€ΠΈΠ΄Π°Ρ‚ΡŒ ΠΈΠΌ Π²ΠΈΠ΄ ΡˆΠ΅Ρ€ΠΎΡ…ΠΎΠ²Π°Ρ‚Ρ‹ΠΉ.

Π¨Π°Π³ 15

Π― добавляю тСкст Π² ниТнюю Ρ‡Π°ΡΡ‚ΡŒ своСго Π΄ΠΈΠ·Π°ΠΉΠ½Π°. Π’Π°ΠΆΠ½ΠΎ ΠΎΡ‚ΠΌΠ΅Ρ‚ΠΈΡ‚ΡŒ, Ρ‡Ρ‚ΠΎ я ΠΊΠΎΠΌΠ±ΠΈΠ½ΠΈΡ€ΡƒΡŽ рукописныС ΡˆΡ€ΠΈΡ„Ρ‚Ρ‹ ΠΈ ΠΎΠ±Ρ‹Ρ‡Π½Ρ‹Π΅ ΡˆΡ€ΠΈΡ„Ρ‚Ρ‹, ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΡ сочСтаниС структуры / бСспорядка, ΠΎ ΠΊΠΎΡ‚ΠΎΡ€ΠΎΠΌ я ΡƒΠΏΠΎΠΌΠΈΠ½Π°Π» Ρ€Π°Π½Π΅Π΅.ΠžΠ±Ρ€Π°Ρ‚ΠΈΡ‚Π΅ Ρ‚Π°ΠΊΠΆΠ΅ Π²Π½ΠΈΠΌΠ°Π½ΠΈΠ΅ Π½Π° Ρ‚ΠΎ, ΠΊΠ°ΠΊ я ΠΏΠΎΠ²Ρ‚ΠΎΡ€Π½ΠΎ использовал стрСлки Π² мСню. ΠŸΠΎΠ²Ρ‚ΠΎΡ€Π½ΠΎΠ΅ использованиС элСмСнтов Π½Π΅ сдСлаСт ваш Π΄ΠΈΠ·Π°ΠΉΠ½ скучным ΠΈΠ»ΠΈ ΠΏΠΎΠ²Ρ‚ΠΎΡ€ΡΡŽΡ‰ΠΈΠΌΡΡ, Π½ΠΎ ΠΌΠΎΠΆΠ΅Ρ‚ Π±Ρ‹Ρ‚ΡŒ довольно приятным ΡˆΡ‚Ρ€ΠΈΡ…ΠΎΠΌ Π² Π³Ρ€Π°Π½ΠΆΠ΅Π²ΠΎΠΌ Π΄ΠΈΠ·Π°ΠΉΠ½Π΅, Ρ…ΠΎΡ€ΠΎΡˆΠΎ ΡΠΎΡ‡Π΅Ρ‚Π°ΡŽΡ‰ΠΈΠΌΡΡ с ΠΌΠ°ΠΊΠ΅Ρ‚ΠΎΠΌ.

Π¨Π°Π³ 16

НаконСц, это Ρ‚Π΅Ρ…Π½ΠΈΠΊΠ°, ΠΊΠΎΡ‚ΠΎΡ€ΡƒΡŽ я использовал Π½Π΅ΠΊΠΎΡ‚ΠΎΡ€ΠΎΠ΅ врСмя. Π§Ρ‚ΠΎΠ±Ρ‹ Π΄ΠΎΠ±ΠΈΡ‚ΡŒΡΡ красивого рукописного ΠΊΠΎΠ½Ρ‚ΡƒΡ€Π° Π²ΠΎΠΊΡ€ΡƒΠ³ ΠΌΠΎΠΈΡ… Π½ΠΈΠΆΠ½ΠΈΡ… Π·Π°Π³ΠΎΠ»ΠΎΠ²ΠΊΠΎΠ², я Π²Ρ‹Π±ΠΈΡ€Π°ΡŽ ΠΊΠΈΡΡ‚ΡŒ 1px ΠΈ Π½Π°Ρ€ΠΈΡΡƒΡŽ Π±ΠΎΠ»ΡŒΡˆΡƒΡŽ Π³Ρ€ΡƒΠ±ΡƒΡŽ ΠΎΠ²Π°Π»ΡŒΠ½ΡƒΡŽ Ρ„ΠΎΡ€ΠΌΡƒ. Π—Π°Ρ‚Π΅ΠΌ ΠΈΠ·ΠΌΠ΅Π½ΠΈΡ‚Π΅ Ρ€Π°Π·ΠΌΠ΅Ρ€ этого ΠΎΠ²Π°Π»Π°, Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΠΎΠ½ соотвСтствовал ΠΌΠΎΠ΅ΠΌΡƒ Π·Π°Π³ΠΎΠ»ΠΎΠ²ΠΊΡƒ. ΠŸΠΎΡΠΊΠΎΠ»ΡŒΠΊΡƒ я Ρ‚Π°ΠΊ сильно ΠΈΠ·ΠΌΠ΅Π½ΠΈΠ» Π΅Π³ΠΎ Ρ€Π°Π·ΠΌΠ΅Ρ€, слСды кисти, ΠΊΠΎΡ‚ΠΎΡ€Ρ‹Π΅ Ρ€Π°Π½ΡŒΡˆΠ΅ выглядСли Π³Ρ€ΡƒΠ±Ρ‹ΠΌΠΈ ΠΈ Π½Π΅ΠΏΡ€ΠΎΡ„Π΅ΡΡΠΈΠΎΠ½Π°Π»ΡŒΠ½Ρ‹ΠΌΠΈ, Ρ‚Π΅ΠΏΠ΅Ρ€ΡŒ стали ΠΎΡ‚Ρ€Ρ‹Π²ΠΎΡ‡Π½Ρ‹ΠΌΠΈ ΠΈ Π΄Π΅Ρ‚Π°Π»ΠΈΠ·ΠΈΡ€ΠΎΠ²Π°Π½Π½Ρ‹ΠΌΠΈ.НаконСц, я Π±Π΅Ρ€Ρƒ Π°ΠΊΠ²Π°Ρ€Π΅Π»ΡŒΠ½ΡƒΡŽ ΠΊΠΈΡΡ‚ΡŒ с Π½ΠΈΠ·ΠΊΠΎΠΉ Π½Π΅ΠΏΡ€ΠΎΠ·Ρ€Π°Ρ‡Π½ΠΎΡΡ‚ΡŒΡŽ ΠΈ Ρ€ΠΈΡΡƒΡŽ ΠΏΡ€ΠΈΠΌΠ΅Ρ€Π½ΠΎ Π·Π° ΠΌΠΎΠΈΠΌ Π·Π°Π³ΠΎΠ»ΠΎΠ²ΠΊΠΎΠΌ, просто Ρ‡Ρ‚ΠΎΠ±Ρ‹ Π΄Π°Ρ‚ΡŒ Π΅ΠΌΡƒ Π½Π΅ΠΌΠ½ΠΎΠ³ΠΎ большС ΠΏΡ€ΠΈΠΎΡ€ΠΈΡ‚Π΅Ρ‚Π° Π½Π°Π΄ ссылками ΠΏΠΎΠ΄ Π½ΠΈΠΌ.

И всС Π³ΠΎΡ‚ΠΎΠ²ΠΎ

Π’ΠΎΡ‚ ΠΈ Π³ΠΎΡ‚ΠΎΠ²Ρ‹ΠΉ Π΄ΠΈΠ·Π°ΠΉΠ½. НаТмитС Π½Π° ΠΈΠ·ΠΎΠ±Ρ€Π°ΠΆΠ΅Π½ΠΈΠ΅ Π½ΠΈΠΆΠ΅, Ссли Ρ…ΠΎΡ‚ΠΈΡ‚Π΅ ΠΏΡ€ΠΎΡΠΌΠΎΡ‚Ρ€Π΅Ρ‚ΡŒ Π²Π΅Ρ€ΡΠΈΡŽ Π² ΠΏΠΎΠ»Π½ΠΎΠΌ Ρ€Π°Π·ΠΌΠ΅Ρ€Π΅.

Π—Π°Π³Ρ€ΡƒΠ·ΠΈΡ‚ΡŒ исходный Ρ„Π°ΠΉΠ» для этого ΡƒΡ‡Π΅Π±Π½ΠΎΠ³ΠΎ курса

Об Π°Π²Ρ‚ΠΎΡ€Π΅:

Π’ΠΎΠΌ — ΠΎΡΠ½ΠΎΠ²Π°Ρ‚Π΅Π»ΡŒ PSDFAN.Он Π»ΡŽΠ±ΠΈΡ‚ ΠΏΠΈΡΠ°Ρ‚ΡŒ ΡƒΡ€ΠΎΠΊΠΈ, ΡƒΠ·Π½Π°Π²Π°Ρ‚ΡŒ большС ΠΎ Π΄ΠΈΠ·Π°ΠΉΠ½Π΅ ΠΈ Π²Π·Π°ΠΈΠΌΠΎΠ΄Π΅ΠΉΡΡ‚Π²ΠΎΠ²Π°Ρ‚ΡŒ с сообщСством.

Автор записи

Π”ΠΎΠ±Π°Π²ΠΈΡ‚ΡŒ ΠΊΠΎΠΌΠΌΠ΅Π½Ρ‚Π°Ρ€ΠΈΠΉ

Π’Π°Ρˆ адрСс email Π½Π΅ Π±ΡƒΠ΄Π΅Ρ‚ ΠΎΠΏΡƒΠ±Π»ΠΈΠΊΠΎΠ²Π°Π½. ΠžΠ±ΡΠ·Π°Ρ‚Π΅Π»ΡŒΠ½Ρ‹Π΅ поля ΠΏΠΎΠΌΠ΅Ρ‡Π΅Π½Ρ‹ *