.

[TUTORIAL] Creare un Avatar OS Windows 7 con Swishmax

« Older   Newer »
 
  Share  
.
  1. .Mike
    Posted on 5/6/2013, 20:36
        +14   Like  
     
    .

    User deleted

    TUTORIAL AVATAR OS WINDOWS 7



    Risorse grafiche qui.



    1 Aprite SwishMax, create un nuovo progetto e ridimensionate a 250x400.

    2 Create dodici scene e chiamatele:
    Preload
    Accensione
    Desktop
    Menù
    Firefox
    Calcolatrice
    WMP
    WMP2
    Blocconote
    Credits
    Spegnimento
    Off


    PRELOAD

    Per fare la scena di preload seguite questo tutorial.

    ACCENSIONE

    1 Inserite una gif d'avvio.

    2 Inserite lo script in base alla durate della gif in frame (su swishmax, non i frame di photoshop).
    Per esempio la gif dura 109 frame:


    CODICE
    onFrame (109) {
       gotoSceneAndPlay("Desktop", 1);
    }


    DESKTOP

    (In questa scena, e in tutte quelle che seguono, nelle proprietà della scena ricordatevi sempre di selezionare la casella "Stop playng at end", non dimenticatelo perchè non lo ripeterò più xD).


    SPOILER (clicca per visualizzare)

    png


    1 Inserite l'immagine di sfondo e la barra in basso.

    2 Inserite l'immagine del tasto start.
    2.2 Nella outline cliccateci sopra con il tasto destro e fate "Convert > Convert to button".
    2.3 Sulla destra al centro ci sono le proprietà del bottone, dovete selezionare la casella "Has
    separate over state".
    2.4 Nella Outline espandete il bottone cliccando sul +, eliminate quello che c'è sotto la voce "Over
    State" e inserite l'immagine del pulsante start illuminato.


    SPOILER (clicca per visualizzare)

    png


    2.5 Inserite questo nello script del bottone:


    CODICE
    on (release) {
    gotoSceneAndPlay("Menù", 1);
    }

    3 Inserite l'immagine del tasto mostra desktop.
    3.2 Nella outline cliccateci sopra con il tasto destro e fate "Convert > Convert to button".
    3.3 Sulla destra al centro ci sono le proprietà del bottone, dovete selezionare la casella "Has
    separate over state".
    3.4 Nella Outline espandete il bottone cliccando sul + e eliminate quello che c'è sotto la voce "Over
    State" e inserite l'immagine del pulsante mostra desktop illuminato.
    3.5 Qui non dovete inserire nessuno script.

    4 Per creare l'orario create un testo "clock" del colore, font e dimensioni che volete.
    4.2 Nelle proprietà del testo cambiate da "Static" a "Dynamic", dove c'è scritto Var dovete scrivere
    "timenow" e se non è selezionato, selezionate "Use device font"


    SPOILER (clicca per visualizzare)

    png

    4.3 Nella Outline cliccate "clock" con il tasto destro, fate "Convert > Convert to movie clip" e rinominate il movie clip "time".
    4.4 Inserite questo nello script del movie clip:


    CODICE
    onFrame (1, afterPlacedObjectEvents) {
      thetime = new Date();
      thehour = thetime.getHours();
      theminute = thetime.getMinutes();
      thesecond = thetime.getSeconds();
      ampm = "am";
      if (thehour>12 !=0) {
          thehour -= 12;
          ampm = "pm";
      }
      if (thehour<10) {
          thehour = " "+thehour;
      }
      if (thehour > 12) {
          thehour = thehour-12;
      }
      if (theminute<10) {
          theminute = "0"+theminute;
      }
      if (thesecond<10) {
          thesecond = "0"+thesecond;
      }
      //variabili concatenate
      timenow = thehour+":"+theminute+":"+thesecond+" ";
    }
    onFrame (2, afterPlacedObjectEvents) {
      gotoAndPlay(1);
    }

    5 Per creare la data create un testo "full_date" del colore, font e dimensioni che volete.
    5.2 Nelle proprietà del testo cambiate da "Static a Dynamic", dove c'è scritto Var dovete scrivere
    "display" e se non è selezionato, selezionate "Use device font".
    5.3 Nella Outline cliccate "full_date" con il tasto destro e fate "Convert > Convert to movie clip" e
    rinominate il movie clip "date_".
    5.4 Inserite questo nello script del movie clip:


    CODICE
    onFrame (1, afterPlacedObjectEvents) {
      d = new Date();
      mon = new Array('01','02','03','04','05','06','07','08','09','10','11','12');
      day   = new Array('Domenica','Lunedì','Martedì','Mercoledì','Giovedì','Venerdì','Sabato');
      display = "  "+ d.getDate() +"/ "+ mon[d.getMonth()] + "/ " + d.getFullYear();
    }
    onFrame (2, afterPlacedObjectEvents) {
      prevFrameAndPlay();
    }


    MENU'

    1 Inserite l'immagine di sfondo, l'orario e la data (copiateli dalla scena precedente).

    2 inserite il pulsante start illuminato e mettetegli questo script:


    CODICE
    on (release) {
    gotoSceneAndPlay("Desktop", 1);
    }

    3 Inserite il pulsante mostra desktop (potete copiarlo dalla scena di prima) e mettetegli questo
    script:


    CODICE
    on (release) {
    gotoSceneAndPlay("Desktop", 1);
    }

    4 Inserite l'immagine del menù, tutte le icone, le scritte accanto alle icone e il pulsante Arresta
    il sistema.

    5 Convertite una ad una tutte le icone in bottoni.

    6 (opzionale) Se volete, nelle proprietà del bottone di tutte le icone, selezionate la casella "has
    separate over state" e nell'over state, nella outline, oltre all'icona che è già presente potete inserire
    una striscia colorata che sarà visibile al passaggio del mouse sull'icona.


    SPOILER (clicca per visualizzare)

    png


    7 Inserite questo nello script delle rispettive icone:

    Firefox


    CODICE
    on (release) {
    gotoSceneAndPlay("Firefox", 1);
    }

    Calcolatrice


    CODICE
    on (release) {
    gotoSceneAndPlay("Calcolatrice", 1);
    }

    Windows Media Player


    CODICE
    on (release) {
    gotoSceneAndPlay("WMP", 1);
    }

    Blocco note


    CODICE
    on (release) {
    gotoSceneAndPlay("Blocconote", 1);
    }

    Credits


    CODICE
    on (release) {
    gotoSceneAndPlay("Credits", 1);
    }

    Arresta il sistema


    CODICE
    on (release) {
    gotoSceneAndPlay("Spegnimento", 1);
    }


    FIREFOX

    1 Inserite lo sfondo, l'orario, la data, la barra, il pulsante start (copiate quello della scena
    DESKTOP) e il pulsante mostra desktop (copiatelo dalla scena MENU').

    2 Inserite la finestra di internet con dentro un immagine o scritta tipo errore 404 o connessione non
    disponibile.

    3 Inserite l'immagine del pulsante X e convertitela in bottone, mettetegli questo script:


    CODICE
    on (release) {
    gotoSceneAndPlay("Desktop", 1);
    }

    4 Nelle proprietà selezionate la casella "Has separate over state" e nella outline, sotto over state,
    eliminate l'immagine che già c'è e inserite quella del pulsante X illuminato.




    Apro una piccola parentesi per dirvi come dare la possibilità di trascinare le finestre tenendo cliccato sulla barra. (Faccio l'esempio con la finestra di Firefox ma il procedimento è uguale con tutte le altre.)

    1 Nella Outline, evidenziate tutto ciò che riguarda la finestra di Firefox: l'immagine della finestra, il pulsante X, l'imagine nella finestra ed eventuali altre cose. NON dovete selezionare lo sfondo, la barra, il pulsante start ecc.

    2 Una volta selezionati quegli oggetti fate tasto destro > Grouping > Grouping as movie clip.

    3 Aprite Photoshop e create un immagine "trasparente" delle dimensioni che volete, ad esempio 100x100
    e ovviamente salvatela in png.


    SPOILER (clicca per visualizzare)

    png


    4 Caricate quell'immagine trasparente nel movie clip appena creato e adattatela alle dimensioni della barra.


    SPOILER (clicca per visualizzare)

    png


    5 Inserite questo nello script dell'immagine trasparente:


    CODICE
    onSelfEvent (press) {    
          _parent.startDrag(false);
    }
    onSelfEvent (release) {
           stopDrag();
    }




    CALCOLATRICE

    1 Inserite lo sfondo, l'orario, la data, la barra, il pulsante start e il pulsante mostra desktop (potete copiare tutto dalla scena precedente).

    2 Inserite l'immagine della finestra.

    3 Inserite l'immagine del pulsante X e convertitela in bottone, mettetegli questo script:


    CODICE
    on (release) {
    gotoSceneAndPlay("Desktop", 1);
    }

    4 Nelle proprietà selezionate la casella "Has separate over state" e nella outline, sotto over state,
    eliminate l'immagine che già c'è e inserite quella del pulsante X illuminato (questo dovete farlo ad
    ogni finestra, compresi i pulsanti play/stop del WMP).

    5 Aprite la calcolatrice, copiate il movie clip "Calc", incollate nella scena della calcolatrice e
    ridimensionatelo per adattarlo alla finestra (se la finestra di Debug vi da una lista di errori come
    "WARNING: The dynamic/input text object containing the text 'M+' should have a name" non
    preoccupatevi).

    WINDOWS MEDIA PLAYER

    1 Inserite lo sfondo, l'orario, la data, la barra, il pulsante start e il pulsante mostra desktop.

    2 Inserite la finestra del WMP e caricate la canzone che volete usare.

    3 Inserite il pulsante X, convertitelo in bottone e mettete questo script:


    CODICE
    on (release) {
    gotoSceneAndPlay("Desktop", 1);
    }

    4 Inserite il pulsante play, convertitelo in bottone e mettete questo script:


    CODICE
    on (press) {
       playSound("nome-canzone",true);
    }
    onSelfEvent (release) {
    gotoSceneAndPlay("WMP2", 1);
    }


    WINDOWS MEDIA PLAYER 2

    1 Copiate tutto quello che c'è nella scena precedente, eccetto il bottone play, e incollatelo in
    questa scena. Cambiate lo script del pulsante X e del pulsante mostra desktop in:


    CODICE
    on (press) {
       stopAllSounds();
    }
    onSelfEvent (release) {
       gotoSceneAndPlay("Desktop", 1);
    }

    e lo script del pulsante start in:


    CODICE
    on (press) {
       stopAllSounds();
    }
    onSelfEvent (release) {
       gotoSceneAndPlay("Menù", 1);
    }

    2 Inserite il pulsante stop con questo script:


    CODICE
    on (press) {  
       stopAllSounds();
    }
    onSelfEvent (release) {
       gotoSceneAndPlay("WMP", 1);
    }


    BLOCCO NOTE

    1 Inserite lo sfondo, l'orario, la data, la barra, il pulsante start e il pulsante mostra desktop.

    2 Inserite l'immagine della finestra con il pulsante X.

    3 Create un livello di testo, nelle proprietà del testo selezionate "Input" e per adattarlo alle dimensioni della finestra deselezionate "Auto-size height".


    SPOILER (clicca per visualizzare)

    png



    CREDITS

    1 Inserite lo sfondo, l'orario, la data, la barra, il pulsante start e il pulsante mostra desktop.

    2 Inserite l'immagine della finestra con il pulsante X.

    3 Scrivete qualcosa tipo avatar realizzato da...

    SPEGNIMENTO

    1 Inserite un'immagine a piacere e se volete una scritta o una gif.

    2 Fate durare la scena poco tempo (anche in base alla lunghezza della gif, se la inserite), per esempio 50 frame (circa 2 secondi). Quindi lo script sarà:


    CODICE
    onFrame (50) {
       gotoSceneAndPlay("Off", 1);
    }


    OFF

    1 Inserite un'immagine o una texture come sfondo e personalizzatelo come volete.

    2 Inserite un bottone per l'accensione con questo script:


    CODICE
    on (release) {
       gotoSceneAndPlay("Accensione", 1);
    }

    @World Archive |RIPRODUZIONE RISERVATA ©
    .Mike



    Edited by .Mike - 15/6/2013, 11:30
     
    .
  2. CiaoXD0
    Posted on 5/6/2013, 20:57
        +2   Like  
     
    .
    Avatar

    wa-ninja

    Group
    WA Club
    Posts
    185

    Status
    Offline
    Grazie doma ci provo!! :dsffgg: :dsffgg:

    Mi sei stato di grande aiuto grazie!! :D
     
    .
  3. .Mike
    Posted on 5/6/2013, 21:00
        Like  
     
    .

    User deleted
    Figurati ^^
     
    .
  4. .Eren
    Posted on 5/6/2013, 21:11
        +2   Like  
     
    .

    User deleted
    Grazie mille Mike! xD
     
    .
  5. .Mike
    Posted on 5/6/2013, 21:14
        Like  
     
    .

    User deleted
    Prego :D
     
    .
  6. Athias
    Posted on 5/6/2013, 21:15
        +3   Like  
     
    .
    Avatar

    (╯°□°）╯︵ ┻━┻

    Group
    Membro Onorario
    Posts
    15,142
    Location
    (⊙_◎)

    Status
    Offline
    FABULOUS **
    Web
     
    .
  7. Chry96™
    Posted on 5/6/2013, 21:36
        +1   Like  
     
    .
    AVATAR_DEFAULT


    Group
    WA Club
    Posts
    1,378
    Location
    World Archive

    Status
    Offline
    Grazie lo leggo domani con calma ^_^
     
    .
  8. Kira-dn
    Posted on 5/6/2013, 21:59
        +1   Like  
     
    .
    Avatar

    Sono il pazzo tra i pazzi
    In questi strani palazzi
    Che hanno piani infiniti
    Ma che sono crollati.

    Group
    Membro Onorario
    Posts
    21,540
    Location
    World Archive

    Status
    Offline
    Ottimo. ò.ò
     
    .
  9. ¬S a s u k e™
    Posted on 5/6/2013, 22:04
        +1   Like  
     
    .

    User deleted
    Guida perfetta e dettagliata :D
    ben fatto Mike (;
     
    .
  10. tensa zangetsu*
    Posted on 10/6/2013, 22:57
        +1   Like  
     
    .


    Group
    WA Club
    Posts
    476
    Location
    soul society

    Status
    Offline
    Grazie mille .Mike :D :D :D :D era da tanto che aspettavo questa guida domani mi metto a lavoro :lol: :lol:
     
    .
  11. Monkey D. Luis
    Posted on 15/6/2013, 10:24
        +1   Like  
     
    .
    AVATAR_DEFAULT

    “ Ci sono cose che non si possono fermare: la volontà ereditata, i sogni della gente, lo scorrere del tempo. Finché le persone avranno sete di libertà, queste cose dureranno per sempre. ” — Gol D. Roger

    Group
    WA Club
    Posts
    97
    Location
    Sicilia

    Status
    Offline
    Bellissima guida .Mike, ma perchè mi dà errore nello script del movie clip "date_"?? Mi da errore su prevFrameAndPlay();
     
    .
  12. .Mike
    Posted on 15/6/2013, 10:32
        Like  
     
    .

    User deleted
    CITAZIONE (Luigi_23 @ 15/6/2013, 11:24) 
    Bellissima guida .Mike, ma perchè mi dà errore nello script del movie clip "date_"?? Mi da errore su prevFrameAndPlay();

    Controlla se alla fine dello script hai chiuso la parentesi graffa :)
    CODICE
    }
     
    .
  13. Monkey D. Luis
    Posted on 15/6/2013, 10:33
        Like  
     
    .
    AVATAR_DEFAULT

    “ Ci sono cose che non si possono fermare: la volontà ereditata, i sogni della gente, lo scorrere del tempo. Finché le persone avranno sete di libertà, queste cose dureranno per sempre. ” — Gol D. Roger

    Group
    WA Club
    Posts
    97
    Location
    Sicilia

    Status
    Offline
    CITAZIONE (.Mike @ 15/6/2013, 11:32) 
    CITAZIONE (Luigi_23 @ 15/6/2013, 11:24) 
    Bellissima guida .Mike, ma perchè mi dà errore nello script del movie clip "date_"?? Mi da errore su prevFrameAndPlay();

    Controlla se alla fine dello script hai chiuso la parentesi graffa :)
    CODICE
    }

    Fatto grazie ancora :)
     
    .
  14. Chry96™
    Posted on 15/6/2013, 10:34
        Like  
     
    .
    AVATAR_DEFAULT


    Group
    WA Club
    Posts
    1,378
    Location
    World Archive

    Status
    Offline
    CITAZIONE (Luigi_23 @ 15/6/2013, 11:24) 
    Bellissima guida .Mike, ma perchè mi dà errore nello script del movie clip "date_"?? Mi da errore su prevFrameAndPlay();

    Basta che aggiungi la parentesi graffa chiusa al rigo sotto per metterla basta che fai ''ctrl+shift+alt+]'' ;)
    Spero di esserti stato d'aiuto ^_^
     
    .
  15. Kuro_neko
    Posted on 2/9/2013, 14:55
        Like  
     
    .
    Avatar

    -Where is the hope in a world so cold?-

    Group
    WA Club
    Posts
    9,897
    Location
    Da una notte stellata

    Status
    Anonymous
    grazie 1000 mi è stato molto ^_^ però ho un problema, tutte le scritte delle icone me diventano uguali, cosa faccio?
     
    .
20 replies since 5/6/2013, 20:36   1329 views
  Share  
.
 
.
Tutorial
Create your forum and your blog! · Top Forum · Categories · Help · Status · Contacts · Powered by ForumCommunity