We can control everything with this project. In this article I just display the pressed key on 8x8 LED matrix as an example.


Things Used In This Project

Wiring Diagram
  • Stack PHPoC WiFi shield or PHPoC Shield on Arduino
  • LED ----- Arduino
  • VCC ----- 5V
  • GND ----- GND
  • SDA ----- A4(SDA)
  • SCL ----- A5(SCL)
Click image for larger version  Name:	arduino_keypad_wiring.png Views:	194 Size:	37.3 KB ID:	734

Data Flow

Web browser ---> PHPoC WiFi Shield ---> Arduino

When user touch on a key, web app on web browser will send the character corresponding with the pressed key to PHPoC shield via WebSocket. When receiving the data, PHPoC shield automatically passes it to Arduino. Arduino takes action (displaying on LED matrix) according to the data received from PHPoC Shield.

Note that: PHPoC shield has a built-in program to pass data from web browser to Arduino. Therefore, we don't need to care about it.

What We Need to Do
  • Set WiFi information for PHPoC shield (SSID and password)
  • Upload new UI to PHPoC shield
  • Write Arduino code

Setting Wifi Information for PHPoC Shield

See this instruction http://www.phpoc.com/support/manual/...rk_first_setup

Upload new Web UI to PHPoC Shield
Write Arduino Code

Try it
  • Click serial button on Arduino IDE to see the IP address.
  • Open web browser, type http:// replace_ip_address/remote_keypad.php
  • Click connect button and test it.