Browse Source

README-es.md edited online with Bitbucket

Jose R Ortiz Ubarri 8 years ago
parent
commit
4e5a2efd6b
1 changed files with 36 additions and 63 deletions
  1. 36
    63
      README-es.md

+ 36
- 63
README-es.md View File

1
-#Estructuras de repetición - Esteganografía
1
+# Estructuras de repetición - Esteganografía
2
 
2
 
3
 ![main1.png](images/main1.png)
3
 ![main1.png](images/main1.png)
4
 ![main2.png](images/main2.png)
4
 ![main2.png](images/main2.png)
5
 ![main3.png](images/main3.png)
5
 ![main3.png](images/main3.png)
6
 
6
 
7
+[Verano 2016 - Ive]
8
+
7
 Una de las ventajas de utilizar programas de computadoras es que podemos realizar tareas repetitivas fácilmente. Los ciclos como `for`, `while`, y `do-while` son estructuras de control que nos permiten repetir un conjunto de instrucciones. A estas estructuras también se les llama *estructuras de repetición*.  En la experiencia de laboratorio de hoy completarás una aplicación de esteganografía para practicar el uso de ciclos anidados en la manipulación de arreglos bi-dimensionales.
9
 Una de las ventajas de utilizar programas de computadoras es que podemos realizar tareas repetitivas fácilmente. Los ciclos como `for`, `while`, y `do-while` son estructuras de control que nos permiten repetir un conjunto de instrucciones. A estas estructuras también se les llama *estructuras de repetición*.  En la experiencia de laboratorio de hoy completarás una aplicación de esteganografía para practicar el uso de ciclos anidados en la manipulación de arreglos bi-dimensionales.
8
 
10
 
9
 
11
 
10
-##Objetivos:
12
+## Objetivos:
11
 
13
 
12
 1. Aplicar ciclos anidados y estructuras de control para manipular arreglos bi-dimensionales y  extraer mensajes escondidos en imágenes.
14
 1. Aplicar ciclos anidados y estructuras de control para manipular arreglos bi-dimensionales y  extraer mensajes escondidos en imágenes.
13
 
15
 
16
 3. Utilizar la representación binaria de caracteres.
18
 3. Utilizar la representación binaria de caracteres.
17
 
19
 
18
 
20
 
19
-##Pre-Lab:
21
+## Pre-Lab:
20
 
22
 
21
 Antes de llegar al laboratorio debes haber:
23
 Antes de llegar al laboratorio debes haber:
22
 
24
 
39
 
41
 
40
 
42
 
41
 
43
 
42
-##Esteganografía
44
+## Esteganografía
43
 
45
 
44
 La esteganografía es la ciencia de camuflar la presencia de mensajes ocultos en portadores legítimos (archivos que parecen inofensivos). Esta ciencia ha sido utilizada por delincuentes cibernéticos para ocasionar daños a sistemas de computadoras, y por terroristas para codificar mensajes ocultos en transmisiones de internet. Se dice que Al-Qaeda puede haber utilizado esteganografía para codificar mensajes en imágenes y luego transportarlos por correo electrónico, y posiblemente por USENET, para preparar y ejecutar los ataques terroristas del 11 de septiembre de 2001.
46
 La esteganografía es la ciencia de camuflar la presencia de mensajes ocultos en portadores legítimos (archivos que parecen inofensivos). Esta ciencia ha sido utilizada por delincuentes cibernéticos para ocasionar daños a sistemas de computadoras, y por terroristas para codificar mensajes ocultos en transmisiones de internet. Se dice que Al-Qaeda puede haber utilizado esteganografía para codificar mensajes en imágenes y luego transportarlos por correo electrónico, y posiblemente por USENET, para preparar y ejecutar los ataques terroristas del 11 de septiembre de 2001.
45
 
47
 
53
 ---
55
 ---
54
 
56
 
55
 
57
 
56
-##Edición de imágenes
58
+## Edición de imágenes
57
 
59
 
58
 En esta experiencia de laboratorio, recuperarás un mensaje secreto que ha sido ocultado en una imagen. Para poder realizar tu tarea debes entender algunos conceptos relacionados a imágenes, conocer métodos de la clase `QImage` de `Qt` y funciones para trabajar con datos de tipo `QRgb`.
60
 En esta experiencia de laboratorio, recuperarás un mensaje secreto que ha sido ocultado en una imagen. Para poder realizar tu tarea debes entender algunos conceptos relacionados a imágenes, conocer métodos de la clase `QImage` de `Qt` y funciones para trabajar con datos de tipo `QRgb`.
59
 
61
 
60
-###Píxeles
62
+### Píxeles
61
 
63
 
62
 Al elemento más pequeño de una imagen se le llama un *píxel*. Esta unidad consiste de un solo color. Como cada color es una combinación de tonalidades de los colores primarios rojo, verde y azul,   se codifica como un entero sin signo cuyos bytes  representan los tonos de rojo, verde y azul del pixel  (Figura 1). A esta combinación se le llama el *RGB* del color por las siglas de "Red-Green-Blue". Por ejemplo, un píxel de color rojo (puro) tiene una representación RGB `0x00ff0000`, mientras que un píxel de color blanco tiene una representación RGB de `0x00FFFFFF` (ya que el color blanco es la combinación de los tonos rojo, verde y azul en toda su intensidad).
64
 Al elemento más pequeño de una imagen se le llama un *píxel*. Esta unidad consiste de un solo color. Como cada color es una combinación de tonalidades de los colores primarios rojo, verde y azul,   se codifica como un entero sin signo cuyos bytes  representan los tonos de rojo, verde y azul del pixel  (Figura 1). A esta combinación se le llama el *RGB* del color por las siglas de "Red-Green-Blue". Por ejemplo, un píxel de color rojo (puro) tiene una representación RGB `0x00ff0000`, mientras que un píxel de color blanco tiene una representación RGB de `0x00FFFFFF` (ya que el color blanco es la combinación de los tonos rojo, verde y azul en toda su intensidad).
63
 
65
 
71
 
73
 
72
 En `Qt` se utiliza el tipo `QRgb` para representar valores `RGB`.  Utilizando las funciones que describimos abajo podemos realizar algunas operaciones importantes de análisis de imágenes, tales como determinar el RGB de cada píxel de una imagen, y obtener los componentes rojo, verde y azul del valor `QRgb` del píxel.
74
 En `Qt` se utiliza el tipo `QRgb` para representar valores `RGB`.  Utilizando las funciones que describimos abajo podemos realizar algunas operaciones importantes de análisis de imágenes, tales como determinar el RGB de cada píxel de una imagen, y obtener los componentes rojo, verde y azul del valor `QRgb` del píxel.
73
 
75
 
74
-###Biblioteca
76
+### Biblioteca
75
 
77
 
76
 La experiencia de laboratorio de hoy utilizará la clase `QImage`. Esta clase permite acceder a los datos de los pixeles de una imagen para poder manipularla. La documentación de la clase `QImage` se encuentra en http://doc.qt.io/qt-4.8/qimage.html.
78
 La experiencia de laboratorio de hoy utilizará la clase `QImage`. Esta clase permite acceder a los datos de los pixeles de una imagen para poder manipularla. La documentación de la clase `QImage` se encuentra en http://doc.qt.io/qt-4.8/qimage.html.
77
 
79
 
94
 * `qBlue(pixel)`  // devuelve el tono del color azul del píxel, i.e. un valor entre (0x00 y 0xFF)
96
 * `qBlue(pixel)`  // devuelve el tono del color azul del píxel, i.e. un valor entre (0x00 y 0xFF)
95
 
97
 
96
 
98
 
97
-####Ejemplos:
99
+#### Ejemplos:
98
 
100
 
99
 1. Si la siguiente imagen `4 x 4` de píxeles representa el objeto `origImage`,
101
 1. Si la siguiente imagen `4 x 4` de píxeles representa el objeto `origImage`,
100
 
102
 
101
     ![ejemplo.png](images/ejemplo.png)
103
     ![ejemplo.png](images/ejemplo.png)
102
 
104
 
103
-  entonces `origImage.pixel(2,1)` devuelve un valor `rgb` que representa el color azul (`0x0000ff`).
105
+    entonces `origImage.pixel(2,1)` devuelve un valor `rgb` que representa el color azul (`0x0000ff`).
104
 
106
 
105
 2. La siguiente instrucción le asigna a la variable `greenContent` el valor del tono de verde que contiene el píxel `(1,1)` de  `origImage`:
107
 2. La siguiente instrucción le asigna a la variable `greenContent` el valor del tono de verde que contiene el píxel `(1,1)` de  `origImage`:
106
 
108
 
107
-  `int greenContent = qGreen(origImage.pixel(1,1));`.
109
+    `int greenContent = qGreen(origImage.pixel(1,1));`.
108
 
110
 
109
 
111
 
110
 3. El siguiente programa crea un objeto de clase `QImage` e imprime los componentes rojo, verde y azul del pixel en el centro de la imagen. La imagen utilizada es la que se especifica dentro del paréntesis durante la creación del objeto, esto es, el archivo `chuck.png`.
112
 3. El siguiente programa crea un objeto de clase `QImage` e imprime los componentes rojo, verde y azul del pixel en el centro de la imagen. La imagen utilizada es la que se especifica dentro del paréntesis durante la creación del objeto, esto es, el archivo `chuck.png`.
111
 
113
 
112
----
113
-
114
-```cpp
115
-#include <QImage>
116
-#include <iostream>
114
+      #include <QImage>
115
+      #include <iostream>
117
 
116
 
118
-using namespace std;
119
-int main() {
120
-    QImage myImage(“/Users/rarce/Downloads/chuck.png”);
121
-    QRgb    centralPixel;
117
+      using namespace std;
118
+      int main() {
119
+         QImage myImage(“/Users/rarce/Downloads/chuck.png”);
120
+         QRgb    centralPixel;
122
 
121
 
123
-    centralPixel = myImage.pixel(myImage.width() / 2, myImage.height() / 2);
122
+         centralPixel = myImage.pixel(myImage.width() / 2, myImage.height() / 2);
124
 
123
 
125
-    cout    << hex;
124
+         cout << hex;
126
 
125
 
127
-    cout    << “Los componentes rojo, verde y azul del pixel central son: “
128
-        << qRed(centralPixel) << “, “
129
-        << qGreen(centralPixel) << “, “
130
-        << qBlue(centralPixel) << endl;
131
-    return 0;
132
-}
133
-```
126
+         cout << “Los componentes rojo, verde y azul del pixel central son: “
127
+              << qRed(centralPixel) << “, “
128
+              << qGreen(centralPixel) << “, “
129
+              << qBlue(centralPixel) << endl;
130
+         return 0;
131
+      }
134
 
132
 
135
 
133
 
136
-###Empotrando un mensaje en una imagen
134
+### Empotrando un mensaje en una imagen
137
 
135
 
138
 Uno de los métodos más simples para esconder un mensaje en una imagen es codificando el mensaje en los bits menos significativos de los componentes de los colores de los píxeles de la imagen. Este método esconde el mensaje en la imagen eficientemente porque el efecto al cambiar el bit menos significativo en un color de 8 bits es casi imperceptible para el ojo humano.
136
 Uno de los métodos más simples para esconder un mensaje en una imagen es codificando el mensaje en los bits menos significativos de los componentes de los colores de los píxeles de la imagen. Este método esconde el mensaje en la imagen eficientemente porque el efecto al cambiar el bit menos significativo en un color de 8 bits es casi imperceptible para el ojo humano.
139
 
137
 
156
 
154
 
157
 El primer paso sería obtener la representación ASCII del mensaje. Los bits de la representación ASCII son los bits que codificaremos en los colores de los píxeles. La representación ASCII de "Dog" es:
155
 El primer paso sería obtener la representación ASCII del mensaje. Los bits de la representación ASCII son los bits que codificaremos en los colores de los píxeles. La representación ASCII de "Dog" es:
158
 
156
 
159
-
160
-```
161
-"Dog"  = 01000100 01101111 01100111
162
-```
157
+`"Dog"  = 01000100 01101111 01100111`
163
 
158
 
164
 El código `01000100` corresponde a la `D`, y así sucesivamente.
159
 El código `01000100` corresponde a la `D`, y así sucesivamente.
165
 
160
 
166
 El proceso de codificación es más fácil de entender si separamos los bits en grupos de tres (un bit por cada componente del RGB):
161
 El proceso de codificación es más fácil de entender si separamos los bits en grupos de tres (un bit por cada componente del RGB):
167
 
162
 
168
-```
169
-"Dog"  = 010 001 000 110 111 101 100 111
170
-```
163
+`"Dog"  = 010 001 000 110 111 101 100 111`
171
 
164
 
172
 Ahora, comenzamos a recorrer la imagen píxel por píxel, empotrando en cada píxel tres bits del código ASCII (un bit en cada componente de color del píxel). Por ejemplo, empotraríamos  `010` en el primer píxel, `001` en el segundo, y así sucesivamente.
165
 Ahora, comenzamos a recorrer la imagen píxel por píxel, empotrando en cada píxel tres bits del código ASCII (un bit en cada componente de color del píxel). Por ejemplo, empotraríamos  `010` en el primer píxel, `001` en el segundo, y así sucesivamente.
173
 
166
 
233
 Pregunta: 
226
 Pregunta: 
234
 ¿Qué mensaje está escondido (usando la técnica del bit menos significativo) en una imagen cuyos primeros 8 píxeles son:
227
 ¿Qué mensaje está escondido (usando la técnica del bit menos significativo) en una imagen cuyos primeros 8 píxeles son:
235
 
228
 
236
-
237
-```
238
-0x545554 0x666667 0x444544 0x333232
239
-0xff0000 0x0100ff 0x00ff00 0x10aaba 
240
-```
229
+`0x545554 0x666667 0x444544 0x333232 0xff0000 0x0100ff 0x00ff00 0x10aaba`
241
 
230
 
242
 Explica tu respuesta.
231
 Explica tu respuesta.
243
 
232
 
245
 
234
 
246
 ---
235
 ---
247
 
236
 
248
-!INCLUDE "../../eip-diagnostic/steganography/es/diag-steganography-01.html"
249
-<br>
250
-
251
-!INCLUDE "../../eip-diagnostic/steganography/es/diag-steganography-02.html"
252
-<br>
253
-
254
-!INCLUDE "../../eip-diagnostic/steganography/es/diag-steganography-03.html"
255
-<br>
256
 
237
 
257
-!INCLUDE "../../eip-diagnostic/steganography/es/diag-steganography-04.html"
238
+!INCLUDE "../../eip-diagnostic/steganography/es/diag-steganography-05.html"
258
 <br>
239
 <br>
259
 
240
 
260
-!INCLUDE "../../eip-diagnostic/steganography/es/diag-steganography-05.html"
261
-<br>
262
-
263
-!INCLUDE "../../eip-diagnostic/steganography/es/diag-steganography-06.html"
264
-<br>
265
-
266
-!INCLUDE "../../eip-diagnostic/steganography/es/diag-steganography-07.html"
267
-<br>
268
 
241
 
269
 ---
242
 ---
270
 
243
 
271
 ---
244
 ---
272
 
245
 
273
 
246
 
274
-##Sesión de laboratorio:
247
+## Sesión de laboratorio:
275
 
248
 
276
 En la experiencia de laboratorio de hoy completarás una aplicación de esteganografía para extraer mensajes ocultos en imágenes.
249
 En la experiencia de laboratorio de hoy completarás una aplicación de esteganografía para extraer mensajes ocultos en imágenes.
277
 
250
 
278
-###Ejercicio 1: Extraer el mensaje binario
251
+### Ejercicio 1 - Extraer el mensaje binario
279
 
252
 
280
-####Instrucciones
253
+#### Instrucciones:
281
 
254
 
282
 
255
 
283
 1) Carga a QtCreator el proyecto `Steganography` haciendo doble "click" en el archivo `Steganography.pro` en el directorio `Documents/eip/Repetitions-Steganography` de tu computadora. También puedes ir a `http://bitbucket.org/eip-uprrp/repetitions-steganography` para descargar la carpeta `Repetitions-Steganography` a tu computadora.
256
 1) Carga a QtCreator el proyecto `Steganography` haciendo doble "click" en el archivo `Steganography.pro` en el directorio `Documents/eip/Repetitions-Steganography` de tu computadora. También puedes ir a `http://bitbucket.org/eip-uprrp/repetitions-steganography` para descargar la carpeta `Repetitions-Steganography` a tu computadora.
309
 Para poder implementar el algoritmo de extracción del mensaje, debes entender cómo fue empotrado el mensaje. Si es necesario, repasa la sección “Empotrando un mensaje en una imagen”.
282
 Para poder implementar el algoritmo de extracción del mensaje, debes entender cómo fue empotrado el mensaje. Si es necesario, repasa la sección “Empotrando un mensaje en una imagen”.
310
 
283
 
311
 
284
 
312
-###Ejercicio 2: Interpretar el mensaje
285
+### Ejercicio 2 - Interpretar el mensaje
313
 
286
 
314
-####Instrucciones
287
+#### Instrucciones:
315
 
288
 
316
 
289
 
317
 1. Completa la función `binaryStringToMessage` que recibe el "string" de `0`'s y `1`'s extraido de la imagen para que devuelva el mensaje oculto. Puedes aprovechar la función `binStringToChar` para convertir "substrings" de 8 `0`'s y `1`'s en el caracter que le corresponde.
290
 1. Completa la función `binaryStringToMessage` que recibe el "string" de `0`'s y `1`'s extraido de la imagen para que devuelva el mensaje oculto. Puedes aprovechar la función `binStringToChar` para convertir "substrings" de 8 `0`'s y `1`'s en el caracter que le corresponde.