PKK Dan KWU: 2019

Selasa, 19 November 2019

JavaScript

JavaScript (/ˈdʒɑːvəˌskrɪpt/^[3]) adalah bahasapemrograman tingkat tinggi dan dinamis.^[4]JavaScript populer di internet dan dapat bekerja di sebagian besar penjelajah webpopuler seperti Google Chrome, Internet Explorer (IE), Mozilla Firefox, Netscape dan Opera. Kode JavaScript dapat disisipkan dalam halaman web menggunakan tagSCRIPT.^[5] JavaScript merupakan salah satu teknologi inti World Wide Web selain HTMLdan CSS. JavaScript membantu membuat halaman web interaktif dan merupakan bagian aplikasi web yang esensial.
Penulisan JavaScript

Variabel di JavaScript dapat dipanggil dengan menggunakan kata kunci var

var x;
var y = 2;

Kode JavaScript biasanya dituliskan dalam bentuk fungsi yang ditaruh di tag <head> yang dibuka dengan tag <script type="text/javascript">.^[9]

<script type="text/javascript">
 alert("Halo Dunia!");
</script>

Kode JavaScript juga bisa diletakkan di filetersendiri yang berekstensi .js (singkatan dari JavaScript).^[9] Untuk memanggil kode JavaScript yang terdapat di file sendiri, di bagian awal <head> harus ditentukan dahulu nama file .js yang dimaksud menggunakan contoh kode seperti berikut:^[9]

<script type="text/javascript" src="alamat.js">
</script>

Skrip di headSunting

Skrip ini akan dieksekusi ketika dipanggil (biasanya berbentuk function) atau dipanggil berdasarkan trigger pada event tertentu.^[9]Peletakkan skrip di head akan menjamin skrip dimuat terlebih dahulu sebelum dipanggil.^[9]

<html>
<head>
<script type="text/javascript">
...
</script>
</head>
</html>

Skrip di bodySunting

Skrip ini dieksekusi ketika halaman dimuat sampai di bagian <body>.^[9] Ketika menempatkan skrip pada bagian <body>berarti antara isi dan JavaScript dijadikan satu bagian.^[9]

<html>
<head>
</head>
<body>
<script type="text/javascript">
...
</script>
</body>
</html>

Jumlah JavaScript di <head> dan <body> yang ditempatkan pada dokumen tidak terbatas.^[9]

Skrip eksternalSunting

Terkadang ada yang menginginkan menjalankan JavaScript yang sama dalam beberapa kali pada halaman yang berbeda, tetapi tidak mau disibukkan jika harus menulis ulang script yang diinginkan di setiap halaman.^[9] Maka JavaScript dapat ditulis di file secara eksternal.^[9] Jadi, antara dokumen HTML dan JavaScript dipisahkan, kemudian berkas tersebut dipanggil dari dokument HTML.^[9] Berkas JavaScript tersebut disimpan dengan ekstensi .js.^[9]

JavaScript: js/xxx.js document.write("pesan ini tampil ketika halaman diload");

Untuk menggunakan eksternal JavaScript (.js) dipakai atribut "src" pada tag <script> pada halaman HTML-nya.^[9]

<html>
<head>
</head>
<body>
<script src="xxx.js">
</script>
<p>Script di atas berada di berkas "xxx.js" (eksternal) </p>
</body>
</html>

   Sumber :https://id.m.wikipedia.org/wiki/JavaScript

HTML

Hypertext Markup Language (HTML) adalah sebuah bahasa markah yang digunakan untuk membuat sebuah halaman web, menampilkan berbagai informasi di dalam sebuah penjelajah web Internet dan pemformatan hiperteks sederhana yang ditulis dalam berkas format ASCII agar dapat menghasilkan tampilan wujud yang terintegerasi.
HTML adalah sebuah standar yang digunakan secara luas untuk menampilkan halaman web. HTML saat ini merupakan standar Internet yang didefinisikan dan dikendalikan penggunaannya oleh World Wide Web Consortium (W3C). HTML dibuat oleh kolaborasi Caillau TIM dengan Berners-lee Robert ketika mereka bekerja di CERN pada tahun 1989 (CERN adalah lembaga penelitian fisika energi tinggi di Jenewa).^[1]

Sumber :https://id.m.wikipedia.org/wiki/HTML

Senin, 18 November 2019

Sublime

Sublime Text adalah editor kode sumber cross-platform shareware dengan antarmuka pemrograman aplikasi Python.

Keunggulan dari Sublime,yaitu :

1.Goto Anything

Membantu dalam membuka file

2.Multiple Selections

Membantu user untuk mengubah secara interaktif

3.Command Pallete

User dapat dengan cepat mencari fungsi yang diinginkan

4.Distraction Free Mode

Membantu user dengan memberikan layar penuh

5.Split Editing

Hasil yang maksimal dari layat monitor

Aplikasi Pembuat Prototype

1. Sketch App.

Photo by sketchapp

Sketch adalah sebuah tool desain berbasisi vektor yang membantu Anda merancang Interface dengan cepat dan intuitif. Seperti kombinasi antara Photoshop dengan Illustrator tetapi tool ini lebih ringan dengan artboard yang tak terbatas. Juga memiliki banyak template yang dapat Anda gunakan untuk proyek Anda untuk membuat interface aplikasi Android, iOS, dan Website. Dengan semakin banyaknya plugin yang sudah dikembangkan para developer, sekarang Anda juga bisa membuat font, meng-generate dummy data dan bisa disinkronkan dengan cloud. Fitur lainnya yaitu “export to code” yang merupakan plugin Launchpad untuk aplikasi Sketch yang berfungsi mengubah design Anda menjadi kode dalam hitungan detik. Ini membantu Anda menyelesaikan projek anda lebih cepat dari sebelumnya. Namun tool ini tersedia hanya untuk pengguna Mac.

2. Adobe XD.

Photo by Adobe

Adobe telah dikenal dengan Photoshop dan Illustrator-nya. Namun tahun lalu Adobe meluncurkan tool prototipe baru UX Adobe Experience Design CC (sebelumnya dikenal sebagai Project Comet). Adobe XD difokuskan pada dua tab yaitu Design dan Prototype. Tab Designmenampilkan tool vektor dan teks sederhana, dan digunakan untuk membuat desain Anda. Tab Prototypeadalah untuk melihat preview, dan berbagi desain Anda. Dengan Adobe, Anda bisa membuat prototype high-fidelity juga pada PC.

Adobe XD dibangun untuk memenuhi kebutuhan UX/UI designers hari ini, dengan tool yang intuitif memberikan ketepatan dan performa yang membuat tugas sehari-hari terasa mudah. Gunakan fitur hemat waktu seperti Ulir Bergambar dan artboards yang fleksibel untuk menciptakan segala sesuatu mulai dari wireframes kesetiaan rendah sampai prototip interaktif sepenuhnya untuk layar dalam hitungan menit. Kabar baiknya untuk Anda bahwa tool ini tersedia untuk Mac maupun Windows.

3. Origami.

Photo by Origami

Dengan tool ini Anda bisa mengeksplorasi dan menguji ide Anda saat membangun produk digital. Sebuah tool baru yang bagus untuk men-design interface modern, dibuat dan digunakan oleh para designerdi Facebook. Anda dimudahkan dalam membuat prototype dengan layer. Bawa layer dari Sketch dan mainkan masks, particle systems, dan live kamera. Menghemat waktu pengerjaan dengan komponen Material dan komponen iOS. Anda bisa membuat library sendiri untuk tim Anda dan merancangnya lebih cepat dengan tim Anda. Tool ini hanya tersedia untuk pengguna Mac.

4. InVision.

Photo by invisionapp

Di antara semua prototyping tool yang populer, ada InVision, yang juga terintegrasi dengan Sketch. Ini merupakan produk Webby yang memberi UI/UX Designer kebebasan untuk men-design, me-review, menguji dan membagikannya dengan developer dan anggota tim lainnya. Keuntungan paling menonjol dari produk ini yaitu terdapat fitur kolaborasi proyek, yang memungkinkan semua usermemberikan umpan balik, membuat catatan dan melihat perubahan produk secara real time. InVision juga menawarkan layanan lengkap untuk membuat prototype untuk mobile, dengan demikian dapat mensimulasikan fleksibilitas produk digital dan penggunaannya di ponsel. Tool ini tersedia untuk Mac maupun Windows.

5. Zeplin.

Photo by zeplin

Bekerja dengan Sketch menjadi sangat menyenangkan ketika kita menggunakannya dengan plugin. Pluginini adalah salah satu yang paling berguna. Ini membantu developer dengan mudah memeriksa ukuran, font, warna dan dimensi interface design Anda. Selain itu, Zeplin memungkinkan download secara langsung setiap elemen dari artboards ke elemens. Dengan mempersiapkan file CSS style dari interface, maka akan menghemat banyak pekerjaan untuk developer front-end. Hanya tersedia untuk pengguna Mac.

6. Framer.

Photo by framer

Dengan tool ini anda dapat membuat gambar, animasi, dan membagikan pekerjaan high-fidelity Anda. Framer adalah tool terbaik untuk screen design dan interactive prototyping. Hal penting yang perlu Anda ketahui yaitu Anda harus ngoding dengan CoffeeScript. Dan ketika Anda menguasainya, tool ini cukup menyenangkan yang memiliki pilihan tanpa batas. Pada dasarnya Anda dapat melakukan semua hal yang mungkin dilakukan di web, seperti menggunakan data secara langsung, atau membuat 100 proyek unik yang berbeda dalam 100 hari. Tool ini memiliki tool desain sendiri di dalamnya tapi juga terintegrasi sempurna dengan Sketch. Jika Anda tidak terlalu berpengalaman dengan Framer saya masih merekomendasikan untuk mencobanya. Ini cukup bagus dan learning curve yang mudah. Akan tetapi tool ini hanya tersedia untuk pengguna Mac.

7. UXPin.

Photo by uxpin

UXPin memungkinkan designer untuk melakukan transisi dengan halus antara setiap tahap dalam proses design, semuanya dalam dokumen yang sama. Paper sketches, wireframes, mockups, prototypes dan semua kombinasi unik dari ini yang dapat Anda pikirkan. Misalnya, Anda dapat membuat wireframe interaktif dengan cepat hanya dalam beberapa menit dan segera mulai mengujinya. Anda kemudian dapat membuat file yang sama, menggabungkan hasilnya dari tes pertama. Membuat pixel-perfect mockup dalam Sketch atau Photoshop, kemudian meng-upload-nya langsung ke dokumen yang sama untuk membuat high-fidelity prototype dari layout wireframe gambar asli yang sama. Menariknya tool ini dapat digunakan di Mac maupun Windows

Sumber :https://techarea.co.id/7-prototyping-tools-yang-bisa-mempermudah-desain-aplikasi-anda/amp/