Computer programming is popularized in 21st century education in terms of allowing intensive logical thinking for students. Artificial Intelligent and robotic field is considered to be the most attractive for programming today. However, for the first-time learners and novice programmers, they may encounter a difficulty in understanding the text-based style programming language with its special syntax, sematic, libraries, and the structure of the program itself. In this work, we proposed a visual programming environment for artificial intelligent and robotic application using Google Blockly. The development framework is a web application which is capable of using Google Blockly to create a program and translate the result of visual programming style to conventional text-based programming. This allows almost instant programming capability for learners of programming in such a complex system.