- Esamina i diversi componenti che puoi usare in App Inventor o Thunkable
- Trova un componente che possa aiutare la tua applicazione
- Cerca un tutorial e inserisci almeno un componente nella tua applicazione.
Queste sono le attività di questa lezione:
COMPONENTI PER SMARTPHONE
È il momento di scegliere e codificare i componenti, alcuni dei quali includono sensori, che vuoi utilizzare nella tua app. I vari componenti disponibili permetteranno alla tua app di fare molte cose diverse: assicurati di scegliere quelli che fanno al caso tuo!
Questa lezione è un riferimento per conoscere molti componenti che puoi utilizzare nella tua applicazione.
Probabilmente avrai già scelto la tua piattaforma, ma ti elencheremo tutti i componenti sia per App Inventor che per Thunkable, in modo che tu possa conoscere i componenti disponibili.
Cerca i componenti che puoi utilizzare per implementare le funzionalità che hai pianificato per la tua applicazione.
ELENCO DEI COMPONENTI PER CATEGORIA
I componenti che seguono vanno oltre quelli standard componenti dell'interfaccia utenteche permettono all'utente di interagire con l'applicazione.
Questo non è un elenco completo, ma copre la maggior parte dei componenti attualmente disponibili. Thunkable e App Inventor continuano ad aggiungere continuamente nuove funzionalità e componenti.
Le informazioni che seguono sono disponibili anche in questo documento.
Se la tua applicazione ha bisogno di funzioni legate a fotografie, audio e video, questi componenti ti saranno molto utili.
| Descrizione delle caratteristiche | App Inventor | Thunkable |
|---|---|---|
| Permette all'utente di registrare video. Puoi usarlo per le applicazioni social, per le applicazioni di condivisione video o in qualsiasi altro momento in cui desideri che il tuo utente registri un video. | Videocamera | Macchina fotografica |
| Permette all'utente di scattare foto. Questo può essere utile per le app che consentono agli utenti di impostare immagini del profilo o di scattare foto da condividere o salvare in una galleria. | Macchina fotografica | Macchina fotografica |
| Permette all'utente di scegliere un'immagine dalla propria libreria fotografica. Permette agli utenti di scegliere le foto che hanno scattato al di fuori dell'utilizzo della tua applicazione. | Raccoglitore di immagini | File (libreria fotografica) |
| Ti permette di incorporare un video nell'app su cui l'utente può cliccare. Il video deve essere un .wmv, .3gp o .mp4 e non deve essere più grande di 1MB. | VideoPlayer | Video |
| Permette di tradurre il testo in un'altra lingua. Richiede che la tua app abbia accesso a internet perché si affida a servizi di traduzione esterni. | Traduttore | Discorso |
| Permette all'utente di registrare un suono o un rumore. | Registratore di suoni | Suono |
| Questo componente audio riproduce un suono. Funziona meglio per i suoni "lunghi", come canzoni, discorsi o poesie. Thunkable ha un solo componente, Sound, per qualsiasi tipo di audio. | Giocatore | Suono |
| Molto simile al componente Player, ma è più indicato per suoni brevi, come i "ding" di notifica. | Suono | Suono |
| Traduce il parlato dell'utente in testo. Questo è particolarmente utile per le app che richiedono la possibilità di parlare a mani libere. | Riconoscitore vocale | Discorso |
| Questo componente fa il contrario di SpeechRecorder: permette agli utenti di inserire del testo e l'applicazione lo leggerà ad alta voce. | TextToSpeech | Discorso |
| Puoi far girare un'animazione JSON nella tua applicazione. | Non disponibile | Animazione |
Se hai bisogno che la tua app effettui telefonate, invii email, messaggi e condivida determinati tipi di informazioni, questi componenti sociali possono essere utili.
| Descrizione delle caratteristiche | App Inventor | Thunkable |
|---|---|---|
| Visualizza i contatti dell'utente e permette agli utenti di scegliere qualcuno dall'elenco. | Raccoglitore di contatti | Non disponibile |
| Permette all'utente di inserire un indirizzo e-mail dall'elenco dei contatti dell'utente. | Raccoglitore di e-mail | Non disponibile |
| Permette all'utente di scegliere un numero di telefono da un elenco di contatti. | Selezionatore di numeri di telefono | Non disponibile |
| Ti permette di incorporare un video nell'app su cui l'utente può cliccare. Il video deve essere un .wmv, .3gp o .mp4 e non deve essere più grande di 1MB. | VideoPlayer | Video |
| Permette all'utente di effettuare una telefonata dalla tua applicazione. | Chiamata telefonica | Condividi |
| Permette all'utente di inviare un messaggio di testo al telefono di un altro utente attraverso la tua applicazione. | Messaggi di testo | Condividi |
| Questo componente audio riproduce un suono. Funziona meglio per i suoni "lunghi", come canzoni, discorsi o poesie. Thunkable ha un solo componente, Sound, per qualsiasi tipo di audio. | Giocatore | Suono |
| Permette agli utenti di condividere messaggi, immagini o altri contenuti della tua app con altre applicazioni sul telefono dell'utente, come la posta elettronica e la messaggistica. | Condivisione | Condividi |
| Permette la comunicazione tra la tua app e Twitter. Gli utenti possono cercare i tweet, inviare e ricevere messaggi, ottenere un elenco di follower e altro ancora. | Non disponibile | |
| Thunkable ti permette di aggiungere annunci alla tua app. Tutte le app devono essere approvate da Thunkable prima di poter essere scaricate o pubblicate. | Non disponibile | Annunci |
Questi componenti permettono alla tua applicazione di interagire con entità esterne alla tua applicazione, come il web, i dispositivi e altre applicazioni.
| Descrizione delle caratteristiche | App Inventor | Thunkable |
|---|---|---|
| Permette alla tua applicazione di avviare altre applicazioni, come la Fotocamera o Google Maps, o le applicazioni create dall'utente installate sul telefono. | ActivityStarter | Aprire il link (Blocco di controllo) |
| Ti permette di incorporare una mappa nella tua applicazione. App Inventor include componenti come Marcatori e Forme che possono essere aggiunti a una mappa. Queste caratteristiche vengono aggiunte nel codice di Thunkable. | Mappe | Mappe |
| Permette agli utenti di visualizzare le pagine web all'interno della tua applicazione. | WebViewer | Visualizzatore web |
| Permette alla tua applicazione di inviare e ricevere informazioni da e verso siti web esterni. | Web | API web |
| Permette all'utente di effettuare una telefonata dalla tua applicazione. | Chiamata telefonica | Condividi |
| Questi componenti permettono alla tua applicazione di connettersi con i dispositivi Bluetooth. | Client Bluetooth, Server Bluetooth, BlueToothLE (estensione) | Bluetooth Low Energy |
| Questo componente audio riproduce un suono. Funziona meglio per i suoni "lunghi", come canzoni, discorsi o poesie. Thunkable ha un solo componente, Sound, per qualsiasi tipo di audio. | Giocatore | Suono |
| Serve a raccogliere dati da fonti esterne (sensori, web, file di dati) e a visualizzarli sotto forma di grafico. | Grafico, ChartData2D | Non disponibile |
| Può essere utilizzato per collegarsi a dispositivi seriali come Arduino. | Seriale | Non disponibile |
| Permette agli utenti della tua app di registrarsi con un nome utente e una password. Questo richiede la creazione di un account Firebase. | Non disponibile | Accedi |
| Permette di incorporare un file pdf all'interno della tua applicazione | Non disponibile | Lettore PDF |
Se la tua applicazione ha bisogno di raccogliere informazioni sul mondo circostante o sull'utente, ecco alcuni sensori a cui App Inventor e Thunkable possono accedere.
| Descrizione delle caratteristiche | App Inventor | Thunkable |
|---|---|---|
| È in grado di determinare se il telefono sta tremando e se viene tenuto in posizione verticale o capovolta. Questa funzionalità è molto utile quando vuoi che lo schermo si riorienti in risposta a come viene tenuto il telefono o se vuoi che l'applicazione reagisca al tremolio. | AccelerometroSensore | Accelerometro |
| Utilizza il sensore accelerometro per misurare il numero di passi compiuti dall'utente che tiene in mano il telefono e può anche stimare la distanza percorsa. | Pedometro | Non disponibile |
| È in grado di rilevare se il telefono viene inclinato. È più preciso dell'accelerometro e può misurare quanto è cambiato l'orientamento del telefono. | GiroscopioSensore | Giroscopio |
| Si usa per misurare la densità del flusso magnetico. Non tutti i telefoni supportano questa funzione. | Sensore di campo magnetico | Magnetometro |
| Permette alla tua applicazione di ottenere l'ora corrente o di utilizzare un timer. Questo può essere utile per impostare una sveglia a tempo o per utilizzare un timer. | Orologio | Timer |
| Raccoglie la latitudine e la longitudine della posizione del telefono. Questo sensore può essere utile ogni volta che devi cercare punti di interesse nelle vicinanze dell'utente. | Sensore di posizione | Sensore di posizione |
| Indica se il telefono è in prossimità di un oggetto. Spesso viene utilizzato per capire se l'utente ha il telefono vicino all'orecchio. Non tutti i telefoni possono supportare questa funzionalità. | Sensore di prossimità | Non disponibile |
| Permette alla tua applicazione di leggere un codice a barre. | Scanner di codici a barre | Macchina fotografica |
| Misura la pressione dell'aria ambiente. | Barometro | Non disponibile |
| Misura l'umidità relativa dell'aria ambiente. Non comune per la maggior parte dei dispositivi mobili. | Igrometro | Non disponibile |
| Misura il livello di luce. | Sensore di luce | Non disponibile |
| Permette alla tua app di condividere i dati con altri dispositivi dotati di NFC (Near-field Communication). | Campo vicino | Non disponibile |
| Fornisce informazioni sull'orientamento fisico del dispositivo in tre dimensioni: rollio, beccheggio e azimut. | Sensore di orientamento | Non disponibile |
| Misura la temperatura ambientale (esterna). | Termometro | Non disponibile |
Con questi componenti la tua app può archiviare i dati all'interno dell'opp, sul dispositivo e nel cloud.
| Descrizione delle caratteristiche | App Inventor | Thunkable |
|---|---|---|
| Blocco che ti permette di aggiornare e memorizzare le informazioni all'interno dell'app. Tutte le informazioni vengono cancellate quando l'app viene chiusa. | Variabile | app Variabile |
| Permette alla tua applicazione di memorizzare e aggiornare le informazioni localmente sul dispositivo mobile e di utilizzarle all'interno dell'applicazione. I dati possono essere memorizzati e recuperati tra un'esecuzione e l'altra dell'applicazione. In Thunkable, DataViewer e DataViewerGrid possono memorizzare i dati localmente utilizzando l'opzione "Crea la tua tabella". | TinyDB | variabile memorizzata Elenco del DataViewer Griglia del visualizzatore dati |
| Permette alla tua app di memorizzare, recuperare e aggiornare i dati nel cloud, in modo da poterli condividere tra i diversi utenti dell'app. Thunkable offre variabili cloud utilizzando Firebase. DataViewer e DataViewerGrid possono essere collegati a Airtable, Google Sheets e Webflow. Il componente Spreadsheet di App Inventor si collega a Google Sheets. | CloudDB FirebaseDB Foglio di calcolo | variabile cloud - (Firebase) Elenco DataViewer Griglia di visualizzazione dati |
Utilizza modelli di apprendimento automatico per la classificazione e strumenti di AI generativa all'interno della tua app.
| Descrizione delle caratteristiche | App Inventor | Thunkable |
|---|---|---|
| Permette di comunicare con un bot di chat AI, ChatGPT di OpenAI. | Chatbot | Open AI Services (completamento del testo) |
| Ti permette di includere DALL-E nella tua applicazione per creare e modificare immagini. | Imagebot | Servizi di AI aperti (generazione di immagini) |
| Ti permette di creare il tuo modello di apprendimento automatico (immagine, suono, posa) e di utilizzarlo nella tua applicazione. | PersonalImageClassifier PersonalAudioClassifier Estensione PoseNet TeachableMachine (nota: tutti questi richiedono l'aggiunta dell'estensione) | Non disponibile |
Abilita il disegno in un'applicazione e aggiungi sprite per animare e creare giochi.
| Descrizione delle caratteristiche | App Inventor | Thunkable |
|---|---|---|
| Aggiunge un'area sullo schermo dove gli utenti possono disegnare. Qui è anche possibile aggiungere degli sprite da animare. | Tela | Tela |
| Questi componenti sono gli elementi che possono essere animati e con cui si può interagire all'interno di un gioco o di un'animazione. | ImageSprite Ball |
Sprite |
Aggiungerai i componenti nella finestra Designer di App Inventor. Dovrai cliccare su una categoria nella tavolozza per aprire il cassetto che mostra i componenti.
ATTIVITÀ: IMPARARE UN NUOVO COMPONENTE
Tempo stimato: 60 minuti
Scegli un componente da conoscere
- Scegli almeno un componente o un sensore che pensi di utilizzare nella tua applicazione.
- Trova la documentazione e/o un tutorial per utilizzare il componente in un'applicazione. Puoi iniziare da qui:
- Crea un'applicazione utilizzando il nuovo componente
Suggerimento del mentore
Le migliori pratiche: Il componente che scegli non deve essere necessariamente perfetto per la tua applicazione! L'importante è che tu stia imparando a conoscere un nuovo componente. Scegli qualcosa che pensi possa funzionare e se scopri che non funziona va bene. Nel mondo del coding chiamiamo questa ricerca "spike" perché stai cercando di scavare il più in profondità possibile (un po' come se stessi piantando un chiodo nel terreno).
Domande guida da porre agli studenti: Se stessimo realizzando un'applicazione per un Apple Watch, che tipo di componenti potrebbero essere presenti sull'orologio (cardiofrequenzimetro, giroscopio - per il rilevamento dei passi, bluetooth). Quanti dati stai raccogliendo? Potresti utilizzare questi dati per addestrare il tuo modello di intelligenza artificiale?
I consigli dei mentori sono forniti dal supporto di AmeriCorps.
Una delle migliori abilità che puoi imparare come programmatore è quella di trovare risorse che ti aiutino quando sei bloccato o hai bisogno di imparare a usare qualcosa.
Questa attività è un esercizio!
Potrebbe non essere esattamente in linea con l'applicazione che vuoi costruire, ma fare pratica con i componenti ti aiuterà quando dovrai costruire la tua applicazione.
RIFLESSIONE
Questa lezione è un riferimento per tutti i componenti che puoi utilizzare per costruire la tua applicazione. Trovare un tutorial o una documentazione per imparare a usare il tuo componente non è facile!
REVISIONE DEI TERMINI CHIAVE
- Componenti dell'interfaccia utente - componenti standard con cui l'utente interagisce, come pulsanti, etichette e caselle di testo.
- Componenti multimediali - esempi di componenti multimediali sono foto, audio e video.
- Sensori - diversi tipi di dispositivi installati su un telefono che raccolgono dati per vari scopi
- Componenti sociali - funzioni che consentono agli utenti di effettuare telefonate, inviare e-mail, inviare messaggi e condividere cose attraverso la tua app.
- Componenti di connettività - funzioni che permettono alla tua applicazione di interagire con luoghi esterni alla tua applicazione, come il web e altre applicazioni.
- Componenti di archiviazione - blocchi e componenti che ti permettono di archiviare le informazioni nell'app, sul dispositivo e nel cloud.
- Componenti AI - componenti che ti permettono di utilizzare modelli di apprendimento automatico o strumenti di IA generativa all'interno della tua applicazione.
RISORSE AGGIUNTIVE
Altri siti di tutorial utili per App Inventor:
- appinventor.org
- Il corso per principianti Coding Bus (molti tutorial sui componenti)
- Tutorial di GirlsCodeIt Technovation
- Elenco di riferimento completo dei componenti (Documento Google per la stampa)
