Desain Komunikasi Visual

Desain Komunikasi Visual

A.   Sejarah dan pengertian Desain Komunikasi Visual

Desain komunikasi visual atau lebih dikenal di kalangan civitas akademik di Indonesia dengan singkatan DKV pada dasarnya merupakan istilah penggambaran untuk proses pengolahan media dalam berkomunikasi mengenai pengungkapan ide atau penyampaian informasi yang bisa terbaca atau terlihat. Desain Komunikasi Visual erat kaitannya dengan penggunaan tanda-tanda (signs), gambar (drawing), lambang dan simbol, ilmu dalam penulisan huruf (tipografi), ilustrasi dan warna yang kesemuanya berkaitan dengan indera penglihatan.

B.   Sejarah Komunikasi Visual

Sejak jaman pra-sejarah manusia telah mengenal dan mempraktekkan komunikasi visual. Bentuk komunikasi visual pada jaman ini antara lain adalah piktogram yang digunakan untuk menceritakan kejadian sehari-hari pada Jaman Gua (Cave Age), bentuk lain adalah hieroglyphics yang digunakan oleh bangsa Mesir. Kemudian seiring dengan kemajuan jaman dan keahlian manusia, bentuk-bentuk ini beralih ke tulisan, contohnya prasasti, buku, dan lain-lain. Dengan perkembangan kreatifitas manusia, bentuk tulisan ini berkembang lagi menjadi bentuk-bentuk yang lebih menarik dan komunikatif, contohnya seni panggung dan drama; seperti sendratari Ramayana, seni pewayangan yang masih menjadi alat komunikasi yang sangat efektif hingga sekarang.

a.      Desain Komunikasi Visual dan Seni Murni

Desain Komunikasi Visual bukan seni murni. Seorang seniman pada bidang seni murni terkadang mempunyai penonton atau pengamat hanya satu (seniman itu sendiri), dimana karya seni tersebut merupakan ekspresi emosi dan perasaan dari seniman itu sendiri yang pada akhirnya bertujuan untuk memuaskan diri seniman tersebut. Sedangkan seorang desainer komunikasi visual menghadapi lebih dari satu pengamat yang kadangkala bisa mencapai jutaan orang, dimana desainer itu harus dapat memahami dan menginterpretasikan permintaan seseorang atau sekelompok orang ke dalam suatu karya desain yang pada akhirnya bertujuan untuk memuaskan orang atau sekelompok orang itu.

b.      Desain Komunikasi Visual sebagai sarana identifikasi

Fungsi dasar yang utama dari desain komunikasi visual adalah sebagai sarana identifikasi. Identitas seseorang dapat mengatakan tentang siapa orang itu, atau dari mana asalnya. Demikian juga dengan suatu benda atau produk, jika mempunyai identitas akan dapat mencerminkan kualitas produk itu dan mudah dikenali, baik oleh produsennya maupun konsumennya. Kita akan lebih mudah membeli minyak goreng dengan menyebutkan merek X ukuran Y liter daripada hanya mengatakan membeli minyak goreng saja. Atau kita akan membeli minyak goreng merek X karena logonya berkesan bening, bersih, dan “sehat”.

c.       Desain Komunikasi Visual sebagai sarana informasi dan instruksi

Sebagai sarana informasi dan instruksi, desain komunikasi visual bertujuan menunjukkan hubungan antara suatu hal dengan hal yang lain dalam petunjuk, arah, posisi dan skala; contohnya peta, diagram, simbol dan penunjuk arah. Informasi akan berguna apabila dikomunikasikan kepada orang yang tepat, pada waktu dan tempat yang tepat, dalam bentuk yang dapat dimengerti, dan dipresentasikan secara logis dan konsisten. Simbol-simbol yang kita jumpai sehari-hari seperti tanda dan rambu lalu lintas, simbol-simbol di tempat-tempat umum seperti telepon umum, toilet, restoran dan lain-lain harus bersifat informatif dan komunikatif, dapat dibaca dan dimengerti oleh orang dari berbagai latar belakang dan kalangan. Inilah sekali lagi salah satu alasan mengapa desain komunikasi visual harus bersifat universal.

d.      Desain Komunikasi Visual sebagai sarana presentasi dan promosi

Tujuan dari desain komunikasi visual sebagai sarana presentasi dan promosi adalah untuk menyampaikan pesan, mendapatkan perhatian (atensi) dari mata (secara visual) dan membuat pesan tersebut dapat diingat; contohnya poster. Penggunaan gambar dan kata-kata yang diperlukan sangat sedikit, mempunyai satu makna dan mengesankan. Umumnya, untuk mencapai tujuan ini, maka gambar dan kata-kata yang digunakan bersifat persuasif dan menarik, karena tujuan akhirnya adalah menjual suatu produk atau jasa.

C.      Perbedaan Desain Komunikasi Visual dengan Seni Murni

    Desain Komunikasi Visual seperti yang sudah dijelaskan pada sub materi diatas memiliki perbedaan dengan Seni Murni, dimaa Seni murni merupakan ekspresi jiwa yang bersifat individual, subjektif, dan lebih ditujukan kepada kepuasan terhadap karya, bukan terhadap fungsi.

Hal itu lah yang membuat desain komunikasi visual berbeda dengan seni murni. Sebuah karya seni lebih bersifat ekspresif dan tidak punya tujuan secara umum. Seni bersifat individual dan berorientasi kepada ekspresi dan kepuasan dari pembuatnya (seniman). Sedangkan desain grafis berorientasi kepada kegunaan atau fungsinya. Desain grafis yang baik akan dilihat dari seberapa besar impact dari karya yang dihasilkannya.

     Sebagai contoh, bandingkan sebuah lukisan dengan sebuah poster. Lukisan tidak mengajak siapapun untuk melakukan apapun. Lukisan hanya menggambarkan sesuatu yang bisa dinilai bebas dari berbagai sudut pandang. Namun berbeda dengan poster. Poster ditujukan untuk menyampaikan suatu pesan kepada massa. Dan tingkat keberhasilannya pun dilihat dari seberapa baik massa terpengaruh dengan poster tersebut.

      Dapat ditarik kesimpulan bahwa desain komunikasi visual dan seni murni adalah suatu hal yang berbeda. Desain komunikasi visual adalah seni yang digunakan untuk berkomunikasi dengan orang banyak dalam bentuk tampilan visual. Sedang seni murni adalah ekspresi jiwa yang bersifat individual, subjektif, dan lebih ditujukan kepada kepuasan terhadap karya, bukan terhadap fungsi.

D.     Elemen - elemen Desain Komunikasi Visual

     Elemen-elemen desain komunikasi visual Menurut Christine Suharto Cenadi sendiri pada (1999:5) mengatakan bahwa Elemen-elemen yang trdapat pada desain komunikasi visual terdiri dari 7 Elemen di antaranya ialah: Layout, Tipografi, Ilustrasi, Simbolisme, Warna, Animasi, Suara. Elemen-elemen ini juga bisa berkembangan  dengan penggunaan suatu media dan perkembangan di jaman teknologi,

Berikut Elemen-elemennya:

1.      Layout (Tata Letak Perwajahan)

2.      Tipografi

3.       Ilustrasi

4.      Simbolisme

5.      Warna

6.      Animasi

7.      Suara

Sumber :

https://usm.itb.ac.id/Prodi/174.html

http://e-journal.uajy.ac.id/7103/3/2TA13262.pdf

http://www.menggaliilmu.com/2016/12/7-macam-elemen-desain-komunikasi.html

Pengaruh Teknologi terhadap perkembangan grafis dan permodelan yang ada serta Pengaruh Grafis terhadap perubahan teknologi

A. Perkembangan Desain Grafis di Berbagai Media

     Desain grafis pada awalnya hanya terbatas pada media cetak (dua dimensi). Tapi, perkembangannya hingga saat ini semakin tidak terbendung, bahkan sampai merambah ke dunia multimedia (diantaranya audio dan video). Desain grafis diterapkan dalam media eletronik, yang sering kali disebut sebagai desain interaktif atau desain multimedia. Desain grafis bisa diterapkan menjadi sebuah desain lingkungan yang mencakup pengolahan ruang.

     Pada pertengahan 1980, kedatangan desktop publishing serta pengenalan jumlah aplikasi perangkat lunak grafis memperkenalkan satu generasi desainer pada manipulasi gambar dengan komputer dan penciptan gambar 3 dimensi yang sebelumnya merupakan kerja yang susah payah. Pada umumnya komputer dianggap sebagai alat yang sangat diperlukan dalam industri desain garfis. Akan tetapi, beberapa perancang grafis melanjutkan penggunaan alat manual dan tradisional dalam berkarya, seperti Milton Glasser. Beberapa software dalam desain grafis :

1. Adobe Photoshop;
2. Adobe Illustrator;
3. Adobe After Effect;
4. CorelDraw;
5. Macromedia Freehand;
6. Dll.

     Dalam hal ini, untuk menghasilkan suatu gambar yang mempunyai nilai seni tinggi tidak sekedar pengguasaan software itu sendiri tetapi lebih cenderung kepada seni dan kreatifitas serta imajinasi dalam menuangkan ke dalam gambar tersebut.

B. Pengaruh kebudayaan dan teknologi dalam membuat Desain Pemodelan Grafis

Ada banyak cara untuk Desainer menyampaikan arti dan informasi dalam desain grafis diantaranya adalah melalui budaya atau adat – adat setempat, dikarenakan budaya – budaya setempat mempunyai banyak nilai – nilai, sejarah, dan bahasa yang dapat diambil manfaatnya, seperti pengunaan simbol atau tokoh pahlawan nasional.Teknologi pun juga berperan penting dalam membuat desain pemodelan grafis dan dapat mempengaruhi bagaimana desain tersebut diproduksi dan teknologi yang lebih maju dapat mempercepat dan mempermudah kita untuk membuat desain pemodelan grafis dan teknologi menawarkan desainer berbagai media yang ada untuk mengerjakan proyek – proyek mereka salah satu contohnya seperti software.

C. Desain Pemodelan Grafis dari segi Interaksi Manusia dan Komputer

Interaksi manusia dan komputer (bahasa Inggris: human–computer interaction, HCI) adalah disiplin ilmu yang mempelajari hubungan antara manusia dan komputer yang meliputi perancangan, evaluasi, dan implementasi antarmuka pengguna komputer agar mudah digunakan oleh manusia dan Ilmu ini berusaha menemukan cara yang paling efisien untuk merancang pesan elektronik. Sedangkan interaksi manusia dan komputer sendiri adalah serangkaian proses, dialog dan kegiatan yang dilakukan oleh manusia untuk berinteraksi dengan komputer yang keduanya saling memberikan masukan dan umpan balik melalui sebuah antarmuka untuk memperoleh hasil akhir yang diharapkan.

desain pemodelan grafis sangat dibutuhkan dalam interaksi antara manusia dengan komputer, dengan menggunakan visual interaksi orang awam pun dapat dengan mudah mengoperasikan sistem komputer tersebut.

     Metode yang dapat digunakan untuk proses interaksi antara manusia dan komputer adalah:

 

 1.  Ergonomik

     Aspek fisik yang mendukung dalam menciptakan lingkungan kerja yang nyaman. Karena manusia bekerja didepan komputer memerlukan waktu yang lama. Misal : keyboard, mouse, posisi duduk, dll.

 

2. Sosiologi

     Pengaruh interaksi manusia dan komputer dengan aspek sosial masyarakat.

 

3. Kecerdasan Buatan

     Bertujuan agar komputer dapat melakukan pekerjaan sebaik yang dilakukan manusia. Faktor ini berperan penting untuk menciptakan suatu sistem yang handal, canggih dan meyerupai pola pikir manusia.

 

4. Multimedia

     Sarana dialog yang sangat efektif antara manusia dan komputer. dengan adanya multimedia, tampilan suatu sistem yang dibuat akan lebih menarik dan lebih mudah dimengerti oleh manusia.

 

Sumber :

https://id.wikipedia.org/wiki/Teknologi

https://id.wikipedia.org/wiki/Interaksi_manusia-komputer

http://aliffathurr.blogspot.co.id/2017/09/pengaruh-teknologi-terhadap_65.html?view=timeslide

http://fastilistia.blogspot.co.id/2015/11/pengaruh-teknologi-terhadap.html

http://lolololzzz.blogspot.co.id/

 

 

KONSEP PEMODELAN DESAIN GRAFIK

1.             Pengertian Desan dan Pemodelan Grafik

·                     Desain

Desain diterjemahkan sebagai seni terapan, arsitektur, dan berbagai pencapaian kreatif lainnya. Dalam sebuah kalimat, kata “desain” bisa digunakan baik sebagai kata benda maupun kata kerja. Sebagai kata kerja, “desain” memiliki arti proses untuk membuat dan menciptakan obyek baru. Sebagai kata benda, “desain” digunakan untuk menyebut hasil akhir dari sebuah proses kreatif, baik itu berwujud sebuah rencana, proposal, atau berbentuk obyek nyata.

·                      Pemodelan 

Model adalah rencana, representasi, atau deskripsi yang menjelaskan suatu objek, sistem, atau konsep, yang seringkali berupa penyederhanaan atau idealisasi. Bentuknya dapat berupa model fisik (maket, bentuk prototipe), model citra (gambar rancangan, citra komputer), atau rumusan matematis.

·                     Grafik (Grafis)

Grafik atau Grafis identik dengan suatu garis, titik, tanda, dan bentuk huruf. Grafik merupakan cara membentuk bentuk huruf, tanda serta gambar menggunakan proses pencetakan. Grafik juga didefinisikan sebagai suatu pembuatan, penyimpanan serta manipulasi model dan citra. 

Desain dan Pemodelan Grafik adalah suatu proses menciptakan objek berupa citra (gambar rancangan, citra komputer) yang dibuat untuk informasi, ilustrasi, atau hiburan yang dibuat melalui aplikasi komputer.

  

   2.  Prinsip dan Unsur Desain Grafik

Prinsip Desain Grafik

·                     Keseimbangan

Keseimbangan adalah keadaan atau kesamaan antara kekuatan yang saling berhadapan dan menimbulkan adanya kesan seimbang secara visual. Ada dua pendekatan dasar untuk menyeimbangkan. Yang pertama adalah keseimbangan simetris yang merupakan susunan dari elemen agar merata ke kiri dan ke kanan dari pusat/tengah. Yang kedua adalah keseimbangan asimetris yang merupakan pengaturan yang berbeda agar dua sisi memiliki bobot visual yang sama. Warna, nilai, ukuran, bentuk, dan tekstur dapat digunakan sebagai unsur penyeimbang. 

·                     Kesatuan

Kesatuan adalah kohesi, konsistensi, ketunggalan atau keutuhan, yang merupakan isi pokok dari komposisi. contohnya adalah ilustrasi, garis dan teks diberi raster sehingga memberikan kesan kesatuan terhadap pesan yang dimaksud. Disini dibutuhkan penyatuan semua elemen agar terlihat serasi. Menyatukan elemen dengan mengelompokkan elemen-elemen tersebut. Ulangi warna, bentuk, dan tekstur. Gunakan grid (struktur yang mendasari halaman) untuk membangun kerangka kerja untuk margin, kolom, jarak, dan proporsi. 

·                     Penekanan  

Penekanan dimaksudkan untuk menarik perhatian pembaca, sehingga ia mau melihat dan membaca bagian desain yang dimaksud. Kalau dalam konteks desain surat kabar ini bisa dilakukan dengan memberikan kotak raster atas sebuah berita. hal ini akan mengesankan pentingnya berita itu untuk dibaca oleh pembaca. atau juga membesarkan ukuran huruf pada judul berita, sehingga terlihat jauh berbeda dengan berita lainnya. Penekanan juga dilakukan melalui perulangan ukuran, serta kontras antara tekstur, nada warna, garis, ruang, bentuk atau motif.

  

·                      Ritme 

Ritme atau irama adalah pola yang dibuat oleh elemen-elemen secara berulang dan bervariasi. Pengulangan (mengulangi unsur serupa secara yang konsisten) dan variasi (perubahan dalam bentuk, ukuran, posisi atau elemen) adalah kunci untuk ritme visual.

Unsur Desain Grafik

o             Warna (Color)

Warna merupakan unsur penting dalam obyek desain. Karena dengan warna orang bisa menampilkan identitas, menyampaikan pesan atau membedakan sifat dari bentuk-bentuk bentuk visual secara jelas.

o                  Ukuran (Size)

Ukuran adalah unsur lain dalam desain yang mendefinisikan besar kecilnya suatu obyek. Dengan menggunakan unsur ini Anda dapat menciptakan kontras dan penekanan (emphasis) pada obyek desain anda sehingga orang akan tahu mana yang akan dilihat atau dibaca terlebih dahulu.

  

o                   Ruang(space)

Ruang merupakan jarak antara suatu bentuk dengan bentuk lainnya, pada praktek desain dapat dijadikan unsur untuk memberi efek estetika desain dan dinamika desain grafis. Sebagai contoh, tanpa ruang Anda tidak akan tahu mana kata dan mana kalimat atau paragraf. Tanpa ruang Anda tidak tahu mana yang harus dilihat terlebih dahulu, kapan harus membaca dan kapan harus berhenti sebentar. Dalam bentuk fisiknya pengidentifikasian ruang digolongkan menjadi dua unsur, yaitu obyek (figure) dan latar belakang (background).

o                  Garis (Line)

Sebuah garis adalah unsur desain yang menghubungkan antara satu titik poin dengan titik poin yang lain sehingga bisa berbentuk gambar garis lengkung (curve) atau lurus (straight). Garis adalah unsur dasar untuk membangun bentuk atau konstruksi desain. Di dalam dunia komunikasi visual seringkali kita menggunakan dotted line, solid line, dan garis putus-putus.

o                  Bentuk (Shape) 

     

Bentuk adalah segala hal yang memiliki diameter tinggi dan lebar. Bentuk dasar yang dikenal orang adalah kotak (rectangle), lingkaran (circle), dan segitiga (triangle). Pada desain komunikasi visual kita akan mempelajari betuk dasar dan bentuk turunan. Sementara pada kategori sifatnya, bentuk dapat dikategorikan menjadi tiga, yaitu:

Huruf (Character) adalah suatu hal yang direpresentasikan dalam bentuk visual yang dapat digunakan untuk membentuk tulisan sebagai wakil dari bahasa verbal dengan bentuk visual langsung, seperti A, B, C, dan seterusnya.

Simbol (Symbol) adalah suatu hal yang direpresentasikan dalam bentuk visual yang mewakili bentuk benda secara sederhana dan dapat dipahami secara umum sebagai simbol atau lambang untuk menggambarkan suatu bentuk benda nyata, misalnya gambar orang, bintang, matahari dalam bentuk sederhana (simbol), bukan dalam bentuk nyata (dengan detail).

Bentuk Nyata (Form) adalah bentuk yang mencerminkan kondisi fisik dari suatu obyek. Seperti gambar manusia secara detil, hewan atau benda lainnya.

o                  Tekstur (Texture) 

Tekstur adalah tampilan permukaan (corak) dari suatu benda yang dapat dinilai dengan cara dilihat atau diraba. Yang pada prakteknya, tekstur sering dikategorikan sebagai corakdari suatu permukaan benda, misalnya permukaan karpet, baju, kulit kayu, cat dinding, cat canvas, dan lain sebagainya.

o                  Ukuran(size) 

Ukuran adalah unsur lain dalam desain yang mendefinisikan besar kecilnya suatu obyek. Dengan menggunakan unsur ini Anda dapat menciptakan kontras dan penekanan (emphasis) pada obyek desain anda sehingga orang akan tahu mana yang akan dilihat atau dibaca terlebih dahulu. 

3. Beberapa software dalam desain grafis

 Adobe Photoshop

Kelebihan Adobe Photoshop :

• Gambar yang dihasilkan lebih memuaskan.                                    
• Mudah di operasikan.
• Banyak sekali fitur – fitur yang unggul.
• Penyimpanan dapat menggunakan berbagai format. Format penyimpanan tidak sekedar PSD, namun JPEG dan yang lainnya.
• Photoshop lebih cepat kerjanya.
•  

Kekurangan Adobe Photoshop :

• Banyaknya layer yang di gunakan. Kebanyakan orang sering bingung dengan banyaknya layer yang digunakan saat mengedit foto/ yang lainnya di Photoshop
• Saat digunakan untuk pembuatan majalah dan brosur. Photoshop kurang baik saat digunakan untuk pembuatan majalah dan brosur karena tidak bisa sempurna saat pembuatan paragraf.
• Ukuran yang di butuhkan terlalu besar. Nah jika kita terlalu banyak menggunakan layer maka ukuran di Photoshop akan besar.
• Kertas cetak. Saat akan mencetak hasil Photoshop kertas yang digunakan relatif sulit.

 Coreldraw

Keunggulan dari Coreldraw       

·         Gambar berbasis vektor adalah ukuran hasil akhir yang dapat ditekan seminimal mungkin namun dengan kualitas yang tidak kalah dengan gambar berbasis raster atau bitmap. Karena itulah desain grafis dan olah gambar berbasis vektor sangat banyak digunakan untuk desktop publishing, percetakan, dan bidang lain yang memerlukan pemrosesan visual.

·       Selain karena tampilannya yang user friendly dan mudah dipelajari

·       Coreldraw sangat bagus dalam kolaborasi teks dan gambar. Meskipun photoshop juga bisa namun lebih mudah dengan coreldraw.

·       Dukungan forum dan komunitas coreldraw yang begitu banyak dan beragam, sehingga kita bisa dengan mudah menemukan tutorial, tips dan bisa berbagi ilmu dengan pengguna coreldraw lainnya di seluruh dunia.
 

 Kekurangan dari coreldraw :

·        Memakan memori dan resource lain yang sangat besar apalagi bila gambar yang sedang dibuat mempunyai detail yang banyak. Pada PC yang low end penggunaan CDR sering menimbulkan pesan ‘crash’ pada system bahkan dalam proses effect bevel/emboss dalam PC yang bagus pun dapattimbul ‘hang’.

·         Besar file yang dibuat membengkak

·        Warna yang dicetak tidak akurat (tidak sesuai dengan tampilan layar) pada beberapa jenis printer

·        Dalam pembuatan objek table tidak semudah membuat table dalam MS Word. Yaitu dengancara yang sangat manual

·        Apabila ada penggabungan objek vector dan photo/bitmap kualitas cetakannya kurang memuaskan, misalnya membuat cover buku yang terdapat objek text dan photo.

·       Kompatibilitas versi CorelDraw banyak kendala dalam sharing keversilainnya.

Adobe Ilustrator

Kelebihan Adobe Illustrator  :

• Toolbar yg disediakan cukup Komplit
• Proses lebih ringan dan lebih cepat
• Adobe Illustrator   kompatibel dengan bermacam software lain untuk berbagai kepentingan akhir, seperti kepentingan cetak, desktop publishing, web publishing dan lain-lain.
• Adobe Illustrator  sangat mumpuni dalam menangani beragam pekerjaan desain dari yang sifatnya sederhana hingga amat kompleks, serta mampu mengekspor hasil akhir sebuah desain ke dalam berbagai format sesuai kebutuhan Anda dengan kualitas yang bisa diandalkan.

Kekurangan Adobe Illustrator:

·                                             Walaupun fitur lengkap tapi cukup ribet untuk pengerjaan layout.

·                                             Tidak User friendly untuk fitur power clip-nya

·                                             Tempat produksi terkadang ada yang ngga support

Sumber :

http://www.academia.edu/11097842/DESAIN_PEMODELAN_GRAFIS

https://mxac.wordpress.com/2016/10/06/pengertian-desain-dan-pemodelan-grafik/

https://ezadityo.wordpress.com/2016/10/23/pengertian-desain-dan-pemodelan-grafik/

http://kelasdesain.com/keunggulan-dan-kelemahan-photoshop/

http://digitalsolution.co.id/10-kelebihan-dan-kekurangan-corel-draw/

http://devina2.blogspot.com/2015/01/kekurangan-dan-kelebihan.html

http://ngestalk-ilmukomputer.blogspot.com/2015/12/kelebuhan-dan-kekurangan-adobe.html

Algoritma,Flowchart dan Program HTML Sederhana

Apa itu Algoritma.?

Secara ilmu komputer, algoritme adalah prosedur langkah-demi-langkah untuk penghitungan. Algoritme digunakan untuk penghitungan, pemrosesan data, dan penalaran otomatis.

contoh algoritma

·         Start

·         Menampilkan Tampilan Utama

·         if pilih = Home then

·         kembali ke Tampilan Utama

·         else if pilih = Biodata then

·         Menuju ke Tampilan Biodata

·         else if pilih = R.P(Riwayat Pendidikan) then

·         Menuju ke Tampilan Riwayat Pendidikan

·          else

·         End

·         end if

Flowchart.?

Program flowchart adalah suatu bagan dengan simbol-simbol tertentu yang menggambarkan urutan proses secara mendetail dan hubungan antara suatu proses (instruksi) dengan proses lainya dalam suatu program(Widia,1983:4).

Contoh flowchart

Source code.?

Dalam ilmu komputer source code (source) adalah kumpulan pernyataan atau deklarasi bahasa pemprograman komputer yang di tulis dan dapat di baca manusia source code memungkinkan programmer untuk berkomunikasi dengan komputer menggunakan  beberapa perintah yang telah di definisi

Contoh source code HTML

<!DOCTYPE html>

<html>

                <head>

                                <title>TUGAS PERTAMA</title>

                                <style type="text/css">

                                                header, section, footer, aside, nav, article, figure, figcaption {

                                                                display: block;}

                                                body {

                                                                color: green;

                                                                background-color: black;

                                                                background-position: center;

                                                                font-family: Georgia, Times, serif;

                                                                line-height: 1.4em;

                                                                margin: 0px;}

                                                .wrapper {

                                                                width: 870px;

                                                                margin: 20px auto 20px auto;

                                                                border: 10px solid grey;

                                                                background-color: white;}

                                                header {

                                                                height: 150px;

                                                                background-image: url("images/header.png");}

                                                h1 {

                                                                text-indent: -9999px;

                                                                width: 100px;

                                                                height: 130px;

                                                                margin: 0px;

                                                                text-align: center;}

                                                nav, footer {

                                                                clear: both;

                                                                color: #ffffff;

                                                                background-color: #aeaca8;

                                                                height: 20px;}

                                                nav ul {

                                                                margin: 0px;

                                                                padding: 5px 0px 5px 30px;}

                                                nav li {

                                                                display: inline;

                                                                margin-right: 40px;}

                                                nav li a {

                                                                color: #ffffff;}

                                                nav li a:hover, nav li a.current {

                                                                color: #000000;

                                                                text-align: center;}

                                                section.courses {

                                                                float: left;

                                                                width: 300px;

                                                                border-right: 15px solid #eeeeee;}

                                                article {

                                                                clear: both;

                                                                overflow: auto;

                                                                width: 100%;

                                                                text-align: center;}

                                                hgroup {

                                                                margin-top: 0px;

                                                                text-align: center;}

                                                figure {

                                                                float: center;

                                                                width: 229px;

                                                                height: 242px;

                                                                padding: 2px;

                                                                margin: 40px;

                                                                border: 1px solid #eeeeee;}

                                                figcaption {

                                                                font-size: 50%;

                                                                text-align: center;}

                                </style>

                                <!--[if lt IE 9]>

                                <script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>

                                <![endif]-->

                </head>

                <body>

                                <div class="wrapper">

                                                <header>

                                                                <h1>BIODATA</h1>

                                                                <nav>

                                                                                <ul>

                                                                                                <li><a href="" class="current">Beranda</a></li>

                                                                                                <li><a href="">Profil</a></li>

                                                                                </ul>

                                                                </nav>

                                                </header>

                                                <section class="courses">

                                                                                <figure>

                                                                                                <img src="images/y.png" alt="ady" />

                                                                                                <figcaption>adi inraguna</figcaption>

                                                                                </figure>

                                                                <article>

                                                                                <hgroup>

                                                                                                <h2>PROFIL DIRI</h2>

                                                                                </hgroup>

                                                                                <p>NAMA                            : ADI INDRAGUNA</p>

                                                                                <P>TTG                 : JAKARTA,16 FEBRUARI 1998</P>

                                                                                <P>AGAMA         : ISLAM</P>

                                                                                <p>WARGA NEGARA      : INDONESIA</p>

                                                                                <p>                         </p>

                                                                                <p>                         </p>

                                                                                <hgroup>

                                                                                <h2>KONTAK</h2>

                                                                                </hgroup>

                                                                                <p>RUMAH   : BEKASI BARAT</P>

                                                                                <p>EMAIL           : adindraguna16@gmail.com</p>

                                                                                <p>telpon              :089504502362</p>

                                                                                <p>instagram       :@indragunadi</p>

                                                                </article>   

                                                </section>

                                                <aside>

                                                <hgroup>

                                                                                <h2>RIWAYAT BELAJAR</h2>

                                                </hgroup>

                                                                                <p>1.  SDN 01 Malangbong (2010)</P>

                                                                                <p>2.  SMPN 01 Malangbong (2013)</p>

                                                                                <p>3.  SMAN 09 Garut (2016)</p>

                                                                                <p>4.  UNIVERSITAS GUNADARMA</p>

                                                <hgroup>

                                                                                <h2>PENGALAMAN BEKERJA</h2>

                                                </hgroup>

                                                                                <p>Kantor 1 : notaris CV. NATIONAL ELETRONIK SERVICE</P>

                                                                                <p>Kantor 2 : notaris CV. IWUNG LIGAR</p>

                                                <hgroup>

                                                                                <h2>HOBI</h2>

                                                </hgroup>

                                                                                <p>Futsal</P>

                                                                                <p>Renang</p>

                                                                                <p>Olahraga</p>

                                                </aside>

                                                <footer>

                                                                &copy; ADI INDRAGUNA

                                                </footer>

                                </div><!-- .wrapper -->

                </body>

</html>

Berikut adalah hasil dari source code tersebut adalah

·         Untuk hasil dari header nya adalah

·         Dan penyimpanan artikel

Referensi :
http://umardanny.com/contoh-flowchart-program-sistem-pakar/

https://id.wikipedia.org/wiki/Algoritme/

https://id.wikipedia.org/wiki/source code/