nanscreativeadv.com – Kalau kamu lagi cari cara bikin tampilan tulisan yang hidup dan nggak monoton, jawabannya ada di program running text. Tulisan berjalan ini nggak cuma buat gaya-gayaan, tapi juga punya fungsi penting buat branding, promosi, atau sekadar tampil beda. Nggak ribet, bisa dipelajari siapa aja, bahkan kalau kamu baru banget nyentuh dunia coding atau LED. yuk, simak!
Apa Itu Program Running Text?
Program running text itu menjadikan teks jadi bisa jalan sendiri di website, papan LED, atau aplikasi Android. Biasanya dipakai buat narik perhatian orang, mulai dari promosi toko, iklan diskon, sampai dekorasi digital biar nggak monoton. Formatnya juga fleksibel banget, bisa pakai HTML <marquee>, animasi CSS, atau lewat sistem Arduino dan mikrokontroler.
Jadi bukan cuma ngasih info, tapi juga bisa ningkatin daya tarik visual secara signifikan. Misalnya, di depan toko, tulisan seperti “Diskon Besar Hari Ini!” yang jalan terus dan pasti lebih dilirik.
Cara Bikin Running Text di Web: HTML, CSS, dan JavaScript
Salah satu cara paling gampang buat bikin program running text adalah lewat web. Ini cocok banget buat pemula karena nggak butuh alat fisik. Tinggal pakai HTML/CSS, kamu udah bisa punya teks yang jalan sendiri.
Pakai Tag Marquee (Metode Jadul Tapi Simpel)
Buat kamu yang baru mulai, HTML bisa jadi pintu pertama untuk kenalan dengan konsep running text. Tag <marquee> memang sudah usang, tapi masih bisa jadi latihan dasar yang seru. Kamu bisa pake tag ini buat nampilin info promo, notifikasi penting, atau pesan dinamis lainnya. Simpel, dan langsung kelihatan hasilnya.
<marquee>Promo Hari Ini Diskon 70%! Jangan Lewatkan!</marquee>
Meski udah nggak direkomendasikan, tag <marquee> masih bisa jalan di beberapa browser. Ini pilihan cepat kalau kamu cuma pengen tes dasar running text.
Alternatif Modern Pakai CSS + JavaScript
Kalau kamu suka hasil yang keren & fleksibel, kamu bisa ke CSS dan JavaScript, selain kamu bisa atur sendiri kecepatan, arah, bahkan gaya gerak teksnya. Bisa juga ditambah interaksi pakai JavaScript, seperti teks berhenti waktu di-hover, atau efek masuk keluar layar yang smooth banget.
<div class=”running-text”>Promo Gila Hari Ini!</div>
css
.running-text {
animation: jalan 10s linear infinite;
white-space: nowrap;
display: inline-block;
}
@keyframes jalan {
from { transform: translateX(100%); }
to { transform: translateX(-100%); }
}
Dengan CSS, tampilan kamu lebih fleksibel dan bisa diatur kecepatannya. Nggak ketinggalan zaman juga.
Aplikasi Android Buat Bikin Running Text LED
Nggak mau ribet coding? Tenang, sekarang banyak aplikasi Android yang bisa bantu kamu bikin running text langsung dari HP. Tinggal buka, ketik teksnya, atur warna dan kecepatan, langsung bisa dipakai buat papan iklan dadakan atau sekadar seru-seruan di event.
LED Scroller Pro
Aplikasi ini punya fitur lengkap, bisa ganti warna, font, kecepatan, bahkan background. Interface-nya simpel dan cocok buat pemula. Cocok juga buat kamu yang sering ikut bazaar atau buka booth event.
Misalnya kamu jualan makanan malam di pinggir jalan, tinggal buka aplikasinya, tulis “NASI GORENG PEDAS LEVEL 5”, atur geraknya kecepatan sedang, dan taruh HP kamu di atas meja. Gak perlu spanduk mahal, tapi tetap nyolok.
Aplikasi ini juga support fitur mirror dan rotate, jadi kamu bisa menyesuaikan tampilan sesuai arah peletakan layar atau stand.
Digital LED Sign Board
Dengan desain ui/ux yang clean membuat kamu membuka semua fitur langsung kebaca, gak ribet. Kamu tinggal ketik teksnya, atur animasinya, lalu pilih mau jalan terus atau berhenti di titik tertentu
Aplikasi ini punya fitur auto loop dan teks multi-baris. Jadi kalau kamu mau menampilkan dua info sekaligus seperti “Promo Buy 1 Get 1” dan “Khusus Hari Ini Saja”, kamu tinggal masukin dan aplikasi bakal urus sisanya.
Digital LED Sign Board juga cocok dipakai buat papan harga digital. Misalnya, kamu bisa taruh harga kopi, teh, atau menu spesial di layar HP yang kamu tempel di meja bar.
LED Banner
Fokus ke teks besar yang langsung nyala terang. Cocok buat konser, event outdoor malam, atau branding toko depan. Kamu bisa pilih berbagai animasi teks dan lampu latar. Kamu juga bisa bikin pesan bergulir seperti “SEGARKAN HARIMU DENGAN ES TEH MURAH MERIAH” dalam waktu kurang dari satu menit.
Fitur highlight di aplikasi ini adalah mode “flash alert” yang bikin teks kamu menyala-nyala seperti alarm dan langsung curi perhatian orang yang lewat.
Baca Juga: Cara Membuat Huruf Timbul dengan Corel untuk Neon Box sebagai Desain Digital
Running Text di LCD 16×2 dengan Arduino
Buat yang suka otak-atik hardware, Arduino jadi pilihan seru. Kamu bisa nampilin teks di layar kecil, ideal buat display produk atau hiasan DIY. Selain seru, ini juga bisa jadi latihan logika coding dan elektronika sederhana yang hasilnya langsung kelihatan.
Komponen yang Dibutuhkan:
- Arduino Uno
- LCD 16×2
- Potensiometer
- Breadboard
- Kabel jumper
Semua komponen ini mudah dicari di toko elektronik atau marketplace. Pastikan kamu sambung dengan benar ya, karena LCD cukup sensitif.
Contoh Kode Sederhana
#include <LiquidCrystal.h>
LiquidCrystal lcd(12, 11, 5, 4, 3, 2);
void setup() {
lcd.begin(16, 2);
}
void loop() {
lcd.setCursor(0, 0);
lcd.print(“Halo Dunia!”);
delay(500);
lcd.clear();
}
Modifikasi sedikit, dan teks kamu udah bisa digeser otomatis pake fungsi scrollDisplayLeft().
Pakai LED Strip WS1903/NeoPixel Buat Efek Keren
Pengen efek lebih dinamis dan warna-warni? Cobain strip LED kayak WS1903. Ini cocok buat project running text yang lebih atraktif. Cocok buat billboard, hiasan kafe, atau instalasi seni digital yang penuh warna dan gerak. Kamu butuh alat dan pengerjaan seperti berikut ini:
- LED Strip WS1903 / NeoPixel
- Arduino
- Power Supply (5V)
- Library Adafruit NeoPixel
Perlu diperhatikan: power supply harus cukup kuat karena strip LED butuh daya besar, apalagi kalau banyak lampunya menyala bersamaan.
Playground dengan Coba Running Text Tanpa Coding
Sebelum kamu upload running text ke website atau perangkat LED, Nggak cuma buat ngecek apakah kodenya jalan, tapi juga buat lihat tampilannya apakah teksnya kebaca, kecepatannya pas, hanya di browser Android. Nah, kabar baiknya, sekarang kamu bisa coba semua itu tanpa perlu install software berat.
Playground online ini juga cocok banget buat kamu yang belajar otodidak. Kamu bisa ngulik animasi, kombinasi warna, sampai efek transisi. Bahkan kalau kamu salah ketik kode pun, bisa langsung ketahuan dan diperbaiki saat itu juga.
CodePen
CodePen itu surganya para kreator web. Di sini, kamu bisa langsung nyoba HTML, CSS, dan JavaScript dalam satu tampilan. Bisa disimpan juga kalau kamu sudah punya akun, jadi project kamu bisa dilanjutin kapan aja. Kelebihan lainnya, kamu bisa ngintip juga hasil karya orang lain sebagai inspirasi.
JSFiddle
JSFiddle lebih ringan dan cocok banget buat tes-tes kecil. Misalnya, kamu mau coba efek scroll tertentu atau pengaturan kecepatan animasi, tinggal paste dan run.
W3Schools TryIt Editor
Kalau kamu masih pemula banget dan belum pede coding, coba dulu playground dari W3Schools. Semua elemen HTML dasar udah disiapin, kamu tinggal edit bagian teksnya aja. Cocok buat latihan, karena ada panduannya juga.
Baca Juga: Jangan Asal Pasang! Ini Cara buat Neon Box Sign Semakin Nyala dan Dilirik
Tips Biar Running Text Kamu Nggak Bosenin
Sekadar gerak-gerak aja nggak cukup buat narik perhatian orang. Terkadang running text yang niat malah jadi nggak efektif karena tampilannya monoton atau susah dibaca. Jadi, kamu harus pintar-pintar mengatur tampilan, durasi, dan suasana supaya teks yang kamu buat benar-benar bikin orang berhenti dan baca.
Tips di bawah ini bisa langsung kamu terapin, baik untuk running text di web, papan LED, atau layar digital lainnya.
Jangan Gunakan Font Ribet
Font yang terlalu dekoratif atau tipis bikin orang harus mikir dua kali buat baca. Pakai aja font sans-serif yang tebal dan clean seperti Poppins, Montserrat, atau Arial Bold. Tujuannya biar orang bisa langsung nangkep pesannya dalam hitungan detik.
Kecepatan Harus Sesuai
Kalau teks jalan terlalu cepat, pembaca cuma bisa lihat ujungnya doang. Tapi kalau terlalu lambat, mereka bakal skip karena bosan. Atur kecepatan yang seimbang, sekitar 50–80 karakter per menit. Kalau pakai LED atau banner digital, pastikan teks nggak nabrak pinggir layar biar enak dilihat.
Uji Responsif di Semua Layar
Jangan cuma test di satu device doang. Tampilannya bisa beda banget antara HP, tablet, dan desktop. Cek juga apakah ukuran teksnya tetap proporsional dan nggak terlalu kecil atau kebesaran. Gunakan media query kalau kamu pakai CSS supaya tampilannya fleksibel dan adaptif di berbagai layar.
Sekarang Kamu Bisa Bikin Running Text Sendiri
Sekarang kamu udah buktiin sendiri kalau bikin program running text itu gampang banget buat dipelajari. Kamu bisa langsung mulai dari HTML yang simpel, lanjut eksplor aplikasi Android, atau sekalian ngerakit sendiri pakai Arduino dan LED strip. Asal kamu tahu tujuannya, prosesnya bisa kamu sesuaikan dengan kebutuhan.
Kamu juga bisa kolaborasiin running text dengan branding visual, audio, dan pencahayaan biar lebih dramatis. Dunia visual makin luas, dan running text jadi salah satu alat simpel tapi powerful buat tampil beda.
Kalau kamu butuh jasa desain visual bergerak, signage LED, atau branding visual lainnya, langsung aja cek website kami di Nans Creative Adv. Kami siap bantu bikin bisnismu makin nyala dan dilirik orang!
📲 Hubungi kami via WhatsApp
📨 Hubungi Email kami