Merancang Prototaip 5 Aplikasi Yang Lebih Baik Daripada Photoshop
Photoshop adalah alat yang popular dengan pereka dan sambungannya seperti CSS3Ps dan FontAwesomePS menjadikannya alat yang baik untuk membuat prototaip reka bentuk web juga. Walau bagaimanapun, ia tidak benar-benar dicipta untuk tujuan ini dan sebagai trend semasa menolak ke hadapan dengan reka bentuk responsif, CSS Pra-pemproses, Rangka Kerja CSS, dan grafik bebas resolusi (SVG), Photoshop menjadi kurang relevan untuk reka bentuk web.
Tidak perlu risau kerana terdapat banyak aplikasi alternatif yang dibina oleh pemaju bebas untuk membantu mengisi jurang. Dalam catatan ini, kami akan melihat aplikasi ini, dan mengetahui sejauh mana ciri mereka cemerlang apabila dibandingkan dengan Photoshop untuk mewujudkan prototaip reka bentuk web.
1. Webflow
Webflow membolehkan anda merekabentuk laman web dengan drag-and-drop. Webflow mewujudkan susun atur berdasarkan grid Bootstrap supaya reka bentuk laman web anda bersedia-responsif. Webflow juga dilengkapi dengan satu set komponen web standard seperti blok, senarai, dan pemformatan teks yang boleh anda tambahkan ke ruang kerja Webflow.
Gaya boleh ditambah dengan mudah dari sidepanel dan anda boleh menyesuaikan sifat-sifat unsur-unsur seterusnya. Apabila reka bentuk selesai, anda boleh mengeksport hasil reka bentuk ke dalam kod HTML dan CSS. Anda juga boleh berkongsi kerja dengan pasukan.
2. Avocode
Avocode menyokong fail JPA dan membolehkan anda segera mengedit dan mengubahnya menjadi laman web yang boleh berfungsi dengan HTML dan CSS. Avocode akan mengekstrak semua aset dalam projek anda termasuk CSS, Imej, dan SVG (jika ada). Anda boleh dengan mudah mengekstrak CSS, dalam bentuk Kurang, SASS atau Stylus untuk mana-mana lapisan yang dipilih, kerana ia telah diintegrasikan dengan CSSHat.
Selain itu, Avocode dilengkapi dengan kawalan semakan yang membolehkan anda kembali ke reka bentuk terdahulu anda, sekiranya berlaku apa-apa.
3. Macaw
Macaw membolehkan anda merekabentuk susun atur web dan elemen web jika anda bekerja pada editor imej seperti Adobe Photoshop. Anda boleh membuat lajur atau kawasan blok, menyesuaikan kedudukan mereka, dan menetapkan tipografi seperti yang diperlukan. Macaw membolehkan anda mengubah gaya pelbagai elemen dalam satu tempat. Anda juga boleh menggunakan perpustakaan untuk menyimpan semua elemen untuk kegunaan kemudian.
Untuk membuat reka bentuk responsif, Macaw membolehkan anda menetapkan titik putus dan mengoptimumkan tapak anda untuk semua peranti. Apabila proses reka bentuk selesai, Macaw boleh menghasilkan HTML dan CSS yang sesuai untuk anda.
4. lakaran
Lakaran sangat sesuai untuk mereka bentuk antara muka dan laman web. Ia mewujudkan objek berasaskan vektor dan bukannya dalam bitmap. Oleh itu apabila anda saiz saiz kanvas, reka bentuk anda tidak kehilangan kualiti. Ciri-ciri seperti 'grid terbina dalam' akan membantu anda mengatur lebih baik objek atau penempatan susun atur web.
Di samping itu, lakaran membuat fon serupa dengan apa yang ditunjukkan di Webkit (fikir Chrome, Opera, dan Safari). Oleh itu, anda tidak perlu bimbang tentang hasil teks dalam imej yang tidak begitu tajam dan tepat kerana teks asal dipaparkan pada penyemak imbas. Lakaran juga boleh mengeksport CSS untuk setiap elemen di lapisan.
5. Antetype
Antetype adalah aplikasi berasaskan vektor yang memberi tumpuan kepada reka bentuk visual, hebat untuk mencipta elemen antara muka seperti kecerunan, kejatuhan bayang, bayangan batin, bayangan teks, gaya sempadan dan sudut bulat. Antetype juga menyediakan beratus-ratus widget yang boleh anda gunakan secara langsung dalam projek anda.
Untuk membuat reka bentuk responsif, anda boleh menetapkan titik putus yang akan menyesuaikan saiz skrin. Anda juga boleh mengeksport setiap elemen dalam bentuk Imej atau CSS.
