Tampilkan postingan dengan label Design. Tampilkan semua postingan
Tampilkan postingan dengan label Design. Tampilkan semua postingan

Rabu, 07 Januari 2015

Kumpulan Resource Untuk Framework Node.js

Node.js adalah salah satu javascript framework populer dan banyak digunakan untuk membangun aplikasi web. Ada beberapa jenis framework Node.js seperti MVC framework, REST API & Generators. Framework tersebut membuatnya lebih mudah digunakana dan sangat user-friendly, juga mendukung banyak fitur dan fungsionalitas untuk membangun web aplikasi yang besar.

01. Sails.js

Sails.js adalah framework Node.js seperti Ruby on Rails, tapi ini mendukung untuk modem, pengembangan web aplikasi yang beriorientasi data. Framework node.js ini memudahkan kita untuk membangun aplikasi custom, aplikasi Node.js berskala enterprise.
sails

02. Koa

Koa adalah framework Node.js yang dirancang oleh tim dibelakang Express. Sebuah aplikasi Koa adalah obyek yang terdiri dari sususan fungsi generator middleware yang mengirim dan mengeksekusi dalam stack.

03. Express

Express.js adalah framework node.js yang memiliki performa tinggi namun sangat kecil. Express node.js framework adalah solusi bagus untuk aplikasi satu halaman, websites, hybrids atau API HTTP publik.

04. Flatiron

Flatiron adalah sebuah inisiatif framework yang tidak mengganggu untuk node.js. Pendekatan Flatiron adalah untuk paket yang mudah digunakan namun memiliki fitur komponen lengkap dan membiarkan developer untuk mengurangi dan menambahkan apa yang mereka inginkan.

05. Restify

Restify adalah modul node.js yang dibangun khusus untuk memungkinkan Anda untuk membangun REST web services yang benar. Restify hadir dengan dukungan DTrace secara otomatis. Jika anda menjalankan pada platform yang mendukung DTrace.

06. SocketStream

SocketStream adalah web framework jenis terbaru yang menggunakan soket web untuk mendorong data ke browser secara realtime. Ini memudahkan untuk membuat sesuatu yang cepat, interface yang keren yang bertindak lebih seperti aplikasi desktop dibanding aplikasi web tradisional.
SocketStream

07. Total.js

Total.js adalah salah satu framework node.js terbaik untuk membuat rich website dan web services. Framework ini memiliki dokumentasi yang baik dan disertai banyak contoh. Framework ini mendukung URL Frienly, XHR, JSON, LESS CSS (CSS3), Javascript minifier, proteksi XSS, resources dan dukungan arsitektur MVC.

08. Locomotive

Locomotive adalah juga framework node.js yang sudah mendukung pola MVC, router, RESTful routers dan konvensi diatas konfigurasi, mengintegrasikan dengan mulus kepada database dan template engine.

09. Socket.io

Socket.io adalah realtime aplikasi framework untuk node.js dengan HTML5 websockets dan dukungan cross-browser fallbacks.

10. Frisby

Frisby adalah REST API testing framework yang dibuat dengan Node.js dan jasmin yang membuat pengujian tahap akhir menjadi mudah, cepat, dan menyenangkan. Frisby dibangun diatas framework jasmin BDD, dan menggunakan jasmine-node untuk menjalankan tes spec.
Itulah beberapa resource untuk framework node.js yang bisa anda gunakanan jika anda ingin membangun web dengan menggunakan node.js. Semoga ini bermanfaat untuk anda, sampai jumpa pada tulisan jurnal web indonesia berikutnya.

Cara Mengetahui Apakah Website Anda Perlu Perubahan

Beberapa Cara Untuk Mengetahui Apakah Website Anda Perlu PerubahanRedesign memang kadang diperlukan pada sebuah website, bukan hanya website, bahkan kemasan produk pun kadang di redesign agar tampilan nya tidak membosankan.
Sebuah website adalah wajah dari organisasi/perusahaan anda di dunia maya. Disaat karyawan perusahaan anda hanya dapat hadir untuk waktu yang terbatas pada jam kerja saja yang biasa nya 8 jam sehari, website hadir 24×7 untuk berkomunikasi dengan klien. Oleh karena itu website harus selalu mencerminkan aspek terbaik dari organisasi anda. Website harus up to date. Sebuah perubahan pada website bisa menjadi ancaman serius untuk pendapatan perusaahaan anda. Tapi bagaimana untuk benar-benar mengetahui bahwa website Anda membutuhkan perubahan?
redesign
Pada tulisan ini kami akan menyebutkan beberapa hal penting yang harus anda perhatikan sebelum melakukan perubahan pada website.
Apakah desain website anda sudah responsive? Hal ini sangat penting untuk diketahui bahwa pengunjung website anda saat ini bisa datang dari mana saja, menggunakan perangkat yang bermacam-macam, baik itu ponsel, komputer tablet atau dektop. Jadi responsif adalah hal pertama yang harus anda perhatikan.
Apakah maksud website anda cukup jelas, atau justru pengunjung perlu meluangkan waktu untuk berfikir lebih lama agar mengetahui tujuan dari situs anda? Sebuah website yang jelas maksudnya tentu akan lebih baik.
Apakah tombol share ke sosial media terlihat dengan jelas disetiap halaman website anda? Sosial media semakin hari semakin ramai penggunanya, jadi pastikan ada tombol share ke sosial media di website anda.
Apakah website anda mencerminkan profesionalisme, mencerminkan apa yang dilakukan organisasi anda? Sebuah wesbite murahan dan membosankan akan mengirimkan pesan negatif kepada kostumer anda.
Apakah logo, banner dan gambar/foto berada pada website yang menarik dan berkualitas tinggi? Sebuah gambar bernilai seribu kata jadi harus memiliki sifat menarik perhatian pengunjung dalam sekali pandang.
Konten adalah raja dan selamannya akan seperti itu. Silahkan lihat pada konten dan jika diperlukan adanya perubahan maka lakukan segera, selalu upayakan konten yang berkualitas, berguna, dan tidak basi.
Content is king

Call to action memainkan peranan sangat penting dalam meningkatkan pendapatan dan penjualan pada bisnis anda. Pastikan bahwa ada setidaknya satu tombol call to action pada setiap halaman situs anda.
Terakhir, namun sedikit detail yaitu tanyakan kepada pengunjung website anda melalui halaman kontak juga sangat penting untuk mengetahui apa kesulitan mereka ketika berada di website anda. Dari masukan itu anda bisa simpulkan apakah harus melakukan perubahan atau tidak.
Setelah membaca poin-poin diatas, jika anda merasa perubahan perlu untuk dilakukan di website anda, anda bisa melakukan perubahan sendiri atau menyewa orang yang lebih profesional dibidang tersebut untuk melakukan perubahan dan merenovasi website anda agar jadi lebih baik.

Selasa, 06 Januari 2015

Pengenalan CSS

Sebelum rekan-rekan sekalian mempelajari CSS, diasusmsikan rekan-rekan sudah memahami dasar dasar HTML / XHTML.

Pengertian CSS
Apa itu CSS?
CSS adalah singkatan dari Cascading Style Sheets. Berisi rangkaian instruksi yang menentukan bagiamana suatu text akan tertampil di halaman web.
Perancangan desain text dapat dilakukan dengan mendefinisikan fonts (huruf) , colors (warna), margins (ukuran), latar belakang (background), ukuran font (font sizes) dan lain-lain. Elemen-elemen seperti colors (warna) , fonts (huruf), sizes (ukuran) dan spacing (jarak) disebut juga “styles”.
Cascading Style Sheets juga bisa berarti meletakkan styles yang berbeda pada layers (lapisan) yang berbeda.
CSS terdiri dari style sheet yang memberitahukan browser bagaimana suatu dokumen akan disajikan.
Fitur-fitur baru pada halaman web lama dapat ditambahkan dengan bantuan style sheet.
Saat menggunakan CSS, Anda tidak perlu menulis font, color atau size pada setiap paragraf, atau pada setiap dokumen. Setelah Anda membuat sebuah style sheet, Anda dapat menyimpan kode tersebut sekali saja dan dapat kembali menggunakannya bila diperlukan.

Keuntungan Menggunakan CSS
CSS memberikan keseragaman pada halaman web.
Dengan CSS dapat menghemat banyak waktu dan pekerjaan berulang. Saat menggunakan CSS, perubahan tidak perlu dilakukan dalam setiap halaman web. Anda hanya perlu membuat perubahan dalam style sheet.
CSS memungkinkan Anda untuk memuat halaman web Anda dengan mudah.
Layers (Lapisan), seperti item pop-up, dapat digunakan dalam dokumen.
CSS membantu Anda memelihara halaman web Anda dengan mudah dan efektif.

Atribut HTML

HTML Attributes atau atribut HTML adalah suatu informasi tambahan yang bisa disertakan pada suatu elemen HTML. Suatu elemen dapat memiliki atribut. Atribut ini memberikan informasi tambahan tentang elemen yang bersangkutan. Atribut selalu digunakan pada awal tag / start tag. Cara mendefinisikan atribut dengan memberikan informasi name dan value dari suatu elemen, seperti name=”value”.

Contoh Atribut :
Link HTML atau HTML Links didefinisikan dengan tag <a>. Alamat link inilah yang merupakan atribut.
<a href="http://www.pemrograman.org/">Pemrograman</a>
Coba contoh HTML diatas dengan HTML Editor.
Jadi <a> merupakan elemen html, href adalah name atau nama atribut sedang Pemrograman adalah value atau nilai atribut.Berikut adalah beberapa atribut standar yang hampir dipakai semua elemen:
AtributNilaiKeterangan
classclass_rule atau style_ruleKelas elemen
idid_nameNomor unik suatu elemen
stylestyle_definitionDefinisi gaya atau style
titletooltip_text Tulisan yang akan tertampil pada tool tip

Nilai suatu atribut harus selalu dimulai dan diakhiri dengan tanda petik. Biasanya menggunakan tanda petik (“…”). Tanda petik ini mengapit petikan langsung dari suatu nilai elemen. Tanda petik tunggal juga diperlehkan untuk digunakan walaupun dalam keadaan tertentu nilai suatu atribut bisa berisi tanda kutip, untuk itu di pergunakan tanda kutip tunggal yang mengapit petikan yang tersusun di dalam petikan lain. Contoh :
name=’Komunitas “Programmer” Indonesia’

Sangat disarankan untuk penulisan atribut dan nilainya tetap menggunakan huruf kecil karena pada versi HTML yang lebih baru (X)HTML meminta penulisan menggunakan huruf kecil.

Dasar-Dasar HTML


Saat mempelajar HTML, terdapat dasar HTML yang paling sering dipergunakan dalam penulisan HTML. Meliputi : HTML Headings, HTML Paragraphs, HTML Links dan HTML Images.

HTML Headings
Heading atau Judul ditulis menggunakan tag <h1>, <h2>, <h3>, <h4>, <h5> dan <h6>.
1
2
3
<h1>Judul</h1>
<h2>Judul</h2>
<h3>Judul</h3>
Coba contoh HTML diatas dengan HTML Editor.

HTML Paragraphs
Paragraf ditulis menggunakan tag <p>.
1
2
3
4
5
6
<p>Paragraf pertama</p>
<p>Paragraf kedua</p>
<p>Paragraf ketiga</p> 
<p>Paragraf keempat</p>
<p>Paragraf kelima</p>
<p>Paragraf keenam</p>
Coba contoh HTML diatas dengan HTML Editor.

HTML Links
Links ditulis menggunakan tag <a>.
1
<a href="http://www.pemrograman.org/">Pemrograman.org</a>
Coba contoh HTML diatas dengan HTML Editor.

HTML Images
Gambar ditulis menggunakan tag <img>.
1
<img src="statx.jpg" width="738" height="327" />

Pengenalan HTML


Sebelum belajar HTML, alangkah lebih baik jika kita memahami konsep dasar HTML terlebih dahulu.

Pengertian HTML
HTML adalah suatu bahasa yang dipergunakan untuk mendeskripsikan halaman web.
HTML merupakan singkatan dari Hyper Text Markup Language.
HTML bukan merupakan bahasa pemrograman, HTML adalah suatu markup language (bahasa markah).
Suatu markup language berupa serangkaian markup tags.
HTML menggunakan markup tags untuk mendeskripsikan halaman web. 

HTML Tags
HTML markup tags biasa disebut HTML tags.
HTML tags berupa keywords atau kata kunci yang diapit oleh tanda kurung seperti <html>.
HTML tags biasanya dipakai berpasangan seperti <b> dan </b>.
Tag pertama dalam pasangan html tags adalah start tag atau tag awal, sedang tag kedua adalah end tag atau tag akhir.
Start tags dan end tags biasa juga disebut opening tags dan closing tags.

HTML Documents = Web Pages
HTML documents atau dokumen HTML mendeskripsikan suatu web pages atau halaman web.
HTML documents berisi HTML tags dan plain text atau text biasa.
HTML documents atau dokumen HTML juga biasa disebut web pages atau halaman web.


Tujuan dari sebuah web browser (seperti Internet Explorer, Firefox, Opera, Safari atau Google Chrome) adalah untuk membaca HTML documents kemudian menampilkannya sebagai halaman web. Browser tidak menampilkan HTML tags, tetapi menggunakan tag tersebut untuk menterjemahkan isi dari halaman web.
1
2
3
4
5
6
7
8
9
<html>
<body>
 
<h1>Judul Pertama</h1>
 
<p>Paragraf pertama</p>
 
</body>
</html>


Coba contoh HTML diatas dengan HTML Editor.

Penjelasan Contoh
Teks di antara <html> dan </html> mendeskripsikan web page.
Teks di antara <body> dan </body> adalah konten halaman web yang akan tertampil.
Teks di antara <h1> dan </h1> digunakan untuk menampilkan judul.
Teks di antara <p> dan </p> digunakan untuk menampilkan paragraf.

Selasa, 20 November 2012

Design your Career seminar series

Design your Career I. – Getting into Design

Photoshop seminar – 1. Choose your Career from Martin Perhiniak on Vimeo.

Have you always been interested in Photoshop and all the cool things you can do with it? Have you always been dreaming of a creative job where you would be using Photoshop all the time and working on exciting and fun projects? From this seminar you will be able to learn everything you need to know about all the creative professions using Photoshop as their main tool. Martin Perhiniak will teach you lots of useful techniques on this seminar while explaining the differences between these professions. This is the first session of a 3-part series about the three steps to find jobs in the creative industry.

Design your Career II. – How to Build Your Portfolio

Photoshop seminar – 2. How to Find a Creative Job from Martin Perhiniak on Vimeo.

The most important asset you have as a designer is your portfolio. It is the real deal. Your portfolio tells more about you and your design skills than any qualifications or certificates. That is why it is so important to build it and present it well online and face to face on interviews. Martin Perhiniak will share all his special techniques he used for his portfolio and on interviews, which helped him to work on design projects for Disney, Pixar, Cartoon Network, Mattel, Sony Pictures, Electronic Arts, etc. at the age of 26. This is the second session of a 3-part series about the three steps to find jobs in the creative industry.

Design your Career III. – A Day in a Designer’s Life

Photoshop Seminar – 3. A Day in a Designer’s Life – Timesavers from Martin Perhiniak on Vimeo.

Once you start working as a designer you will have to cope with several difficulties every day. The biggest one is to be able to deliver creative ideas with tight deadlines. How can you be creative when there is a time pressure? How can you deliver great designs without having time to properly prepare for a project? What suits you better; being a full-time designer working in a team, or being a freelancer working on your own? What are the best practices in Photoshop that can save you a lot of time every day working with tight deadlines? These and many other similar questions will be answered on this seminar by Martin Perhiniak, who have been working as a full-time and freelance designer for many years and he will share some of his best kept Photoshop timesaver secrets for the first time. This is the last session of a 3-part series about the three steps to find jobs in the creative industry.

Links mentioned on the seminars:

Places to look for jobs in the creative industry:

If you have any questions please ask them on the blog’s Facebook page: Facebook

Lightroom 4 series on MacProVideo.com


Lightroom 4 100 – Quickstart Guide


Lightroom 4 provides a comprehensive set of digital photography tools, from powerfully simple one-click adjustments to cutting-edge advanced controls. In this FREE course Adobe Design Master and Instructor Martin Perhiniak guide you through the new powerful features of Lightroom 4. Every photographer needs three things: quick and flexible editing tools to make every photo the best it can be, a great organization system to sort through their images and ways to get their best images out into the world. Lightroom 4 offers all this and much more, making it the top choice for veterans and enthusiastic amateurs alike!


Lightroom 4 101 – Building A Photo Library


Building an effective photo library is an important asset to every professional photographer. Join Adobe Master Instructor Martin Perhiniak as he shows you how to construct and develop your library using Lightroom 4.
What are the benefits of having an organized photo library? Where does Lightroom 4 fit in with the Adobe software product family? Why use Lightroom versus Adobe Bridge?…Photoshop? Why use Camera RAW files? What are DNG files? This 50-plus video course, by Adobe Certified Instructor Martin Perhiniak, reveals all the answers.


Lightroom 4 102 – Editing Your Photos


Do you want to push every photo you take to maximum perfection? Let Adobe Design Master and Instructor Martin Perhiniak show you how in this 40-tutorial course on Adobe Lightroom 4.
Taking a great photo is one thing, but turning it into a masterpiece is something quite different. If you enjoy perfecting your photos, you’ll be thrilled by the digital editing techniques that Martin Perhiniak demonstrates in Lightroom 4. Building on the foundations that he has laid in his previous courses, Martin reinforces your basic knowledge of the Develop Module while enhancing it with sharp, professional tips and tricks.


Lightroom 4 201 – Objects, Portraits and People


Learn professional techniques from photographer and Adobe trainer, Martin Perhiniak, as he enhances Objects, Portraits and People in this advanced 36-tutorial course exploring the state-of-the-art features of Lightroom 4…
First things first… You’ve got to get your shots into Lightroom, right? That’s why Martin begins this course with a short, refresher section on photo file formats and organization strategies used in the current versions of both Lightroom and Adobe Camera Raw.


Testimonial:
Learning all one needs to know about applications using MacProVideo has always been my favorite method. No need to go to classes at specific hours and sit in with people that are not at the same level and often take up all the teachers time. Watching MPV is fun, educative and best of all you can have the teacher repeat a thousand times the same thing without being thrown out of the class. I found Martin Perhiniak particularly interesting to listen to with a friendly and caring tone of voice. I look forward to buying his next module.
-Jose Alonso


If you have any questions please ask them on the blog’s Facebook page: Facebook