Mockup de portátil

Mockup de portátil

Dale a tu interfaz un entorno para la presentación. Añade una captura de pantalla y una referencia de portátil; después, describe la escena y el ajuste de la pantalla. Virse crea un mockup estático de portátil para un portfolio, una presentación de producto o una revisión de diseño.

Mockup de portátil

Demo interactiva próximamente

¿Qué es un mockup de portátil?

Una maqueta de portátil muestra una captura de pantalla de un sitio web o una aplicación existente dentro de la pantalla de un portátil. Virse utiliza tu captura de pantalla, la referencia del dispositivo y las notas de la escena para crear una imagen estática para un porfolio, una presentación o una revisión de diseño.

An existing website screenshot presented on a laptop screen
Una captura de pantalla de un sitio web existente presentada en la pantalla de un portátil

¿Por qué usar Virse para una presentación de pantalla de portátil?

Empieza con la interfaz que necesitas explicar y, después, dale un dispositivo y un entorno.

A supplied application screenshot shown within a laptop display
Entrada de captura de pantalla

Usa una interfaz existente

Proporciona la vista de la página web o de la aplicación que quieres presentar. La captura de pantalla es la fuente del contenido de la pantalla del portátil.

A laptop screen preview with the main interface area in view
Ajuste y recorte

Explica el ajuste de la pantalla

Indica si debe aparecer toda la captura de pantalla o qué área es la más importante. Revisa el resultado para comprobar el recorte y que la presentación no pierda contenido esencial de la interfaz.

A laptop displaying a website in a simple desk setting
Referencia de dispositivo

Adapta el entorno de presentación

Añade una referencia de portátil y describe un escritorio u otro entorno de visualización. Usa una escena sencilla cuando la pantalla necesite captar la mayor parte de la atención.

Cómo crear un mockup de portátil

  1. Prepara la captura de pantalla

    Captura la vista del sitio web o de la aplicación que necesitas. Usa el estado exacto de la interfaz que quieres presentar.

  2. Añade el briefing del portátil y la escena

    Proporciona una referencia de portátil y describe el entorno. Explica cómo debe encajar la captura de pantalla, incluida cualquier preferencia de recorte.

  3. Genera la vista previa de la pantalla

    Crea una imagen estática de la captura de pantalla proporcionada dentro de la pantalla del portátil.

  4. Revisa los detalles de la interfaz

    Compara el texto, los iconos, las proporciones de la pantalla y el contenido visible con la captura de pantalla original. Comprueba el aspecto del dispositivo antes de usar la imagen.

¿Quién usa mockups de portátil?

Para equipos que presentan una interfaz que ya existe como captura de pantalla.

A web designer presenting a completed site on a laptop

Diseñadores web

Presenta una página web terminada en un portátil durante una revisión con el cliente o en un caso práctico.

An application dashboard displayed on a laptop screen

Diseñadores de producto

Muestra un panel específico o un estado de la aplicación en un entorno de dispositivo.

A product screenshot prepared for a software presentation

Equipos de marketing de software

Usa una presentación de captura de pantalla revisada para explicar el producto en una propuesta.

A website template shown on an open laptop

Vendedores de plantillas de sitios web

Presenta el aspecto de una plantilla de escritorio existente en una imagen de producto.

Casos de uso de mockups de portátil

Website Portfolio Image: present a completed desktop page on a laptop
Imagen de portfolio de sitio web: presenta una página de escritorio completada en un portátil
SaaS Dashboard Pitch: show an existing product view in a device setting
Presentación de panel de control SaaS: muestra una vista de producto existente en un entorno de dispositivo
Client Design Review: give reviewers a contextual image of the approved interface state
Revisión de diseño con cliente: ofrece a los revisores una imagen contextual del estado aprobado de la interfaz
Template Product Preview: display a finished website template on a screen
Vista previa de producto de plantilla: muestra una plantilla de sitio web terminada en una pantalla
Product Announcement Visual: present a screenshot of an already designed feature
Visual de anuncio de producto: presenta una captura de pantalla de una función ya diseñada
Case Study Presentation: place an interface image in the setting used to explain the project
Presentación de caso de estudio: coloca una imagen de interfaz en el entorno utilizado para explicar el proyecto

Preguntas frecuentes

¿Puedo usar una captura de pantalla de un sitio web existente?
Sí. Añade una captura de pantalla de la vista de la página que quieres mostrar. Este flujo de trabajo utiliza la imagen proporcionada como contenido de la pantalla.
¿Puedo usar una captura de pantalla de una app o un panel de control?
Sí. Proporciona la imagen de la interfaz completada y una referencia de portátil. Revisa cuidadosamente el texto pequeño, los gráficos y los iconos en el resultado generado.
¿Cómo encajará mi captura de pantalla en la pantalla del portátil?
Describe si quieres que se vea toda la imagen o que se destaque un área concreta. Usa una captura de pantalla con proporciones adecuadas y comprueba que el resultado no tenga recortes no deseados.
¿Puedo pegar una URL de sitio web en lugar de una captura de pantalla?
Proporciona una captura de pantalla de la página que quieres mostrar. Este flujo de trabajo utiliza una imagen existente del sitio web o de la app como contenido de la pantalla.
¿El resultado será un sitio web interactivo o un prototipo?
No. Es una imagen de presentación estática. El sitio web, la aplicación y las interacciones permanecen separados del mockup.
¿Puedo crear un vídeo de la pantalla del portátil?
No. El resultado es una imagen estática. Usa un flujo de trabajo de vídeo adecuado si tu presentación necesita movimiento o una interacción grabada.

Pon tu interfaz en la pantalla de un portátil

Añade la captura de pantalla y una referencia del dispositivo. Crea una imagen de presentación en un portátil para tu próxima propuesta o actualización de portfolio.