Como hacer un alambre

Decidir qué elementos va a estar presente en su diseño. Los elementos comunes a incluir son: navegación, áreas de contenido, widgets o cajas de función, las imágenes y los botones. Un ejemplo de una lista que podría hacer que incluiría navegación, regulador de la imagen, cajas de introducción, iconos de redes sociales, noticias de enlaces a artículos y un derecho de autor / pie de página

Determinar el ancho de su diseño que desea empezar. dimensiones del diseño estándar son 960, 980 px y 1020px, sino un beneficio del alambre es que le permite experimentar con la escala de sus elementos hasta que todo se ve bien.

Elija un método para la creación de su estructura metálica. La creación de una estructura metálica con la mano puede ser el más fácil, pero puede no traducirse bien en un archivo digital que puede ser utilizado como un modelo preciso para su compuesto. Los programas de software como Adobe Photoshop, Illustrator o InDesign no son realmente óptima para la creación de wireframes tampoco, pero sí asegurar la máxima compatibilidad con su diseño compuesto o real. Su última opción es utilizar una herramienta wireframing, varios de los cuales permiten la colaboración y la exportación para diseñar formatos amigables.

Crear un nuevo documento que es al menos 1680px de ancho y 980 px de alto. Usted será capaz de imaginar cómo su diseño y su escala se verá cuando se presenta en un navegador web, si su área de trabajo es mayor que su diseño. Cuando dibujo a mano, use papel de la red, si es posible, donde uno cuadrado es igual a 10 píxeles. Sin una rejilla, convertir una pulgada a 100 píxeles.

Comience por la creación de un rectángulo centrado usando la anchura y la altura de sus dimensiones del diseño de partida, que actuarán como su marco inicial. Dibuje cada elemento en las posiciones deseadas mediante el uso de formas y tonos de gris simples. Si el uso de software, la interfaz de usuario de carcasa y kits de gráficos son útiles en esta etapa, que le proporciona elementos estándar se pueden colocar dentro de su estructura metálica, tales como iconos, cuadros de texto, barras de búsqueda, menús y así sucesivamente.

Etiqueta de cada elemento claramente con letra clara o un tipo de letra sans-serif. Si desea incluir las dimensiones, hacerlo a través de un color línea de puntos fuera de la luz del elemento y asegúrese de que el elemento representa los píxeles etiquetados con precisión.

Añadir notas de diseño en los márgenes o mantenerlos en un archivo separado para presentar junto con el alambre. Sus notas de diseño podrían incluir ideas relacionadas con el color, la funcionalidad, o propósito de elementos dentro de la estructura metálica. Si se utiliza un programa de software, asegúrese de que las notas son discretos y claramente se refieren a los elementos etiquetados por nombre o número.

Guarde el archivo como un archivo JPG para una máxima compatibilidad con cualquier software de su cliente puede utilizar para visualizarla. Si se utiliza un software que soporta capas, guardar una copia en capas por sí mismo para que pueda editar fácilmente los elementos más tarde, o utilizar este alambre de nuevo como una plantilla para otro proyecto. Si usted dibujó el alambre con la mano, tendrá que escanear la imagen y cambiar su tamaño para ajustarse a la representación exacta de las dimensiones que ha establecido.

Comience creando sus principales dimensiones del diseño, que actuarán como su marco principal. La mayoría del software de alambre viene con tamaños de diseño estándar para elegir. Utilice un fondo de color o transparente a la luz.

Arrastrar y soltar o añadir elementos de las bibliotecas suministradas dentro de la herramienta. Cosas a tener en cuenta son el espacio en blanco, el flujo de contenido y la experiencia del usuario previsto. Se puede ajustar la escala y el tamaño de los elementos en estas herramientas arrastrando sus tiradores dimensión.

Etiqueta de cada elemento claramente haciendo clic en el texto de la etiqueta dentro de cada elemento y escribiendo un nombre o número. Si desea incluir las dimensiones, hacerlo a través de un color línea de puntos fuera de la luz del elemento y asegúrese de que el elemento representa los píxeles etiquetados con precisión. Algunas herramientas wireframing va a hacer esto de forma automática.

Añadir notas de diseño correspondientes a cada elemento en los márgenes o en un documento separado. Sus notas de diseño podrían incluir ideas relacionadas con el color, la funcionalidad, o propósito de elementos dentro de la estructura metálica. Si se utiliza un programa de software, asegúrese de que las notas son discretos y claramente se refieren a los elementos etiquetados por nombre o número.

Exportación o guardar el archivo en formato PDF o JPG para que el cliente pueda ver fácilmente. Si su herramienta de alambre elegido apoya la colaboración, es una buena idea invitar a su cliente que entrar y dejar comentarios.