Archive for 2014

Hosting Terbaik untuk Bisnis Online Profesional

Kontes SEO ini disponsori oleh Jagoan Hosting Indonesia dan Beon.co.id

Penyedia layanan unlimited hosting dengan harga murah tapi tidak murahan, dijamin hosting terbaik untuk bisnis online profesional anda.




hosting murah, hosting terbaik, hosting berkualitas, beon
Kontes SEO ini disponsori oleh Jagoan Hosting Indonesia dan Beon.co.id
Jagoan Hosting
Kontes SEO ini disponsori oleh Jagoan Hosting Indonesia dan Beon.co.id
Beon







Berbicara tentang website tidak lepas dengan adanya hosting terbaik. Hosting berperan penting dalam lahirnya sebuah website. Karena tanpa hosting terbaik website anda tidak bisa berdiri kokoh. Apalagi anda seorang penggiat bisnis online yang membutuhkan website untuk media promosi bisnis online anda. BEON  Hosting Terbaik untuk Bisnis Online Profesional adalah solusinya.


Banyak postingan blog saya yang membahas tentang cara membuat design website, membuat website responsive, dan saya juga share freebies template web responsive. Kalian mungkin sudah ada yang download. atau jika belum boleh dilihat freebies yang saya bagikan seputar web responsive.

Nah, tahukah anda bagaimana website tersebut bisa muncul di internet ?

Yang utama adalah domain dan hosting.

Apasih domain itu ?


Domain ada yang gratisan ada juga yang berbayar. Domain gratisan yang paling sering kalian lihat pasti .blogspot, .wordpress, atau yang lainya.
Sementara domain berbayar seperti .com, .net, .co.id, dan lainya.

Untuk domain yang berbayar masih dibutuhkan jasa hosting terbaik loh.
 

Apasih hosting itu ?

Hosting itu bisa diibaratkan sebidang tanah untuk menempatkan rumah yang diibaratkan file-file website kita. Jadi semua data website yang telah kita bikin bisa di upload di hosting kamu. Nah, untuk kamu yang memiliki bisnis online, pasti butuh hosting terbaik dan tentu saja hosting murah tapi tidak murahan.

mari kita lihat video penjelasan domain dan hosting berikut ini.



Memiliki hosting bukanlah hal yang sesulit dulu. Saat ini penyedia hosting ramai bermunculan. Tapi tidak semua bisa diandalkan. Saya merekomendasikan Beon Unlimited Hosting untuk menjawab keraguan kalian dalam memilih hosting terbaik untuk bisnis anda.

Sebelum menjelaskan lebih lanjut silahkan lihat informasi tentang unlimited hosting dari BEON  yang ada dalam video ini.




Nah, sudah dijelaskan di video tersebut mengenai keunggulan menggunakan hosting unlimited dari  BEON 

Ada 3 paket dalam unlimited hosting ini yang bisa kalian lihat dibawah ini.

Unlimited Web Hosting BEON | Hosting murah
sumber : https://beon.co.id/unlimited-hosting-indonesia
Untuk membandingkan ketiga paket hosting diatas kalian bisa klik disini!

Perbandingan Unlimited Web Hosting BEON | hosting murah

Untuk memulai bisnis online anda, paket JAVA bisa jadi solusi. Karena harganya murah serta fasilitas yang diberikan sudah mencukupi. Setelah bisnis anda berkembang barulah mencoba layanan hosting yang lebih maksimal seperti TORAJA dan SUMATRA. Semua kembali pada anda dalam memilih hosting terbaik untuk bisnis online profesional anda.

Bagaimana ? apakah anda siap menggunakan layanan hosting unlimited dari BEON untuk menunjang bisnis online anda ?
Jangan sampai kalian melewatkan kesempatan emas memasarkan produk andalan kalian hanya karena server website kalian sering down.
Di BEON, tim IT Supportnya melakukan real time monitoring. yang selalu memastikan website anda aman terkendali saat diakses calon pembeli yang mampir di website anda.



Sudah Banyak online shop yang sudah mempercayakan websitenya menggunakan layanan hosting unlimited dari BEON
Seperti sopahola, DBL, dll.
Apakah website anda selanjutnya ?

Semoga penjelasan diatas sedikit banyak bisa memberikan pemahaman seputar hosting terbaik untuk bisnis online kalian. Saya juga mau kasih tau, artikel yang saya jelaskan panjang lebar diatas dalam rangka keikutsertaan konter SEO BEON.

Karena materinya masih seputar dunia website jadi tidak ada salahnya saya share artikel ini. Untuk kalian yang ingin mengetahui info kontes ini bisa klik banner dibawah ini.

 http://beon.co.id/kompetisi-seo-beon/

Video Instagram Gokil


hai blogger, postingan kali ini mau refreshing dulu ya dari yang biasanya post tentang web design kita akan membahas yang sedang hangat terjadi di dunia instagram dan vine.
Tentang Video Instagram mulai dari yang gokil bikin ngakak sampe yang geje abis. di Instagram sendiri ada akun @indovidgram yang menampilkan berbagai video yang menampilkan video-video gokil dan bikin perut dan kumis kalian bergetar 8 skala richter.

Dan ini saya kasih triler yang bikin perut bergetar. Benakribo, Iqbal CJR dan Marlo




Dan di @indovidgram juga biasa me-repost video dari akun lain.cari aja di instagram dengan hastag #indovidgram




Video diatas adalah repost dari @devinaureel dia wanita yang urat malunya terputus hahaha
mungkin cita citanya adalah wanita karir yang kerjaanya bikin lelaki bersujud karena ngakak abiezzz.

Ada lagi Duo Harbatah namanya. Ini orang juga rada edan berparas timur tengah tapi kelakuanya ....


Video lainya banyak tersebar kok di semua sosial media. kamu cuman modal udaha untuk cari sumber video tersebut.

Dan kalo punya nyali silahkan bikin video yang kreatif jangan niru yaaaa ( repost ).

Dan berikut ini hasil video saya yang dibuat secara tidak sengaja dan berada dialam bawah sadar



Dan ketidak sengajaan lainya...



Dan ini yang terbaru ketika gombalin dek Nabilah JKT48 seru banget..



Nah... kalian kepo sama video lainya ? mau bakar 150.00 kalori tanpa olah raga ? cukup Follow Instagram saya @jodybaharizki dan bisa juga @indovidgram untuk melancarkan program diet kalian.
Coba dan buktikan!
karena sesuatu yang belum dicoba tidak akan pernah terbukti. Terimakasih yang sudah follow dan like semoga diet anda bukan mitos, yang jomblo cepet dapet jodoh.


Wednesday, May 7, 2014
Posted by Jody Baharizki

5 Website Dengan Typography Menginspirasi

Sebuah website yang indah biasanya memiliki design grafis yang indah pula. Karena biasanya orang akan tertarik pada suatu website ketika pertama kali dia melihat website tersebut. Dan gambar adalah salah satu eye catching dalam sebuah website.

Tapi.... tunggu dulu, jangan kalian berpikir jika website berisi gambar tanpa disertai text yang menarik didalamnya akan aman-aman saja. Orang akan bingung mengenai informasi apa dalam website tersebut.

Disini akan kita berikan beberapa referensi website yang memiliki typography yang menarik untuk menunjang keindahan web.


1. Promethean




Promethean, sebuah website yang menggunakan carousel menu dengan pemilihan font ang menarik. Di website ini menggunakan  'Source Sans Pro',sans-serif    yang memberikan kesan elegan dengan font tipis seperti itu.


2. Purple Orange



Purple Orange merupakan website yang memiliki slogan "Brand Communications" dan slogan ini cocok dengan warna orange yang disuguhkan serta pemilihan fonts yang besar.

3. Mario Petrone



Mario Petrone, adalah seorang web designer yang memiliki website unik dengan macam-macam jenis font didalamnya. Sehingga pengunjung situs tersebut tidak mudah bosan.

4. Benoitchallands




Benoitchallands, merupakan website yang menampilkan kumpulan-kumpulan design grafis typografi 3D dari berbagai benda.

"Ben is a creative image maker focused on digital art, 3D illustration and typography. His work encompasses a large range of 3D field creation, design, CGI retouch and illustration."


5. Thingking of You




Thinking of you merupakan blog yang diperuntukan bagi pengguna suatu produk electronic untuk berbagi cerita mengenai pengalaman mereka menggunakan produk tersebut. Dari segi desain web ini menarik di perpaduan font dengan background blur.


Dan contoh diatas adalah sebagian kecil dari banyak website keren di dunia, seiring perkembangan jaman trend website berubah-ubah, so inovasi sangat mempengaruhi keindahan website kamu.

See you on next inspiration

@jodybaharizki
Wednesday, April 23, 2014
Posted by Jody Baharizki

Membuat Desain Web Di Photoshop

Web Desain tak pernah lepas dari seni. Dan banyak orang yang jago membuat sketch design tapi masih belum mengerti mengenai desain web di photoshop. Dalam web design, software paling mum untuk membuat desain web yaitu photoshop.

Bagi para master boleh ikut nyimak sekaligus memberi masukan-masukan dalam tutorial ini.
Dan langkah ini adalah experience saya dalam membuat web desain "Yearbook Online" yang bertujuan membuat buku kenangan SD/SMP/SMA secara online. Langsung saja kita mulai :

Apa saja yang harus dilakukan ?


1. sketch


Dalam sketch ini tumpahkan semua inspirasi yang akan menjadi bayangan website yang akan dibuat. Tanpa batas dan sekreatif mungkin. Sebelum masuk ke tahap photoshop.



2. Penerapan desain di photoshop

Buka photoshop kalian dan mulai buat ukuran yang di inginkan, disini kita akan membuat dalam ukuran maksimal 1900 x 1080 Pixel.

Garis biru adalah guide kita untuk menentukan posisi agar simetris. Dan hal yang tak kalah penting adalah membuat GROUP di layer kita.

GROUPS LAYER
Gambar diatas menunjukan bagian bagian penting dalam komponen desain web kita.
  • Navbar
  • Wellcome (home)
  • Class (pemilihan kelas)
  • Content (isi konten)
Pada folder navbar biatkan pada posisi visible karena sebagai header web.

Dan langkkah pertama kita membuat homepagenya, sebagai wellcome page harus terlihat menarik dan simple.


 Di homepage kita membuat 3 gambar yang di gunakan untuk slide. Dalam mendesain web tampilan slider juga harus diperliatkan gambar apa saja yang akan dimunculkan. Bagaimana caranya ? baca next step ya.

Oke, selanjutnya kita mendesain bagian class.


image normal 1.1


Di bagian Class ini kita harus membuat desain yang interaktif pada layer photoshop agar orang yang akan membuat coding mengerti maksud ketika gambar di hover ataupun di klik. Ataupun membuat slider, cara yang digunakan hampir sama dengan bagian ini, mudah kok begini contaohnya.


<< Layer ketika tampilan default.


Layer ketika on hover pada gambar >>


image hover 1.2
 Perhatikan image 1.1 dan 1.2 diatas. Terlihat perbedaaan ketika normal dan hover. Begitu juga dengan image lainya diberikan efek yang sama. Cara ini menggunakan visible dan disable di samping layer photoshop. dengan klik icon mata tsb maka kita bisa mengatur gambar mana yang terlihat dan gambar mana yang tidak terlihat. tinggal diatr saja posisi gambarnya dan tinggal klik icon mata tsb untuk mengubah tampilan efeknya.

Selanjutna memasuki step content
Kembali ke cara yang sama dengan step sebelumnya. Di page ini kita memberikan efek lightbox pada image gallery nya. ketika di klik pada gambar maka akan muncul tampilan lightboxnya seperti image 2.2.

Berikut penyusunan layer untuk clipping mask thumbnail.


<< Ketika gambar muncul




Ketika gambar kosong >>







Dan gambar diatas menunjukan ketika layer di on-off kan.


image 2.1

 Image thumbnail juga harus didesain dengan interaktif. Dengan menggunakan teknik clipping mask.
 memunculkan lighbox menggunakan folder baru bernama hover-image. jika lightbox off maka tinggal klik icon mata disamping layer folder tsb.



image 2.2

Gambar 2.2 hasil lightbox dari image thumbnail 1
untuk thumbnail 2,3,4... dan selanjutnya bisa menerapkan hal yang sama.

Dan oke itu tadi sedikit tutorial untuk membuat desain web di photoshop yang baik dan modern. Mendesain sebuah UI/UX Website itu tidak sembarang desain. Kita juga harus tahu seberapa komposisi jika web ini ditampilkan di layar. Maka dari itu perlu belajar antara desain dan coding meskipun tak mahir coding, tapi setidaknya mengerti dasarnya.


Apabila anda menginginkan source .PSD bisa menghubungi by email ya. 
atau disini juga bisa, FREE!




Tetap berkarya dan tetap original.




Tuesday, March 4, 2014
Posted by Jody Baharizki

jQuery Plugin Single Page Website


Single Page Website di tahun 2014 ini tampaknya semakin menarik. Selain simpel, single page website ini juga memberikan kemudahaan bagi user yang berkunjung. Tidak perlu banyak klik sana sini, tinggal scroll atas bawah informasi keseluruhan dari websiter tersebut bisa di dapat.

Responsive web design pun tidak ketinggalan di single page ini. Karena banyak juga user yang berkunjung tidak hanya dari PC. Tapi juga dari Gadget mereka (iphone, ipad, dll).

Para Web Designer pun terus berkarya memberikan inovasi terbaik untuk design single page ini, karena semakin hari semakin banyak portofolio yang muncul di internet.
Dan saya akan membeikan referensi plugin yang bisa digunakan untuk membuat website single page ini.

1. Full Page JS

fullpage.js
Dengan full page js, memudahkan kalian untuk membuat smooth scrolling. Tidak cuma scroll atas bawah tapi juga bisa untuk slide kanan kiri. Penasaran ? Cek disini.

2. One Page Scroll

One Page Scroll
One Page Scroll ini adalah scroll yang mirip dengan scroll yg ada di website apple. Di plugin ini kita cukup scroll mouse kita atau bisa juga dengan klik menu yg ada di sebelah kanan untuk pindah ke slide selanjutnya. So awesome. Cek disini.

3. jQuery Swctallax

jQuery Swctallax

jQuery Swctllax merupakan plugin single page yang menambahkan efek parallax background didalamnya. Tentunya design ini semakin elegan apabila dibuat untuk portofolio personal website. Cek disini.

4. Smooth Scroll

Smooth Scroll
Hampir sama dengan nomor 3. Smooth scroll juga menyediakan parallax background tapi ditambah dengan efek parallax di bagian imagenya sehingga lebih terlihat hidup website kalian. Cek disini.

5. Evanto


Evanto

Evanto juga memberikan efek scrilling dan parallax, dengan tambahan navigasi yang bisa kamu edit sesuai kebutuhan. Cek disini.


Demikianla plugin dari jQuery yang bisa jadi revisi kalian untuk membuat single page web design. Lebih lengkapnya cek disini Tetap berkarya dan berinovasi, ciptakan yang baru, dan kembangkan yang sudah ada. Salam !

jodybaharizki.com
@jodybaharizki

Tuesday, February 18, 2014
Posted by Jody Baharizki

6 Interactive Web Design Inspiration

Web Design merupakan akah dari tampilan sebuah website. Tanpa designsebuah website hanyalah tulisan dan gambar yang tertata seadanya tanpa sentuhan desain yang menarik. Apalagi kita tellah memasuki tahun 2014, yang mana tren web design sudah masuk ke era responsive web design.
Dan akhir-akhir ini tren lain seperti Full width design, Flat Design juga ikut meramaikan ditahun 2014.

Di postingan kali ini saya akan memberikan beberapa inspirasi web design untuk "Interactive Web Design"
Maksudnya adalah website yang di kontenya memberikan design dan fungsi yang bisa mengajak pengunjung website ikut merasakan ada didalamnya. Atau lebih gampangnya seperti kita bermain game.

Dalam Interactive web design juga bisa disebut parallax. Parallax menjadi tren baru untuk pecinta web design, kerena web tersebut tidak membuat bosan pengunjung. Setiap scroll akan ada tampilan visual yang berbeda-beda.

Berikut inspirasi web design beserta linknya :

1. Walking Dead


walking dead | blog jodybaharizki

Seperti namanya, website walking dead menampilan interactive web design dengan tokoh yang mati sambil berjalan. Dan di website itu kita bisa scroll-up untuk mengetahui jalan ceritanya. Mau coba ? klik disini

2. Source Sally


Source Sally | jodybaharizki

Source sally adalah website untuk restoran Yogurt "The Leader Frozen Yogurt in Indonesia". Dari design websitenya saja kita sudah bisa membayangkan betapa asyiknya jika mengunjungi langsung outlet mereka. Klik disini

3.  Flat vs Realism


jodybaharizki.com

 Flat vs Realism, Website yang menggambarkan tren website tahun 2013. Terjadinya transisi dari design Realism ke Flat Design. Pasti kita banyak menemukan website yang mulai merubah gaya websitenya. Ikuti ceritanya, klik disini

4.  Nissan Japan


Nissan Japan | Jodybaharizki

 Website Nissan Japan ini sangat interaktif dan design web nya pun tidak biasa, seperti menampilkan beberapa frame dengan gambar yang berbeda memeberikan kesan kita melihat foto yang berjalan. Penasaran ? klik disini

5. Hoblaa



hoblaa | jodybaharizki

Hoblaa Website edukasi untuk anak, dengan design yang sesuai tema dan website ini asli buatan anak indonesia. Dan pastinya bisa dijadikan inspirasi yang tak kalah bagus dengan website website keren di dunia. klik disini

6. Cross : Cross Coffe Cup


jodybaharizki


Coffe lovers kayanya harus mampir ke web yang satu ini. Kalian diajak untuk mendesign cup of coffe langsung di website tersebut, mau coba ? klik disini


Nah, dari inspirasi diatas web manakah yang paling anda minati ? minimal kesan pertama saat anda membuka website tersebut. Karena bagus tidaknya suatu website adalah ketika respon pertama saat membuka, dia bilang "wah, wow, wih, dll".
So, mana website kamu ? yuk terus belajar dan membuat tren baru untuk masa mendatang. Tentunya dimulai detik ini juga. 
Thursday, February 6, 2014
Posted by Jody Baharizki

Menambah User Di Wordpress

Kembali lagi di postingan saya tentang wordpress. Dan kita akan membahas tentang bagaimana cara menambah user serta memberikan hak akses untuk masing masing user yang kita tambahkan di wordpress.



Menambah user memiliki berbagai tujuan. Di Wordpress hak akses user terbagi menjadi 5 :

1. Subscriber


Subscriber adalah hak akses paling minim, user ini hanya bisa membaca dan mengomentari postingan yang ada di blog.


2. Contibutor


Contributor memiliki hak satu tingkat lebih dari subscriber. Selain bisa membaca dan memberikan komentar di postingan, user ini bisa menulis konten di blog. Tapi tidak bisa upload file dan mempublikasikan postingan tersebut, hanya di draft untuk kemudian hak akses yang lebih tinggi yang berhak posting.

3. Author


Author memiliki hak yang lebih lagi daripada contributor. User ini bisa upload file di library dan bisa langsung publish hasil postingan yang dibuat tanpa menunggu di publish oleh editor atau admin. Tapi author hanya bisa melhat postingan dirinya sendiri di draft.

4. Editor


Editor berada satu tingkat dibawah admin, yang tentunya memiliki hak akses yang lumayan banyak. User ini bisa melihat seluruh komentar, postingan orang lain, merubah postingan orang lain, upload di library.

5. Admin


Admin adalah user yang memiliki hak akses full di halaman admin. User ini bisa melakukan segala pongaturan mulai tema, posting, komentar, plugin, widget, dan seluruh isi website ada di kendali admin.


Nah, Dari penjelasan diatas apakah anda bisa membuat user di wordpress ?
Jika belum mari kita ikuti step step dibawah ini :


1. Masuk ke halaman admin wordpress kamu


Kemudian masuk ke menu user
Pilih add new














 
Setelah itu isikan data lengkap untuk user yang akan dibuat. Di field Role  pilih jenuis user sesuai kebutuhan admin, editor, author, contributor, atau subscriber. Setelah itu klik add new user





Setelah oke coba login menggunakan user yang kamu buat tadi. Dan lihat hak akses apa saja yang bisa dilakukan masing masing user tersebut.
Selamat mencoba dan selamat ber eksperimen, semoga bermanfaat.

@jodybaharizki







Monday, January 27, 2014
Posted by Jody Baharizki
Tag :

Cara Membuat Long Shadow di Photoshop

jodybaharizki logo
Berbicara design memang gak ada matinya. Apalagi seiring pergantian tahun, pergantian tren design  pun juga berubah. Flat UI. Ada yang pernah mendengar ? mungkin anda bisa membaca artikel seputar Flat UI ini disini.
Contoh nyata adalah buat kamu yang menggunakan iOS pada product apple. iOS 7 memberikan tampilan Flat UI yang sangat elegan.

Secara visual tampilan seperti ini sepele tapi kesan yang ditimbulkan sangat elegant. Terbukti dengan semakin tingginya minat para web designer / graphic designer untuk mengembangkan design ini.






Nah disini saya akan memberikan sedikit tutorial membuat logo flat beserta long shadow.



Langkah pertama buka photoshop anda kemudian File -> New
Pilih ukuran sesuai selera anda. saya menggunakan 500px X 400px. Kemudian akan nampak seperti gambar.


Buatlah Rounded Rectangle Tool dengan ukuran persegi. klik + shift kemudian drag sesuai ukuran yang anda inginkan. (perhatikan tanda biru)



Kemudian ketikan huruf / nama / gambar terserah anda untuk dijadikan icon flat. Disini saya menggunakan huruf J dan B.

Lalu tambahkan layer baru dengan background warna cerah. Agar shadow yang dihasilkan nanti bisa terlihat. Selanjutnya mulai membuat shadow untuk frame luar (merah) terlebih dahulu. Caranya, klik rectangle tool, kemudian buat persegi yang ukuranya lebih besar dari persegi warna merah.


Kemudian putar persegi tersebut 45' agar berbentuk ketupat lalu drag sesuaikan seperti gambar diatas. Jangan lupa pada kolom fill berikan nilai 0%. Kemudian klik layer 2 kali, maka akan masuk ke Layer Style.


pilih sesuai gambar diatas sama persis, kemudian klik OK.
maka kita akan melihat tampilan long shadow pada frame kita.


Langkah selanjutnya adalah membuat long shadow pada tulisan didalamnya. Caranya mudah, buat New Layer, silahkan pilih Polygonal Lasso Tool. Kemudian seleksi tulisan tersebut dengan teliti. Pastikan tidak ada yang kelewatan dalam memberikan titik-titik untuk dijadikan shadow. Setelah terseleksi semua beri warna hitam pada hasil seleksi anda tadi menggunakan terseleksimenggunakan Paint Bucket Tool. Setelah oke kemudian klik layer 2 kali dan masuk ke Layer Style seperti sebelumnya dengan settingan yang sama.


Kemudian klik OK, dan tampilan pun seperti gambar dibawah ini.


Gimana ? mudah kan ? anda juga bisa berkreasi dengan bayangan bayangan warna lain terus kembangkan kemampuan kita agar kita juga ikut berpartisipasi dalam tren User Interface ini.
Ada pertanyaan silahkan komen dibawah. See you next tutorial.

@jodybaharizki






Tuesday, January 7, 2014
Posted by Jody Baharizki
Tag :

Psang Iklan?

Psang Iklan?
Klik gambar diatas

Like Us!

Youtube

\
\

Labels

Powered by Blogger.

Total Pageviews

- Copyright © 2016 Jody Baharizki -@jodybaharizki- Powered by Blogger -