En aquesta secció, aprendràs a crear el teu primer marc a Figma, un pas fonamental per començar a dissenyar qualsevol projecte. Els marcs són essencials perquè actuen com a contenidors per als elements del teu disseny, com ara formes, text i imatges. A més, els marcs et permeten organitzar i estructurar el teu treball de manera eficient.
Passos per Crear el Teu Primer Marc
- Obrir un Nou Projecte
- Inicia sessió a Figma: Si encara no ho has fet, inicia sessió al teu compte de Figma.
- Crea un nou fitxer: A la pàgina d'inici, fes clic a "New File" per començar un nou projecte.
- Comprendre l'Àrea de Treball
- Àrea de treball: És l'espai on crearàs i editaràs els teus dissenys.
- Panell de capes: A l'esquerra, trobaràs el panell de capes, que et permetrà gestionar els elements del teu disseny.
- Panell de propietats: A la dreta, veuràs el panell de propietats, on podràs ajustar les característiques dels elements seleccionats.
- Crear un Marc
- Selecciona l'eina de marc: A la barra d'eines superior, selecciona l'eina de marc (o prem la tecla de drecera "F").
- Dibuixa el marc: Fes clic i arrossega a l'àrea de treball per crear un marc. Pots ajustar la mida del marc arrossegant les cantonades o introduint dimensions específiques al panell de propietats.
- Configurar les Dimensions del Marc
- Dimensions personalitzades: Pots establir dimensions específiques per al teu marc al panell de propietats. Això és útil per a dissenys destinats a dispositius específics, com ara mòbils o tauletes.
- Presets de dispositius: Figma ofereix presets per a diferents dispositius. Pots seleccionar un preset des del menú desplegable al panell de propietats.
- Afegir Elements al Marc
- Formes: Utilitza l'eina de formes per afegir rectangles, cercles, línies, etc.
- Text: Selecciona l'eina de text per afegir text al teu marc.
- Imatges: Pots arrossegar i deixar anar imatges directament al marc des del teu ordinador.
Exercici Pràctic
Objectiu: Crea un marc per a una aplicació mòbil amb les dimensions de 375x812 píxels i afegeix un rectangle i un text al seu interior.
Passos:
- Crea un nou fitxer a Figma.
- Selecciona l'eina de marc i dibuixa un marc amb les dimensions de 375x812 píxels.
- Afegeix un rectangle al marc utilitzant l'eina de formes.
- Afegeix un text al rectangle que digui "Benvingut a la meva App".
Solució:
1. Inicia sessió a Figma i crea un nou fitxer. 2. Selecciona l'eina de marc (F) i dibuixa un marc de 375x812 píxels. 3. Selecciona l'eina de rectangle (R) i dibuixa un rectangle dins del marc. 4. Selecciona l'eina de text (T) i escriu "Benvingut a la meva App" dins del rectangle.
Conclusió
Has après a crear el teu primer marc a Figma, un pas essencial per començar a dissenyar. Ara pots afegir i organitzar elements dins del marc per donar vida als teus dissenys. En el següent tema, explorarem com treballar amb formes i text per enriquir els teus projectes.
Prototipatge amb Figma
Mòdul 1: Introducció a Figma
- Començant amb Figma
- Comprendre la Interfície de Figma
- Eines i Funcions Bàsiques
- Creant el Teu Primer Marc
Mòdul 2: Dissenyant a Figma
- Treballant amb Formes i Text
- Utilitzant Colors i Estils
- Creant i Gestionant Components
- Utilitzant Graelles i Dissenys
Mòdul 3: Tècniques de Prototipatge Intermedi
- Introducció al Prototipatge
- Creant Components Interactius
- Utilitzant Superposicions i Transicions
- Prototipatge amb Variants
Mòdul 4: Tècniques de Prototipatge Avançades
- Tècniques d'Animació Avançades
- Utilitzant Plugins de Figma per al Prototipatge
- Disseny Col·laboratiu i Feedback
- Proves i Iteració de Prototips