diff --git a/ui_es.html b/ui_es.html
new file mode 100644
index 00000000..9b730801
--- /dev/null
+++ b/ui_es.html
@@ -0,0 +1,87 @@
+<html>
+
+<head>
+	<meta charset="utf-8" />
+	<link rel="stylesheet" href="css/app.css" type="text/css" />
+	<link href="https://fonts.googleapis.com/css?family=Catamaran:400,700" rel="stylesheet">
+</head>
+
+<body>
+
+	<div class="phone" id="phone">
+
+		<div class="container">
+
+			<div class="head">
+				<span id="phone-icon"><img src="./img/icons/signal.png" /></span>
+				<span id="phone-number">unknown</span>
+			</div>
+
+			<div class="menu">
+				<ul class="home">
+					<li class="phone-icon" id="phone-icon-rep">Contactos</li>
+					<li class="phone-icon" id="phone-icon-msg">Mensajes</li>
+				</ul>
+			</div>
+
+			<div id="repertoire" class="screen">
+
+				<div class="head-screen"><span id="btn-head-back-rep" class="btn-head btn-head-back"></span>Contactos<span id="btn-head-new-contact"
+					 class="btn-head btn-head-new"></span></div>
+				<div class="container">
+					<div class="content-screen repertoire-list">
+						<div class="contact no-item online">
+							<p class="no-item">No hay contactos</p>
+						</div>
+					</div>
+				</div>
+			</div>
+
+			<div id="messages" class="screen">
+				<div class="head-screen"><span id="btn-head-back-msg" class="btn-head btn-head-back"></span>Mensajes
+					<!--<span id="btn-head-new-message" class="btn-head btn-head-new"></span>-->
+				</div>
+				<div class="container">
+					<div class="content-screen messages-list">
+						<div class="message no-item">
+							<p class="no-item">No hay mensajes</p>
+						</div>
+					</div>
+				</div>
+			</div>
+
+			<div id="writer" class="screen">
+				<div class="head-screen"><span id="btn-head-back-writer" class="btn-head btn-head-back"></span><span class="header-title"></span></div>
+				<div class="container">
+					<div class="content-screen">
+						<input type="hidden" id="writer_number" value="0" />
+						<textarea id="writer_message" placeholder="Your message"></textarea>
+						<label><input type="checkbox" id="writer_anonyme" value="true">Anonymous</label>
+						<button id="writer_cancel">Cancelar</button>
+						<button id="writer_send" class="marged">Enviar</button>
+					</div>
+				</div>
+			</div>
+
+			<div id="contact" class="screen">
+				<div class="head-screen"><span id="btn-head-back-contact" class="btn-head btn-head-back"></span>A&ntilde;adir contacto</div>
+				<div class="container">
+					<div class="content-screen">
+						<input type="text" id="contact_name" placeholder="Name" />
+						<input type="text" id="contact_number" placeholder="Number" />
+						<button id="contact_cancel">Cancelar</button>
+						<button id="contact_send">A&ntilde;adir</button>
+					</div>
+				</div>
+			</div>
+
+		</div>
+	</div>
+
+	<script src="nui://game/ui/jquery.js" type="text/javascript"></script>
+	<script src="scripts/mustache.min.js"></script>
+	<script src="scripts/app_es.js"></script>
+
+</body>
+
+</html>
