User Interface atau Antar Muka dalam aplikasi berbasis web, merupakan bentuk grafis yang akan dihadapi saat user menggunakan menggunakan aplikasi melalui bantuan browser. Kita akan membuat User Interface (UI) sederhana untuk aplikasi phonebook ini. Interface phonebook juga menggunakan CSS untuk mengatur tampilan supaya mudah digunakan.
Proporsi tampilannya adalah :
- Sisi atas untuk header aplikasi phonebook
- sisi sebelah kiri untuk menu aplikasi dan
- sisi sebelah kanan adalah bagian untuk menampilkan respon dari menu disebelah kiri.
Jika digambarkan, kira kira dalam bentuk sebagai berikut :
Ada banyak perubahan pada tampilan aplikasi ini disbanding dengan aplikasi phonebook di tutorial sebelumnya, seperti :
1. terdapat tambahan file css
2. letak menu aplikasi dan respon yang diberikan disebelah kanan
3. penggunaan session_start
4. penggunaan 2 buah method yaitu POST dan GET
5. sementara fungsi edit dan delete dihilangkan (dibahas di tutorial selanjutnya)
6. dan lain lain 
Jangan lupa untuk menyesuaikan koneksi database pada file connect.php. Kalau anda salah mengisikan username dan password nya maka koneksi ke mysql akan gagal !
Username dan password untuk login aplikasi phonebook ini masih sama dengan sebelumnya, yaitu username : userphonebook, password : password
