Cómo simular mágicamente sitios web con capturas de pantalla

No es necesario ser un diseñador profesional para Bosquejo sitios web. Eso es porque las maquetas no se tratan de diseño. Se trata de comunicar sus ideas y recopilar los comentarios que tendrán el mayor impacto. El pulido y los colores llamativos no son lo que estamos buscando. Queremos grandes ideas. Con esto en mente, las capturas de pantalla ofrecen una manera rápida y fácil de crear maquetas exitosas y comunicar sus ideas. A continuación, le explicaré cómo hacer esto usando mi herramienta de captura de pantalla favorita, Snagit. Si no lo tiene, puede descargar una versión de prueba gratuita.

Encuentra un punto de partida

No empieces de cero. Ya hay muchos ejemplos excelentes flotando en la web y si miras lo suficiente, es probable que encuentres uno que sea similar al diseño que estás tratando de crear. Cuando encuentre el ejemplo correcto, capture todo. No se preocupe si no combina perfectamente, ya que lo agregaremos al diseño y lo personalizaremos más adelante. Si no está seguro de cómo capturar una página web completa, incluidas las partes que requieren desplazamiento, consulte nuestro tutorial Captura de desplazamiento.

https://techsmith-13.wistia.com/medias/xmgoc1yeav?embedType=async&videoFoam=true&videoWidth=640

Capture el resto de la idea

A continuación, busque otras páginas que le gusten y capture las partes de la maqueta que no incluyó la captura original. Por ejemplo, me gustaría tener una suscripción por correo electrónico para recibir un boletín mensual y una opción de inicio de sesión que forma parte de la barra de navegación superior. Tenga en cuenta que no debe preocuparse por cosas como los colores y las fuentes en este momento. Concéntrese en encontrar ejemplos concretos de las ideas y la funcionalidad que desea crear. Al hacer una captura, seleccione exactamente lo que necesita con la mira de Snagit, luego use la lupa para perfeccionar la captura.

Snagit captura el punto de mira seleccionando un formulario de registro de correo electrónico.

Si captura demasiado o desea realizar cambios en su captura, use las herramientas de edición de Snagit. Por ejemplo, utilice la herramienta de selección para eliminar objetos adicionales y rellenar automáticamente el fondo para que parezca que los objetos nunca estuvieron allí. O utilice el recorte para refinar el tamaño y la forma de su captura.

https://techsmith-13.wistia.com/medias/r2rkorgo9h?embedType=async&videoFoam=true&videoWidth=640

Reunirlo todo

Con todas las partes de su maqueta capturadas, júntelas en el editor de Snagit. Comience seleccionando la captura de página completa inicial. Luego, arrastre y suelte las capturas de la bandeja de capturas recientes directamente en la parte superior de la captura de página completa. Desde allí, puede hacer clic y arrastrar para reorganizar las capturas y colocarlas para que se ajusten al diseño que desee.

Arrastrar imágenes de la bandeja de capturas recientes al lienzo

Personaliza el diseño

Cuando se sienta cómodo con su diseño, es hora de personalizar el diseño. Comience haciendo clic derecho en su maqueta y eligiendo «Aplanar todo». Esto combina todas las imágenes en una, lo que facilitará la edición de los detalles más finos. A continuación, seleccione la herramienta de movimiento y elija la opción «Movimiento inteligente» para que todo sea editable por arte de magia (no es realmente mágico, utiliza Tecnologías OCR). Con Smart Move habilitado, puede eliminar objetos adicionales, cambiar el texto y ajustar la posición de casi cualquier cosa.

https://techsmith-13.wistia.com/medias/5yz82p43st?embedType=async&videoFoam=true&videoWidth=640

Para agregar esos toques finales, use la herramienta Bote de pintura para combinar colores, la herramienta Texto para agregar texto y la herramienta Forma para completar cualquier idea de diseño. Para obtener más información sobre la edición en Snagit, consulte estos tutoriales.

Reciba retroalimentación

Con su maqueta terminada, es hora de recibir comentarios. Utilice las salidas compartidas para enviar rápidamente su maqueta a un colega. Si la persona también tiene Snagit, puede agregar rápidamente leyendas, flechas y usar Smart Move para proporcionar sus comentarios.

Las capturas de pantalla son excelentes para las maquetas de sitios web, pero también funcionan para otros tipos de maquetas, incluidas las interfaces de usuario de software. Si tiene alguna pregunta o comentario, no dude en dejarlos a continuación.

Cómo simular mágicamente sitios web con capturas de pantalla

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *