10-tools-untuk-membuat-website-responsive »
Apa saja 10 tools untuk membuat website responsive?
1.Gridset
Gridset adalah tools yang membantu web designer and developer dalam mendesain, menciptakan prototype dan membangun layout grid yang responsif untuk proyek situs mereka.
Grid juga bisa membantu menciptakan grid yang Anda perlukan, dari grid reguler hingga grid yang biasa ada di framework CSS.
Gridset juga bisa digunakan untuk berbagai CMS seperti Joomla, Drupal, dan WordPress, juga bisa berjalan lancar di aplikasi pengolah grafis seperti Photoshop dan Fireworks.
2. Wirefy
Wirefy adalah tools yang fokusnya adalah membuat wireframe. Dengan pengetahuan CSS dan HTML, cukup mudah untuk mulai membangun wireframe tanpa repot dengan kalkulasi yang memusingkan.
Wirefy sendiri sebenarnya hanyalah sekumpulan snippet HTML dan template yang dapat diskalakan di berbagai perangkat. Jika Anda adalah seorang pengembang atau desainer, menggunakan wireframe menggunakan Wirefy adalah opsi yang layak dicoba.
3. Adobe Edge Inspect
Ingin memeriksa responsivitas situs, tapi perangkat yang tersedia terbatas? Anda bisa menggunakan Adobe Edge Inspect.
Dengan tool satu ini, Anda bisa melihat bagaimana situs Anda berjalan di berbagai perangkat. Sistemnya mirip dengan simulasi; Anda menjalankan situs seolah-olah perangkat yang Anda pakai benar-benar ada.
Adobe Edge Inspect sendiri menyediakan simulasi berupa iPad, Droid X, iPhone, Nexus, dan sejumlah perangkat lainnya.
4. Gumby 2
Dibangun menggunakan preprosesor Sass, Gumby 2 adalah sebuah framework responsif yang mudah diunduh dan diatur sesuai kebutuhan Anda.
Anda dapat mendesain gambar yang responsif dan embed video dengan rasio yang otomatis menyesuaikan diri. Ada pula tools lain seperti grid, form, berbagai tombol dan switch, tab, dan template siap pakai.
5. Adobe Edge Reflow
Edge Reflow adalah sebuah tool yang akan sangat membantu Anda menciptakan situs responsif tanpa mengurangi keindahan desain. Anda bisa mengkonversi desain yang masih berupa PSD menjadi format HTML dan CSS, lalu menyesuaikannya agar responsif di Reflow.
Reflow bisa membantu Anda mendesain situs secara visual. Anda mungkin membutuhkan pengetahuan dasar seputar HTML dan CSS, tetapi sisanya bisa menggunakan Reflow ini.
6. Bootstrap
Bootstrap adalah sebuah platform pengembangan situs dengan framework HTML, CSS, dan JS, yang penting dalam mengembangkan situs yang efektif dan efisien.
Dibuat di Twitter oleh Mark Otto dan Jacob Thornton, platform ini didesain untuk beradaptasi dengan desktop, tablet, dan ponsel pintar terbaru.
7. Invision
Invision App tidak berperan secara langsung dalam pengembangan situs responsif. Tools ini merupakan senjata Anda untuk mengkomunikasikan desain dan transisi desain pada tim Anda. Ini akan membantu Anda untuk bereksperimen terhadap desain secara real time dan bersama-sama, meskipun Anda dan tim berjauhan.
8. Export Kit
Photoshop kerap digunakan untuk mendesain situs. Karena versatilitasnya ini, tak sedikit orang masih menggunakannya, meskipun perangkat pendesain situs lain sudah ada.
Malah kini desain situs dengan Photoshop semakin mudah, karena ada tool bernama Export Kit. Tool ini dapat membantu mengkonversi desain Anda dari .psd menjadi HTML, CSS, WordPress, dan format populer lainnya.
9. UXpin
UxPin adalah sebuah aplikasi pendesain dan kolaboratif, yang membantu Anda membuat desain situs secara bersama-sama dan interaktif. Tool ini berisi banyak sekali elemen desain dan elemen UI siap pakai.
10. Marvel
Marvel adalah sebuah tool online hebat yang membantu desain dalam membuat prototipe aplikasi mobile dan project situs. Tool ini berbasis web dan tidak membutuhkan kemampuan coding yang tinggi.
Menurut Marvel, aplikasi ini dapat membantu Anda mengubah sketsa, gambar, dan bahkan mockup menjadi prototipe mobile dan web yang realistis.
Perlu digarisbawahi: tool ini tidak mengubah sketsa Anda menjadi aplikasi yang sebenarnya, tool ini membantu Anda membuat sketsa atau konsep Anda menjadi sesuatu yang berwujud, meskipun tidak benar-benar berfungsi.
Nah, demikian tadi 10 tools untuk membuat website responsive. Selamat mencoba!
