herramientas de diseño de interfaz

 

REPÚBLICA BOLIVARIANA DE VENEZUELA

MINISTERIO DEL PODER POPULAR PARA LA EDUCACIÓN UNIVERSITARIA

UNIVERSIDAD POLITÉCNICA TERRITORIAL DEL ESTADO BOLÍVAR

PROGRAMA NACIONAL DE FORMACIÓN EN INFORMÁTICA

PROGRAMACIÓN II

T2-INF-4T

 

 

Herramientas De Diseño De Interfaz

                                                                

 

 

 

Profesor:	Alumna:
Hermes Marcano	Jan Ketly Díaz. C.I:27.297.472

 

 

 

 

 

 

CIUDAD BOLÍVAR, ENERO DE 2023

INTRODUCCIÓN

 

La Interfaz de Usuario de un programa es un conjunto de elementos hardware y software de una computadora que presentan información al usuario y le permiten interactuar con la información y con el computador. Un diseño de interfaz de usuario es la parte fundamental del `proceso del diseño de sistema. Si un sistema debe alcanzar su máximo potencial, es fundamental que la interfaz de usuario sea diseñada para ajustarse a las habilidades, expectativas, experiencias de los usuarios.

 Un buen diseño de una interfaz de usuario determina la confiabilidad del sistema. Si la Interfaz de Usuario está bien diseñada, el usuario encontrará la respuesta que espera a su acción. Si no es así puede ser frustrante su operación, ya que el usuario habitualmente tiende a culparse a sí mismo por no saber usar el objeto. Muchos de los llamados “errores de usuarios” son causados por el hecho de que las interfaces de usuario no consideran las habilidades del usuario y su entorno de trabajo, si se diseña mal la interfaz el usuario no podrá acceder a algunas características del sistema, cometerá errores y sentirá que el sistema le dificulta en vez de ayudarlo.

 

 

 

 

 

 

 

 

Descripción Del Entono De Trabajo

 

Cuando se inicia Fusion, una de las primeras cosas que se pueden notar es que su interfaz tiene un diseño un tanto diferente a la típica interfaz de los programas basados en Windows. Esto es debido principalmente a que Fusion 360 es un programa multiplataforma que funciona tanto en Mac como en PC. En la parte superior de la pantalla, hay una barra de herramientas, pestañas y la cinta de comandos. Comenzando por la esquina superior izquierda de la interfaz está la barra de aplicación. El primer icono de la barra de aplicación se asemeja a una cuadrícula y se encarga de desplegar el panel de Datos. Desde el panel de Datos, se tiene acceso a todos los proyectos activos, se cargan nuevos archivos y se pueden organizar en carpetas. 

En la Lección anterior vimos la interfaz y se describió de manera general la ubicación de cada parte que constituye el programa. Ahora veremos algunas cualidades que permite al usuario manejarse con comodidad, según lo crea conveniente.

Una de las particularidades es la posibilidad de acoplar o desacoplar las Barras para ubicarlas a nuestro gusto.

Si nos fijamos con atención, hacia el borde izquierdo de cada barra, hay una serie de puntos desde los cuales, al llevar el cursor hacia esa zona notaremos que este cambia su forma al de flechas en distintos sentidos que nos indica que podemos mover o desacoplar la barra.

 

 

 

Barra De Herramientas

Las barras de herramientas le permiten acceder fácilmente a los menús más utilizados. Puede finalizar una tarea o un proceso con rapidez si hace clic en los distintos botones de la barra de herramientas en lugar de navegar por el menú.

Según lo que necesite, puede ocultar o mostrar las barras de herramientas. Para mostrar u ocultar una barra de herramientas, seleccione Ventana y, a continuación, seleccione el nombre de la barra de herramientas correspondiente.

Opciones principales

Métodos abreviados de acciones que se realizan con frecuencia como guardar, grabar y obtener una vista previa.

Barra de herramientas de objetos

Utilice los métodos abreviados para añadir objetos en Adobe Captivate, como pies de ilustración, botones y cuadros resaltados. Si utiliza esta barra de herramientas también podrá dibujar formas inteligentes, como líneas y rectángulos; o establecer el trazo y los colores de relleno

Configuración De Un Sitio Web

La configuración de página es un conjunto de parámetros específicos que implican la visualización y el diseño de una página impresa. Este tipo de recurso forma parte de muchas aplicaciones modernas de procesamiento de texto y otro software de procesamiento de documentos, por ejemplo, en aplicaciones de Microsoft Office.

Los aspectos de la configuración de la página incluyen la configuración de márgenes, una orientación de página vertical u horizontal y otras características. Los menús de configuración de página pueden ayudar a los usuarios a establecer estos atributos, para garantizar que un proyecto de impresión se realice correctamente. Las aplicaciones de procesamiento de textos pueden o no tener menús de configuración de página dedicados.

Otros aspectos de la configuración de la página incluyen elementos de encabezado y pie de página, color vs monótono, tamaños de papel y varias alineaciones. Algunas herramientas usan una regla para ayudar a establecer márgenes para un documento.

Creación Y Edición De Páginas Web

La manera más simple de crear páginas web consiste en utilizar un simple editor de texto como, por ejemplo, Notepad++ y editar directamente el código HTML más las hojas de estilo. Es la manera en la que en los inicios de Internet se creaban la mayoría de las páginas web.

Sistemas CMS

Este enfoque "artesanal" es poco productivo por la gran cantidad de codificación de HTML que implica y, además, sirve solo para webs completamente estáticas. No permite implementar cosas como, por ejemplo, una sección de comentarios de los lectores como las que son habituales en blogs o en periódicos digitales.

Por ese motivo surgieron los sistemas CMS como, por ejemplo, Wordpress y Joomla que evitan al usuario la codificación en HTML y ofrecen herramientas como editores visuales que convierten la tarea de la creación de páginas web a algo parecido a la edición de un documento en una aplicación de ofimática como OpenOffice o Microsoft Word.

Estas herramientas son aplicaciones web creadas con lenguajes de programación como PHP y que usan bases de datos como MySQL que no solamente permiten una edición más cómoda de los contenidos, sino también implementar webs dinámicas.

Entre estos sistemas destacan las herramientas para la creación de blogs por ser las más populares, lideradas por el CMS Blogger WordPress.

WordPress en particular, además de ser la herramienta líder para la creación de blogs, se está convirtiendo en la herramienta más utilizada para la creación de webs pequeñas y medianas.

Uso De Hipervínculos

 

Los hipervínculos permiten una forma de desplazamiento novedosa, referida a menudo como el link, y que consiste en la asociación entre un texto y otro que no necesariamente comparten contexto o cometidos, pero que están encadenados entre sí por algún término, sentido o referencia.

 

Es similar a la búsqueda de una palabra en el diccionario: la descripción del significado puede contener otras palabras desconocidas que a su vez buscaríamos en el diccionario y así sucesivamente, alejándonos de la original.

 

 

Tablas

Es una disposición de datos en filas y columnas, o en algunas ocasiones en una estructura más compleja. Son ampliamente utilizadas en comunicación, investigación y análisis de datos. Aparecen en medios impresos, notas escritas a mano, software de computadora, señales de tráfico y muchos otros lugares.

Las convenciones precisas y la terminología para describir las tablas varían según el contexto. Además, pueden diferir significativamente en variedad, estructura, flexibilidad, notación, representación y uso.1​2​3​4​5​ En los libros y artículos técnicos, generalmente se presentan aparte del texto principal, dispuestas en bloques flotantes, numerados y subtitulados.

Formularios

Es un documento, físico o digital, elaborado para que un usuario introduzca datos estructurados (nombres, apellidos, dirección, fecha, etc.) en las zonas correspondientes, para ser almacenados y procesados posteriormente. Esto ayuda a que diferentes instancias registren datos personales de quien los llena para posteriormente ser acreedor al servicio solicitado, siempre y cuando, los datos sean llenados correctamente.

En Internet y sistemas informáticos, los formularios pueden ser llenados en línea, con validación de datos, y son muy útiles para registrar usuarios, realizar encuestas, acceder a sistemas restringidos, etc. Los formularios por Internet se llaman formularios web, y generalmente se construyen mediante etiquetas HTML, aunque también pueden emplearse otras tecnologías como Flash, Java, etc.

En matemáticas, también se conoce como formulario, a un compendio de fórmulas matemáticas o algebraicas, pertenecientes a una o varias categorías, que sirve de guía o recordatorio para el momento de aplicarlas. Por ejemplo, para cálculos trigonométricos, conversiones entre cifras expresadas en diferentes unidades de medida.

Elementos Interactivos Y Multimedia

Un elemento interactivo es un elemento que puede cambiar dependiendo de cómo actúe el usuario. Un elemento multimedia puede ser un sonido, una canción, una animación, un vídeo...

Ambos tipos de elementos pueden darle vida a una Web, pero utilizar en exceso esta clase de elementos hará que la carga de nuestra Web sea lenta y engorrosa, por lo que los visitantes podrían perder el interés. Por lo tanto, hemos de usarlos con mesura.

 

Existen objetos que son una mezcla de ambos, como son las animaciones Flash. Estas animaciones pueden incluir sonidos e imágenes, y además ser interactivas.

Un problema común, además de la lentitud de carga, es la compatibilidad. No todos los efectos son soportados por todos los navegadores, en especial por los navegadores más antiguos. FrontPage nos ofrece algunas ayudas para resolver este problema. En general, si un navegador no soportara un efecto en particular, sencillamente lo ignora, por lo que en general nuestra Web podrá seguir siendo visitada, aunque sin ese efecto.

Plantillas

Una plantilla o dispositivo de interfaz, suele proporcionar una separación entre la forma o estructura y el contenido. Es un medio o aparato o sistema, que permite guiar, portar, o construir, un diseño o esquema predefinido.

Una plantilla agiliza el trabajo de reproducción o de muchas copias idénticas o casi idénticas (que no tiene que ser tan elaborado, sofisticado o personal). Si se utilizan plantillas en todos los terrenos de la industria y la tecnología. Una plantilla puede servir como muestra base de una diversidad sobre la que comparten elementos comunes (patrón) y que en sí es lo que constituye la plantilla.

En relación con la edición o composición de textos o imágenes, se compone de cajas y líneas, con unos tamaños y márgenes, para facilitar la escritura de artículos o cartas, con títulos, fotos y diagramas.

 

CSS

CSS (siglas en inglés de Cascading Style Sheets), en español «Hojas de estilo en cascada», es un lenguaje de diseño gráfico para definir y crear la presentación de un documento estructurado escrito en un lenguaje de marcado.2​ Es muy usado para establecer el diseño visual de los documentos web, e interfaces de usuario escritas en HTML o XHTML; el lenguaje puede ser aplicado a cualquier documento XML, incluyendo XHTML, SVG, XUL, RSS, etcétera. Junto con HTML y JavaScript, CSS es una tecnología usada por muchos sitios web para crear páginas visualmente atractivas, interfaces de usuario para aplicaciones web y GUIs para muchas aplicaciones móviles (como Firefox OS).3​

CSS está diseñado principalmente para marcar la separación del contenido del documento y la forma de presentación de este, características tales como las capas o layouts, los colores y las fuentes.4​ Esta separación busca mejorar la accesibilidad del documento, proveer más flexibilidad y control en la especificación de características presentacionales, permitir que varios documentos HTML compartan un mismo estilo usando una sola hoja de estilos separada en un archivo .css, y reducir la complejidad y la repetición de código en la estructura del documento.

 

 

 

 

 

 

 

 

 

 

 

 

Conclusión

Las interfaces básicas de usuario son aquellas que incluyen cosas como menús, ventanas, teclado, ratón, los beeps y algunos otros sonidos que la computadora hace, en general, todos aquellos canales por los cuales se permite la comunicación entre el ser humano y la computadora. El del usuario, el del programador y el del diseñador. Cada uno tiene un modelo mental propio de la interfaz, que contiene los conceptos y expectativas acerca de la misma, desarrollados a través de su experiencia.

Los principios de las interfaces de usuario que abarcan la familiaridad del usuario, la uniformidad, la mínima sorpresa, la recuperabilidad, la guía al usuario y la diversidad de usuarios ayuda a guiar y diseño de las interfaces de usuario. Los estilos de interacción con un sistema software incluyen la manipulación directa, los sistemas de menús, el rellenado de formularios, los lenguajes de comandos y el lenguaje natural.

Antes de abordar el proceso de diseño de interfaz del usuario se deben tratar algunas consideraciones en el diseño que tienen que ser tomados en cuenta por los diseñadores de interfaces de usuarios como lo es la interacción del usuario y presentación de la información. El proceso de diseño de la interfaz de usuario incluye subprocesos relacionados con el análisis, el prototipado de las interfaz y la evaluación de está.