giovedì 30 novembre 2017

Parte1 lez 17/11

Nella lezione di Venerdì 17/11 è stato ripreso il concetto di blog, inteso come piattaforma accessibile a tutti.Infatti non servono specifiche capacità informatiche per accedervi  e  consultarne le pagine .E' diviso in FRONT( fronte, facciata) e BACKHAND(rovescio, parte nascosta). La prima  dedicata a coloro che leggono il blog,la seconda quella da cui verranno postati i contenuti e apportate le modifiche da parte del ideatore del sito.

- PROGETTAZIONE WEB:
il project manager è una figura professionale che si basa sulla conoscenza della progettazione in diversi ambiti.
Una progettazione web perché sia efficace deve essere pianificata dettagliatamente, tenendo conto di tutti gli ostacoli che si possono incontrare durante il percorso.E' necessario quindi fare una stima della durata del progetto il quanto più dettagliata possibile cercando di rispettarne i termini.

-MODELLO PROGETTAZIONE A CASCATA :

DEF REQUISITI
                    DEF STRUTTURA
                                                 WEB DESIGN
                                                                     VISUAL DESIGN
                                                                                                SVILUPPO
                                                                                                               CONTENUTI
                                                                                                                                    GESTIONE


consiste nel pianificare una lista di  punti che definiranno l intero progetto. Essi andranno a creare una sorta di catena in cui ogni input verrà trasformato in output e viceversa rendendo difficile con il proseguire del progetto la modifica di punti posti in precedenza.
In maniera particolare ci si dovrà soffermare sul primo punto in quanto rappresenta la parte la di definizione generale e di accordo tra le parti che contribuiscono alla creazione del sito.

1.DEFINIZIONE DEI REQUISITI:
Consiste nella definizione e scopo del sito.In questa prima parte il project manager si incontrerà con il web desiner  per stabilire l'organizzazione delle tempistiche, degli obiettivi, del target e dei contenuti.

2.DEFINIZIONE DELLA STRUTTURA:
Sarà utile disegnare un diagramma ad albero per avere più chiaro quali dovranno essere la HOME e gli altri punti principali del sito.Definire principalmente i servizi, il  web design e una eventuale pagina dedicata all prenotazione  o compravendita.


              ABOUT US                 ONLINE MARK                 CORPORATE WEB
HOME--SERVICES---------------WEB DESIGN----------------CUSTOM BOOKING SISTEM
              PROJECT                                                             E-COMMERCE WEB
              BLOG
              CONTACT   



3.WEB DESIGN:
 è la parte inerente la esteriore delle pagine, precedente la grafica.
ll web designer è colui che progetta la comunicazione visiva di un sito e crea le singole pagine web
Infatti dovremo immaginarci come vorremo fosse il nostro sito in via semi definitiva .Consiste nell' organizzazione topologica degli spazi, del menu, della home ,slideshow ecc. 
E' quindi un disegno schematico (wireframes) che dovremo fare per immaginarci il nostro sito, le sue pagine, sotto-pagine e la collocazione di ogni piccolo particolare.Possiamo farlo prendendo un foglio bianco oppure utilizzando programmi come Ninjamock,google drive,photoshop,indesign ecc..

4.VISUAL DESIGN
consiste nell' aspetto grafico finale.Come appunto il nostro sito dovrà essere in via definitiva(layout grafici,colori,spazi ecc...).

5.SVILUPPO:
si utilizzeranno programmi come  html,css,php,database ecc... è la parte più informatica e tecnica della progettazione.

6.REDAZIONE CONTENUTI:
 saranno definiti e creati i contenuti effettivi del sito(immagini,post didascalie,contatti ,link ecc..)

7.GOLIVE E GESTIONE:
la gestione del sito varia a seconda della tipo di sito che andremo a creare.Ad esempio grandi e-commerce come amazon gestiscono il sito apportando piccole modifiche costantemente in modo da presentare sempre il sito in maniera ottimale.


martedì 28 novembre 2017

Strumenti di selezione

Guida Gimp: https://docs.gimp.org/it/gimp-tools-selection.html

Le immagini sono piatte e sono sullo stesso piano.
Ogni oggetto può essere selezionato, modellato e manipolato in maniera autonoma attraverso la selezione in maniera ellittica o circolare o a lazzo.
Procedura:
Seleziono l’esatto perimetro,  prendo l’oggetto rendendolo autonomo e manipolabile, lo taglio e  lo copio e lo incollo su un altro livello e quindi non sullo sfondo.
Allora:
Modifica copia e modifica incolla come nuovo livello incollando l’oggetto e quindi ora compaiono due livelli. 
L’articolazione è a livelli o strati che compaiono su un pannello: quello più in alto è il primo livello che è possibile accendere e spegnere o rinominare.
E’ possibile spostare l’elemento selezionandolo e spostandolo con le 4 frecce.
Si può duplicare il livello con duplica livello.
Si può selezionare anche a lazzo (o mano libera). Questa selezione permette di creare un contorno a piacere o anche facendo click e trascinando quindi scontorno e copio e incollo come nuovo livello.
Un oggetto può essere incollato anche al contrario con l’impostazione rifletti.

mercoledì 22 novembre 2017

Come aprire e salvare un file GIMP

1) Apro GIMP : ( sarà visualizzato da 3 colonne principali che disponiamo sullo schermo a nostro piacimento, nel caso in qui una colonna ci dovesse scomparire attraverso "finestre" ---> "chiuse recentemente" avremo modo di ritrovarla.

2) Creare file : per la creazione di un nuovo file basterà cliccare "file" ---> "nuova", ci chiederà la dimensione dell'immagine in pixel, per scegliere la dimensione giusta bisogna capire quanta risoluzione ha il nostro pc, per una pagina web scegliamo 1000 pixel di larghezza, l'altezza non ci interessa più di tanto, metteremo 2000. Ci verrà chiesta anche la "densità" che sarà 72 per i computer e lo "spazio colore" in cui adotteremo il classico RGB (red blue green) SI CREA L'IMMAGINE.

3) Finito il lavoro grafico dovrò salvare l'immagine, ---> File ---> "salva immagine", per poter modificare il nostro lavoro in futuro bisognerà salvarlo nel suo formato nativo, cioè " XCF ", gli do un nome e lo vado a salvare in cartella.
NB : senza GIMP non lo si può vedere, per farlo vedere a qualcuno che non dispone di GIMP bisognerà salvarlo in formato JPG o simili, il modo più corretto in GIMP è ---> esporta ---> seleziona tipo di file ---> JPG ---> qualità .

venerdì 17 novembre 2017

GIMP info e download

Guida di GIMP

http://docs.gimp.org/it/


Scaricare GIMP

https://www.gimp.org/downloads/



Esercizio selezioni

Ciao,

vi spiego a lezione :-)

File per gimp:

File per photoshop:

Tool Free per i wireframe

https://ninjamock.com/

Articoli sui wireframe

Wireframe, tutto in questi articoli:

http://en.wikipedia.org/wiki/Website_wireframe

http://www.davidepaterniti.com/cosa-sono-e-come-si-creano-i-wireframe/

http://www.html.it/pag/19182/mappe-dei-contenuti-e-wireframe/

http://www.gsite.ch/la-differenza-tra-wireframe-e-mockup/

http://www.sketchin.ch/it/tools/wireframing/

http://webdesign.html.it/articoli/leggi/3083/progettare-con-i-wireframe/

http://www.html.it/pag/14258/le-sezioni-logiche-di-una-pagina-web/

Indirizzi email

Ecco il file per inserimento dei vostri indirizzi email:
https://docs.google.com/spreadsheets/d/1VHQ4F80r_SNyaj7SJ6H2p3w59FYuLh5BAwQTICoeTNQ/edit#gid=0

 

martedì 7 novembre 2017

Una volta definito il brief si costruisce l'albero dei contenuti o del sito o web site tree o struttura. E' una rappresentazione grafica di come voglio articolare i contenuti, un'articolazione logica in funzione della comunicazione che voglio dare. 
Bisogna decidere quali differenze di contenuto mettere a primo livello, secondo e terzo: ciò che metto nel primo livello è più importante.