Efecto de página web prototipo de página web: ¿cómo utilizar AxureRP8 para crear un prototipo de página de inicio de sesión simple?

¿Cómo utilizar Mockplus para dibujar un prototipo web sencillo? Abra el software Mockplus, haga clic en Nuevo proyecto y seleccione el modo de página requerido, como teléfono móvil, tableta, página web, etc. Una vez seleccionado, puedes dibujar el prototipo.

2

En primer lugar, antes de dibujar, introduzcamos la barra de herramientas de Mockplus. Tiene componentes, interacción, extensión, diseño, movimiento, estática, anotación y otras funciones. Eche un vistazo y familiarícese con el uso de varias funciones;

Tres

Ahora, después de familiarizarnos con ellas, podemos dibujar un prototipo de una versión web simple.

Fin

Método/Paso 2

Primero use la herramienta de estructura alámbrica en el componente para arrastrar y soltar para formar el diseño general, luego edítelo en la estructura alámbrica y seleccione la fuente requerida, tamaño de color, grosor de estructura alámbrica, etc. , como se muestra en la figura siguiente;

En segundo lugar, use la función de extensión en el componente para dibujar el cuadro de búsqueda, el formulario y otras funciones que necesita; use la función de imagen para importar las imágenes requeridas para crear el diseño; más intuitivo; como se muestra a continuación Como se muestra; después de importar, también puede escalar el tamaño de la imagen a voluntad.

En tercer lugar, utilice las herramientas en el diseño para agregar funciones requeridas, como pestañas y cuadros de grupo, o edítelos;

En cuarto lugar, arrastre los componentes funcionales requeridos y edítelos. ¡Se dibuja el prototipo de la versión web!

¿Cuál es la diferencia entre los renders realizados por PS y los prototipos realizados por RP? Las representaciones realizadas por PS se utilizan para investigar las necesidades, cambiar con las necesidades e ilustrar las propiedades funcionales. Se pueden considerar como borradores.

Los prototipos creados por RP suelen ser imágenes de sitios web realizadas por artistas, y el sitio web directamente recortado básicamente se verá así.

¿Cómo utilizar AxureRP8 para construir un prototipo de una página de inicio de sesión simple? Cuando utilice AxureRP8 para construir un prototipo, debe mencionar el uso de bibliotecas de componentes. Para Axure, la biblioteca de componentes es en realidad equivalente hasta cierto punto a una barra de herramientas de diseño gráfico. Si desea construir un prototipo simple en la página, el uso de componentes en la biblioteca de componentes es esencial, al igual que construir un prototipo de bloque de construcción requiere bloques de construcción. Entonces, veamos cómo construir un prototipo simple usando componentes de la biblioteca de componentes. Los pasos específicos son los siguientes:

1, página. La posición de la esquina inferior izquierda de todo el eje es la posición de la página. En circunstancias normales, el sistema tiene por defecto tres páginas. Por supuesto, también puede copiar muchas páginas, hacer doble clic en la primera página y luego podremos crear un prototipo simple de la página actual.

2. Seleccione el elemento del rectángulo 2 en la biblioteca de componentes, arrástrelo al lienzo y dibuje el tamaño correspondiente según el tamaño que necesite. Aquí se selecciona el tamaño de 1920*1080, que también es el tamaño de resolución de la versión iPhone Plus. Puede realizar los ajustes correspondientes en la posición que se muestra en la imagen.

3. Seleccione un marcador de posición. Los marcadores de posición suelen representar la ubicación de la imagen dentro del prototipo. Aquí, los marcadores de posición se utilizan para representar información que aparece con frecuencia en las páginas de inicio de sesión, como los logotipos. Por supuesto, también puedes optar por utilizar imágenes si quieres hacerlo más bonito.

4. Seleccione el rectángulo 1 y el cuadro de texto para crear el efecto de visualización de la ubicación de inicio de sesión. Específicamente, haga doble clic en el elemento para editar el elemento rectangular. Aquí, elegimos establecer el rectángulo con la palabra iniciar sesión.

5. Haga clic en el componente mientras mantiene presionada la tecla Ctrl para copiar el componente. Específicamente, con este método, puede crear fácilmente un efecto de visualización de contraseña.

6. Crea un botón clave, el botón de inicio de sesión. Después de arrastrarlo, lo llamamos Iniciar sesión ahora. Específicamente, una vez completada la creación, presione F5 y haga clic en Publicar, para que podamos usar la página web para abrir nuestro prototipo y ver el efecto de visualización.

iv>