Сodrops adalah yang paling banyak blog terbaik dalam reka bentuk web. Anda sentiasa boleh menemui banyak perkara paling kreatif untuk pereka web di sana. Kelebihan yang besar ialah mereka juga memberitahu anda cara melampirkan atau mencipta kesan ini atau itu. Ia sangat popular di luar negara, tetapi atas sebab tertentu tidak begitu banyak di Internet Rusia. Secara umum, tapak yang sangat berguna untuk pereka, anda boleh mendapatkan banyak inspirasi dan belajar banyak di sana, kerana terdapat pelajaran CSS yang benar-benar lanjutan di sana.
Hari ini saya ingin membentangkan kepada anda 15 pengajaran hebat dari laman web yang menarik ini. Semua "cip" adalah percuma dan anda boleh memuat turunnya dengan mudah. Nah, sekarang mari kita lihat lebih dekat.
Anda juga mungkin berminat dengan ini:
Grid dinamik dengan animasi yang cantik
Ini adalah penyelesaian yang sangat baik untuk mengatur blok anda di tapak, dan grid ini juga boleh digunakan dengan mudah untuk imej. Grid ini dibuat menggunakan CSS tulen.
Cara Membuat Kesan Hover Imej Sejuk dengan CSS
Tutorial ini menunjukkan kepada anda cara untuk mencipta kesan hover super pada imej. Dalam contoh terdapat sebanyak 7 contoh yang berbeza, serta arahan tentang cara membuat keajaiban ini menggunakan CSS.
Butang hebat dengan kesan CSS yang cantik
Sekumpulan Contoh CSS butang dengan kesan hover yang indah, butang ini boleh disesuaikan mengikut citarasa anda.
Bagaimana untuk membuat piano
Pelajaran cemerlang yang memberitahu anda cara membuat piano elektronik sebenar untuk tapak web anda.
Kesan hover yang cantik untuk ikon
Terdapat 9 contoh dalam tutorial ini yang mempunyai gaya yang berbeza Apabila anda menuding pada ikon, semuanya kelihatan sangat bergaya dan moden. Sebagai contoh, anda boleh menggunakan kesan ini secara bebas untuk ikon penanda buku sosial dalam talian.
Melibas berkesan untuk blok
Di sini anda akan belajar bagaimana untuk melakukannya dengan menggunakan CSS flipping berkesan untuk blok. Terdapat juga 5 contoh yang sama sekali berbeza.
Contoh hebat menggunakan animasi CSS
Berikut adalah 4 contoh yang menunjukkan secara terperinci apa yang animasi CSS mampu.
Borang carian luar biasa
Sebagai contoh, saya tidak pernah melihat ini sebelum ini, contohnya, anda ingin makan di restoran, jadi anda mencari restoran yang dikehendaki di Google, masukkan tempat yang dikehendaki dalam medan carian. Sekarang lihat bagaimana ini boleh dilaksanakan dengan lebih kreatif dan mudah.
Cara menunjukkan imej yang berbeza untuk peranti yang berbeza
Di sini anda akan belajar bagaimana untuk melaksanakan paparan gambar yang berbeza, bergantung pada peranti mana sumber anda dilihat.
Membuat menu penyesuaian dengan sokongan untuk paparan Retina
Satu pelajaran yang sangat baik di mana anda akan belajar bagaimana untuk membuat cantik dan menu responsif pada CSS dengan sokongan untuk skrin Retina.
Beberapa kesan menyelak halaman CSS
Kesan cantik yang boleh anda gunakan untuk melaksanakan pusingan halaman skrin penuh
Animasi mengubah halaman CSS3
Dalam burzhunet saya melihat teknik mengubah halaman yang dilaksanakan dalam CSS3. Sangat menarik! Berdasarkan teknik ini, saya memutuskan untuk membuat contoh saya sendiri yang menunjukkan buku CSS3 sedemikian dengan animasi mengubah halaman.
Teknik ini berdasarkan sifat CSS3 seperti mengubah Dan peralihan serta penggunaan tag yang tidak standard input dengan kotak semak. Pelaksanaannya ternyata bengkok, kerana pelayar belum menyokong sepenuhnya sifat CSS3 yang paling berkesan dalam bentuk langsung. Tetapi, terima kasih kepada , kita boleh cuba memanfaatkan hartanah ini sekarang.
Ternyata dengan berkesan, berita baiknya ialah mungkin dalam masa terdekat pelayar akan mula memahami piawaian CSS3 baharu dan juruweb akan dapat melaksanakan keindahan tersebut dengan selamat di tapak mereka, ia telah menjadi mungkin untuk mengubah halaman dalam CSS3.
Contoh terbaik dilihat dalam pelayar Mozilla Firefox
versi terkini - semuanya berfungsi tanpa masalah. Contoh ini berfungsi dalam Safari dan Chrome, tetapi dengan kesukaran. Opera memakan pemproses semasa animasi, jadi komputer yang lemah contoh itu tidak akan berfungsi. IE ialah IE, hanya untuk keseronokan, anda boleh menontonnya dengannya.
Kami melihat dengan penyemak imbas Mozilla Firefox- jangan merosakkan kesan!
Untuk pelajaran ini anda memerlukan imej buku atau album. Terdapat banyak gambar sedemikian di Internet.
Jadi - gambar dijumpai - buka dalam Photoshop. Buka kunci lapisan - keluarkan kunci dari lapisan - klik dua kali pada kunci dan dalam tetingkap yang terbuka - klik OK, atau hanya seret kunci ke tong sampah dengan tetikus
Pilih menggunakan alat Lasso sebelah kanan buku dan salin ke lapisan baru(selepas pemilihan, letakkan kursor pada gambar - butang kanan tetikus - arahan - salin ke lapisan baru)
Buat beberapa lapisan, lapisan baru aktif - tekan kombinasi kekunci Ctrl+J. Untuk pelajaran saya mencipta 4 lapisan baharu - untuk lebih baik dan animasi yang menarik- perlu ada lebih banyak lapisan, tetapi untuk memahami cara membuat animasi sedemikian - ia akan mencukupi. 
Tutup mata dalam semua lapisan kecuali Utama dan Lapisan-1. Lapisan -1 aktif - kami akan bekerjasama dengannya. Tekan kekunci Ctrl+T (kami panggil alat - Transformasi Percuma) - segi empat tepat muncul di sekeliling imej, berpusat di tengah. Gerakkan pusat ini dengan tetikus ke tengah sebelah kiri petak - berbanding dengan titik ini dan kami akan membelok halaman kami 
Kami akan mula memerah bahagian kanan - gerakkannya dengan tetikus 
Tetapi apabila halaman dibuka, mereka "bermain" sedikit. Untuk memberikan rupa yang lebih semula jadi, kami kini akan bekerja dengan halaman tersebut. Tanpa mengalih keluar pemilihan - Free Transform, klik kanan pada gambar dalam Photoshop dan pilih fungsi - Herot 
Dan herotkan sedikit helaian dengan menaikkan sudut kanan bawah dan atas 
Pergi ke lapisan - Lapisan -2. Menggunakan kombinasi kekunci Ctrl+T, panggil Free Transform, mampatkan helaian dengan lebih banyak lagi, herotkannya - beginilah rupa segala-galanya, di bawah lapisan kedua saya tinggalkan Layer -1 dihidupkan untuk anda supaya anda dapat melihat berapa kosnya untuk memampatkan dan memesongkan 
Sebagai tambahan kepada fungsi - Herot, anda juga boleh menggunakan fungsi - Ubah bentuk, ia akan memberi anda peluang untuk mengubah bentuk satah daun itu sendiri, halaman mudah, ia boleh bengkok dari tiupan angin, jika ia terbalik atau dari tangan seseorang, tetapi anda boleh mencubanya sendiri - bereksperimen dan lihat hasil yang anda dapat.
Pergi dengan lapisan Layer -3. Kami menggunakan kekunci untuk memanggil fungsi transformasi bebas, jangan lupa untuk mengalihkan pusat ke tengah satah berbanding dengan yang kami putar (terbalikkan) helaian buku kami, mampatkannya dan herotkannya. 
Pergi ke lapisan - Lapisan -4 - mampatkannya, herotkannya 
Yang tinggal hanyalah memasang animasi. Buka panel animasi - Tetingkap - dan tandai kotak Animasi.
Bingkai pertama - kami mempunyai lubang intip dihidupkan pada lapisan Utama, yang kami tidak berfungsi dengannya. tetapkan kelewatan kepada 0.2 saat 
Buat bingkai pendua 
Bingkai kedua - lapisan utama dan Lapisan -1 disertakan
Bingkai ketiga - lapisan utama dan Lapisan -2 dihidupkan
Bingkai keempat - lapisan utama dan Lapisan -3 dihidupkan
Bingkai kelima - lapisan utama dan Lapisan -4 dihidupkan
Bingkai keenam - hanya lapisan utama disertakan
Mari lihat apa yang kita dapat 
Inilah asasnya. Seperti yang anda lihat, semuanya agak mudah. Ini satu gambar. Selepas anda memahami intipatinya, anda akan dapat membuat animasi yang lebih kompleks dan membalik halaman yang akan terdapat imej yang berbeza, iaitu Akan ada ulasan buku atau album.
Semoga berjaya semua!
type="text/javascript">yandex_partner_id = 66431;yandex_site_bg_color = "FFFFFF";yandex_ad_format = "direct";yandex_font_size = 1;yandex_direct_type = "horizontal";yandex_direct_border_type = "block";yandex_2_direct_direct_direct = "blok";yandex_2_direct_direct_direct er_bg_color = "FEEAC7";yandex_direct_bg_color = "FFF9F0";yandex_direct_border_color = "FBE5C0";yandex_direct_title_color = "0000CC";yandex_direct_url_color = "006600";yandex_direct_text_color = "000000_";yandex_direct_text_color = "000000_"; benar;yandex_no_sitelinks = palsu;dokumen . tulis(" ");
dalam photoshop
Anda semua mungkin telah melihat kesan membelek halaman album atau majalah. Kesan ini boleh dicapai dalam banyak program - Adobe Selepas Kesan, Sony Vegas, program penyuntingan video lain. Terdapat juga program khusus, disesuaikan untuk kesan ini - contohnya, FlipBook Maker.
Jom buat macam ni kesan perubahan halaman dalam program kegemaran kami Photoshop.
Malangnya, sukar untuk meletakkan banyak gambar dalam animasi ini (walaupun boleh). Kesukaran utama ialah dengan peningkatan dalam bilangan bingkai animasi, berat fail meningkat dengan ketara dan, dengan itu, masa yang diperlukan untuk membuka fail ini dalam penyemak imbas.
Sebagai contoh, dalam kerja saya, saya menggunakan 8 gambar (4 hamparan) dan outputnya ialah fail GIF seberat 8.63 MB dengan dimensi asal (1200x1000 piksel).
Apabila mengecilkan saiz imej kepada 350x292 piksel. berjaya mengurangkan berat kepada 291 KB yang boleh diterima, walaupun keperluan tapak ini adalah fail tidak lebih daripada 80 KB. Atas sebab inilah fail yang dibentangkan di sini bukanlah kualiti terbaik.
Walau bagaimanapun, gif sedemikian juga mempunyai tempatnya - ia boleh disertakan pada blok, tapak web, halaman rangkaian sosial anda, sebagai contoh, untuk menarik perhatian kepada portfolio anda.
Walau apa pun, dengan melengkapkan pelajaran ini, anda dijamin akan mempelajari cara membuat GIF dengan sebarang kerumitan. Kesukaran pelajaran adalah sederhana, perkara utama adalah jangan keliru dalam susunan meletakkan lapisan dalam bingkai animasi.
Mari kita mulakan. Buat dokumen baharu(Ctrl+N) dengan dimensi 1200x1000 piksel. Memandangkan GIF hanya boleh ditunjukkan pada skrin dan di Internet, resolusi fail adalah mencukupi pada 72 piksel/inci.
Pindahkan salah satu latar belakang ke dokumen (anda boleh menggunakan yang saya lampirkan pada akhir pelajaran). Gunakan Move Tool untuk meletakkannya seperti yang ditunjukkan di bawah. Tinggalkan sekurang-kurangnya 200 px di bahagian atas. percuma untuk membelek halaman, selebihnya medan adalah sama.
Klik dua kali pada baris lapisan untuk memaparkan tetingkap Gaya Lapisan (atau ikon "fx" di bahagian bawah palet Lapisan). Gunakan gaya timbul dan bayang pada lapisan:
Buat lapisan baharu, namakannya "halaman kiri." dan letakkan templat di atasnya, meninggalkan jarak yang sama dari tepi latar belakang pada semua sisi (gunakan transformasi bebas Ctrl+T)
Salin lapisan (Ctrl+J), panggil Free Transform (Ctrl+T) > Flip Horizontal. Gerakkan templat yang diputar ke kanan, namakan lapisan "page pr." Untuk kemudahan, gunakan panduan.
Salin gaya lapisan dari latar belakang dan tampalkannya ke dalam lapisan dengan templat (klik kanan pada lapisan dengan latar belakang - "Salin Gaya Lapisan" dan juga "Tampal Gaya Lapisan" pada lapisan dengan halaman). Anda boleh melaraskan tetapan mengikut budi bicara anda.
Mari buat separuh cincin untuk mengamankan halaman. Tetapi pertama, mari kita potong lubang pada halaman.
Buat lapisan baharu (Shift+Ctrl+N) di atas semua lapisan - "lubang". Letakkan panduan di tengah-tengah jidar dalam bingkai templat, seperti yang ditunjukkan dalam tangkapan skrin.
Tutup keterlihatan lapisan dengan halaman untuk seketika (klik pada mata). Ambil alat berus bulat dan keras, warna hitam. Laraskan jarak cat (F5 > Brush Tip Shape > Spacing) - Saya tetapkan kepada sekitar 450%.
Sambil menahan kekunci Shift, lukis barisan menegak lubang (empat sudah cukup) pada kedua-dua jidar halaman pada lapisan "lubang". Tahan kekunci Ctrl dan klik pada ikon lapisan ini untuk memuatkan pilihan.
Pergi ke lapisan dengan halaman templat dan tekan kekunci Padam untuk mengalih keluar pilihan. Lakukan perkara yang sama dengan halaman kedua templat. Matikan lapisan "lubang", atau anda boleh memadamkannya sepenuhnya.
Buat lapisan baharu di atas kesemuanya (namakannya "arka"). Menggunakan Oval Marquee Tool, lukis bujur seperti yang ditunjukkan di bawah. Klik kanan di dalam bujur dan pilih Stroke. Warna lejang adalah kelabu muda, lebar ialah 10 piksel.
Menggunakan Alat Marquee Rectangular, pilih bahagian bawah bujur dan tekan Padam.
Klik kanan pada lapisan dan pilih Tampal Gaya Lapisan. Nyahpilihnya.
Salin lapisan "arka" tiga kali (Ctrl+J) dan seret lengkok ke setiap satu daripadanya mengikut lubang. Ini mudah dilakukan dengan kekunci anak panah ke bawah sambil menahan Kekunci Shift(berubah sebanyak 10 piksel).
Gabungkan lapisan dengan arka dan lubang ke dalam kumpulan - "Arka"
Sudah tiba masanya untuk mula mengambil gambar. Lakukan ini secara berasingan untuk bahagian kanan dan kiri. Buka foto dalam Photoshop yang akan diletakkan di sebelah kiri album. Alihkan satu persatu ke dalam dokumen kami. Ini boleh dilakukan dengan mudah menggunakan kekunci panas. Buka foto, tekan “Ctrl+A” (pilih semua), kemudian “Ctrl+C” (salin). Pergi ke tab dengan album, pergi ke lapisan "halaman". seekor singa." dan tekan “Ctrl+V” (tampal). Sama dengan semua gambar. Gabungkan mereka ke dalam kumpulan "Halaman Kiri".
Mari sediakan topeng untuk templat kiri. Matikan keterlihatan lapisan foto. Pergi ke lapisan halaman templat dan gunakan alat pemilihan Tongkat Ajaib untuk memilih keseluruhan bahagian dalam bingkai. Jangan lupa sudut di bawah. Tetapan alat:
Di dalam pilihan, klik kanan dan pilih "Simpan Pilihan." Dalam tetingkap yang terbuka, pilih saluran baharu dan berikan saluran itu nama "Kiri". Kini pilihan kami boleh dimuatkan pada bila-bila masa dengan pergi ke tab "Saluran".
Untuk masa yang lama semuanya mudah. Pergi ke lapisan dengan foto pertama, gunakan alat gerak untuk menjajarkan foto dengan bingkai (untuk kemudahan, turunkan kelegapan lapisan untuk seketika). Pergi ke tab "Saluran", di mana di bahagian bawah anda akan melihat lapisan dengan saluran "kiri" baharu. Klik pada ikon lapisan ini dengan ditekan Kekunci Ctrl. Pilihan yang kami simpan akan dimuatkan.
Kembali ke lapisan dengan foto anda dan tambahkan topeng lapisan padanya (ikon di bahagian bawah palet lapisan)
Lakukan perkara yang sama dengan seluruh foto, berikan nama pada lapisan supaya anda tidak keliru dengan bingkai animasi pada masa hadapan. Kumpulkan lapisan ke dalam kumpulan "Halaman Kiri".
Kami melakukan operasi ini untuk separuh kanan album.
Inilah rupa panel lapisan pada peringkat ini:
Untuk kerja selanjutnya anda perlu menggabungkan lapisan "foto + topeng" dengan halaman templat. Buat pendua lapisan dengan templat halaman, pilih salinan lapisan "kiri halaman". dan lapisan "Lev-1" (klik pada lapisan ini sambil menahan kekunci Ctrl) dan klik kanan dan pilih "Gabung Lapisan". Lakukan perkara yang sama dengan semua lapisan dengan foto anda, menggabungkannya satu demi satu dengan salinan lapisan templat halaman.
Untuk mencapai rupa perubahan halaman yang boleh dipercayai, anda perlu membuat dua salinan setiap halaman dan menggunakan alat transformasi untuk memutar setiap satu ke sudut tertentu. Sekarang mari kita lakukan ini.
Mari kita mulakan dengan lapisan atas separuh kanan - lapisan "Pr-3". Buat dua salinan lapisan. Berdiri pada lapisan atas "Pr-3 copy 2", tekan kombinasi kekunci Ctrl+T dan, klik kanan, pilih "Distort" (atau dalam menu "Edit> Transform> Distort"). Gerakkan kursor anda (alat gerakkan) ke pemegang kanan tengah dan seret ke atas supaya penjuru atas halaman mencapai tepi atas dokumen. Kemudian bergerak ke kiri seperti dalam tangkapan skrin. Pastikan untuk mengekalkan tepi kiri halaman di tempatnya.
Pergi ke lapisan di bawah "salinan Pr-3" dan ubah juga salinan kedua halaman tersebut. Jajarkan panduan ke tepi kanan dan sudut atas halaman supaya anda boleh menggunakannya untuk membimbing halaman seterusnya.
Kami melakukan tindakan ini dengan semua halaman separuh kanan dan kiri album. Di sebelah kiri halaman kita pusingkannya ke arah lain.
Sekarang mari kita teruskan ke animasi.
Benar, dalam proses menyediakan pelajaran, saya sendiri melihat kesilapan saya dan membetulkannya. Tetapi saya tidak mengulangi keseluruhan pelajaran - untuk melakukan itu saya perlu memulakannya semula. Saya membuat pelarasan kecil, jadi anda boleh memikirkannya.
Hakikatnya pada mulanya saya meletakkan tiga gambar pada setiap separuh album. Tetapi, nasib malang, dalam pilihan ini tidak mungkin untuk menggelungkan animasi dengan betul - mana-mana foto akan diulang dua kali (ini mudah, matematik tulen). Jadi, perlu diingat bahawa anda perlu menyiarkan bilangan foto yang genap. Secara umum, saya menambah satu lagi foto setiap sisi.
seterusnya masa ini Dalam setiap kumpulan bahagian album kami mempunyai 12 lapisan (4 foto + dua salinan setiap satu). Matikan keterlihatan semua lapisan dalam kedua-dua kumpulan halaman kanan dan kiri buat sementara waktu.
Pergi ke menu "Tetingkap" dan hidupkan "Garis Masa" (dalam versi lama Photoshop - "Animasi"). Jika anda mempunyai garis masa yang terbuka dalam bentuk garis masa video, seperti yang ditunjukkan di bawah, kemudian klik pada ikon di sudut kiri bawah.
Atau ikon di penjuru kanan sebelah atas tetingkap. Dalam kes ini, pilih dalam tetingkap lungsur:
Tingkap sepatutnya kelihatan seperti:
Hidupkan keterlihatan lapisan bingkai pertama - dalam kumpulan lapisan "Halaman Kiri". pilih foto bawah - lapisan "Lev-1", dan dalam kumpulan "Halaman Kanan" - atas, lapisan "Pr-4" (lihat dalam fail JPA saya).
Hidupkan keterlihatan lapisan untuk bingkai kedua. Di sebelah kiri kami membiarkannya tidak berubah, dan di sebelah kanan kami menukarnya ke lapisan seterusnya "salinan Pr-4", i.e. menaikkan sedikit halaman. Kami membuka halaman yang sepatutnya berada di sebelah dalam album - hidupkan keterlihatan lapisan "Pr-3".
Bingkai ketiga - menaikkan halaman lebih tinggi, i.e. hidupkan keterlihatan lapisan "Pr-4 copy 2" dan matikan lapisan "Pr-4 copy".
Bingkai keempat - putar halaman. Kini foto seterusnya daripada kumpulan foto kiri sepatutnya kelihatan padanya, i.e. buka lapisan dengan foto kiri-2, tetapi yang paling tinggi ialah "Lev-2 copy 2". Kami menutup keterlihatan halaman yang dinaikkan sebelah kanan.
Bingkai kelima - turunkan halaman di bawah - lapisan "Salinan Lion-2".
Bingkai keenam - letakkan halaman - lapisan "Lev-2", dan matikan lapisan sebelumnya Lev-1.
Jadi kami "membelek" semua halaman mengikut urutan dari bingkai ke bingkai. Hanya ada satu nuansa lagi.
Apabila anda dan saya telah menatal semua foto, untuk menggelungkan animasi, kita mesti foto terakhir(Pr-1) letakkan yang didahulukan. Tetapi ia terletak pada lapisan paling atas kami (Pr-4), bertindih dengan lapisan asas, dan oleh itu kami mendapat gambar berikut:
Untuk menyingkirkan ini, buat salinan lapisan Pr-4 (saya memanggilnya "Pr-4 copy bottom") dan alihkannya ke bahagian paling bawah kumpulan "Halaman kanan".
Perkara yang sama berlaku dengan bahagian kiri - lapisan "Lev.-4" bertindih dengan lapisan "Lev.-1 salinan 2". Buat salinan lapisan kiri-4, saya memanggilnya "Bawah salinan kiri-4" dan seret kumpulan foto kiri ke bawah. Ingatlah untuk mematikan keterlihatan lapisan yang tidak terlibat dalam bingkai ini.
Nasihat - lebih baik menulis susunan semua lapisan pada sekeping kertas, sebaik-baiknya dengan lakaran, buat papan cerita. Ini akan membantu untuk mengelakkan tersesat dalam lapisan.
Secara keseluruhan, saya mendapat 20 bingkai untuk lapan gambar. Bingkai ke-21 yang terakhir akan menduplikasi yang pertama, jadi padamkan sahaja.
Sekarang mari kita tentukan masa tontonan setiap bingkai. Anda boleh menukarnya di bawah ikon bingkai dengan mengklik pada nombor dengan anak panah. Pilih daripada senarai juntai bawah masa yang betul atau “Lain-lain...” dan masukkan nilai anda.
saya letak nilai berikut masa.
Untuk bingkai kunci, di mana foto dibuka sepenuhnya, saya menetapkannya kepada 0.5 saat, untuk selebihnya - 0.2 saat. Untuk tidak menderita dengan setiap bingkai, pilih yang anda perlukan sambil menahan kekunci Ctrl dan tukar masa pada satu, selebihnya juga akan berubah.
Sentuhan terakhir kekal - pilih kekerapan memainkan animasi "Secara berterusan" dalam tetingkap di bahagian bawah garis masa.
Klik butang "Main" dan nikmati kerja anda, atau menderita selama beberapa jam lagi mencari ralat. Saya harap selepas penjelasan saya anda akan berjaya buat kali pertama.
Sabar, tak banyak yang tinggal. Anda perlu menyimpannya format GIF, dan ini boleh dilakukan melalui menu "Fail > Eksport > Simpan untuk Web" (dalam versi lama Photoshop, hanya "Simpan untuk Web" atau, lebih mudah, kombinasi kekunci Shift+Ctrl+Alt+S.
Dalam tetingkap yang terbuka, pilih "GIF", dan di bawah pilih parameter untuk pengurangan warna, dithering, ketelusan dan bilangan warna. Tetapkan pilihan tontonan kepada "2 pilihan" supaya anda mempunyai sesuatu untuk dibandingkan.
Anda tidak perlu mendalami teori (walaupun ini berguna), cuma bermain dengan tetapan dan bandingkan nisbah saiz dan kualiti fail. Dimensi boleh ditukar di bahagian bawah sebelah kanan tetingkap.
Apabila menukar tetapan dan saiz, perhatikan bagaimana saiz (berat) fail berubah. Jika di saiz asal 1200x1000 piksel. ia adalah sebanyak 8.63 MB, kemudian dengan saiz 350x292 piksel dan parameter yang lebih teruk ia sudah 291 KB. Jika anda bercadang untuk menyiarkan GIF di tapak web, blog atau media sosial anda. rangkaian, kemudian ambil kira perkara ini - semakin besar berat fail, semakin lama masa yang diperlukan untuk memuatkan dalam penyemak imbas, terutamanya apabila internet lambat. Jika tidak, pelawat ke tapak anda mungkin tidak menunggu untuk menemui bakat anda.
Skala paparan berada di bahagian bawah sebelah kiri, di mana anda juga boleh menentukan penyemak imbas yang anda gunakan dan melihat bagaimana ia akan kelihatan dalam tetingkap penyemak imbas.
Dalam lampiran kepada pelajaran anda akan dapati, sebagai tambahan kepada fail JPA dan bersedia fail GIF, dan juga folder dengan latar belakang yang boleh anda gunakan dalam kerja anda. mereka foto asal Saya tidak melampirkannya - selepas semua, anda akan menggunakan anda sendiri.
Dalam pelajaran ini kita melihat bagaimana untuk melakukannya kesan perubahan halaman menggunakan Photoshop, optimumkan dan simpan gif yang dibuat untuk disiarkan pada sumber Internet.
Dengan itu, terima kasih atas perhatian dan kesabaran anda.
Semoga berjaya dengan kerja kreatif anda.
Muat turun pelajaran dalam Format PDF dan sumbernya:
Untuk mendapatkan pelajaran yang menarik ke alamat anda,
Masukkan butiran anda dalam borang langganan di bawah:
Penambahbaikan yang menarik pada dokumen PDF hiperteks adalah dengan menambah kesan mengubah halaman padanya. Di samping itu, anda boleh menyepadukan elemen multimedia ke dalam dokumen: masukkan imej, tambah bunyi dan video.
Di mana dan untuk apa mainan sedemikian - dokumen multimedia - berguna? Mungkin, pertama sekali, semasa membuat pembentangan. Kesan tambahan asal akan menghiasi persembahan slaid dan menambah maklumat pada bahan. Hadiah atau arkib eksklusif ialah album foto dengan ulasan daun, muzik dan suara. Selain itu, dokumen dan buku 3D yang menarik multimedia tersebut digunakan sebagai sumber pendidikan untuk menggalakkan pembelajaran yang lebih baik.
Mari cuba beberapa alat untuk membina produk maklumat yang menarik ini.
Aplikasi desktop yang popular ialah Flip Builder. Muat turun pembina ini untuk menyelak dokumen pdf dari laman web rasmi pembangun. Pembukaan halaman rumah alamat: flipbuilder.com dan dengan mengklik pada bendera Persekutuan Rusia kami akan mengubahnya. Klik butang "Ketahui lebih lanjut", pergi ke halaman muat turun dan klik "Muat turun" untuk memulakan proses muat turun. Setelah muat turun selesai, buka pek arkib zip dan jalankan fail pemasangan: flip-pdf-pro.exe
Kami melalui langkah-langkah wizard pemasangan dan dalam tetingkap terakhir klik butang "Cuba". Selepas ini, antara muka aplikasi dibuka dan kami mula bekerja.
Klik butang "Buat baharu" hijau. Tetingkap "Import PDF" muncul, di mana, menggunakan butang "Lihat", buka Explorer dan pilih fail PDF yang disediakan untuk penukaran pada komputer anda. Kemudian klik butang "Import sekarang":
Selepas beberapa ketika, dokumen itu dibuka dalam aplikasi dan sedia untuk diselak. Kini anda boleh mula mengedit dan menambah elemen tambahan padanya.
Mula-mula, mari kita berlatih menggunakan templat untuk mereka bentuk dokumen. Templat, seperti yang ditunjukkan dalam ulasan kepada mereka, berbeza bukan sahaja penampilan, tetapi juga berfungsi:
Setelah memilih templat yang sesuai, kembangkan menu tetapannya. Dengan menukar nilai elemen dalam senarai, anda boleh melaraskan mod paparan panel, butang kawalan dan banyak lagi:
Kami telah selesai dengan templat dan teruskan ke bahagian penyuntingan.
Seterusnya, sebagai contoh, saya akan menunjukkan secara terperinci bagaimana saya membuat risalah multimedia - lawatan sejarah yang singkat tanah asal. Menulis buku tentang Almaty. Menulisnya, sudah tentu, ia dikatakan dengan kuat. Disalin dan ditampal daripada sumber yang berbeza penerangan penting, pada pendapat saya, peristiwa dari sejarah bandar. Saya telah mengeditnya mengikut keperluan dan menyusunnya mengikut kronologi. Saya menggambarkan kandungan dengan gambar yang sesuai. Saya melakukan semua operasi ini dalam Word. Selepas itu, saya menomborkan halaman bermula dari yang ketiga dan mencipta jadual kandungan interaktif, seperti yang diterangkan dalam pelajaran: hiperpautan dalam Word. Kemudian saya menyimpan dokumen dari Word ke format PDF.
Untuk alih suara, saya sebelum ini menyediakan fail audio dalam format mp3 untuk setiap halaman - Saya menggabungkan trek teks dengan trek latar belakang. Saya mencampurkan bunyi menggunakan aplikasi Audacity. Muat turun versi terkini Program ini boleh diakses dari laman web rasmi pembangun di: http://www.audacityteam.org
Dengan menyambungkan set kepala audio, anda boleh merakam bunyi terus dari mikrofon ke dalam editor - mencipta trek suara atau mengimport fail audio yang telah disediakan sebelumnya. Mudah dipelajari, intuitif program yang jelas, di mana setiap alat mempunyai petua alat. Semasa pemasangan, pilih bahasa Rusia. Kami mengeksport projek audio yang telah siap dan menyimpannya ke fail mp3.
Mari kembali kepada pereka Flip PDF Professional.
Dalam editor halaman selak program ini, gunakan butang "lagi" untuk mengembangkan senarai elemen tambahan dan pilih bahagian "Tambah". pemain bunyi":
Tetingkap "Jenis Bunyi" akan muncul - jenis pemain, di mana kami memilih jenis pemain, dan kemudian memasukkannya ke dalam buka halaman dokumen:
Sekarang, di bahagian ketiga kanan tetingkap editor, klik butang "Pilih bunyi", pergi ke Explorer, cari pada komputer fail audio yang telah disediakan sebelum ini untuk halaman ini dan bukanya:
Dalam bahagian ini kami akan mengkonfigurasi mod pengendalian pemain. Saya menetapkan main semula untuk bermula apabila anda mengklik pada pemain, supaya pembaca mempunyai pilihan: baca sendiri atau dengar. Dan saya memilih untuk mematikan bunyi apabila keluar dari halaman:
Anda juga boleh mengedit kulit pemain dalam tetingkap ini.
Oleh itu, kami memasang pemain dengan fail audio yang sepadan pada semua halaman dokumen yang dipilih untuk alih suara. Setelah selesai mengedit, simpan perubahan dengan butang "Simpan dan Keluar", yang terletak di sudut kanan atas.
Untuk menerbitkan dokumen multimedia yang telah siap, gunakan butang "Tukar" untuk membuka senarai format yang dicadangkan dan pilih yang sesuai:
Anda boleh memuat turun arkib dan melihat risalah interaktif dalam format ini menggunakan pautan: .
Pembangun flip builder menggunakan tera air sebagai insentif untuk membeli produk mereka. Sesungguhnya, tanda sedemikian di tengah-tengah setiap halaman dokumen menjadikannya tidak sesuai untuk paparan atau pengedaran:
Tetapi sebaliknya, dalam aplikasi demo pembina ini tidak ada sekatan pada jumlah dokumen, tidak seperti program yang serupa FlippingBook, sebagai contoh, di mana dalam versi Percubaan Hanya sepuluh halaman dimuatkan.
Dalam itu ulasan kecil menunjukkan contoh pembentukan dokumen multimedia ringkas dengan navigasi dan iringan audio. Menggunakan keupayaan penyuntingan lain, anda boleh mencipta projek yang lebih menarik dan mengagumkan dalam pereka bentuk.
