{"id":675,"date":"2021-05-03T06:29:27","date_gmt":"2021-05-03T06:29:27","guid":{"rendered":"http:\/\/localhost\/wordpress\/?page_id=675"},"modified":"2021-05-05T12:53:05","modified_gmt":"2021-05-05T12:53:05","slug":"trigendadigi","status":"publish","type":"page","link":"http:\/\/localhost\/wordpress\/trigendadigi\/","title":{"rendered":"TrigendaDigi"},"content":{"rendered":"
\n \n
\n \n \n
\n \n
\n \n
\n \n
\n
\n \n \n
\n \n
\n \n
\n \n \n

Mik\u00e4 on TrigendaDigi?<\/h1>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n
\n \n
\n \n
\n
\n \n \n
\n \n
\n \n \n
\n

TrigendaDigi on websovellus, joka perustuu Trigenda-dialogimenetelm\u00e4n ja fyysisen Trigenda-tuotteen digitalisoimiseen. Projekti on tehty toimeksiantona Trigenda Oy:n ja Frostigon Oy:n toimesta. Trigendalta olemme saaneet apua ja vaatimuksia\n sovelluksen toiminnallisuuteen ja ilmeeseen, kun taas Frostigon on antanut meille teknisen ohjenuoran. Projekti on kehitetty kev\u00e4\u00e4ll\u00e4 2021 Ticorporate VIII-opintojakson aikana viiden hengen tiimin voimin. Projektinhallinnassa on\n hy\u00f6dynnetty olennaisesti Scrumia, Githubia sek\u00e4 Zenhubia. Frontendiss\u00e4 on hy\u00f6dynnetty Vue.js viitekehyst\u00e4, backendiss\u00e4 Nodea ja tietokantana MySQL:\u00e4\u00e4. <\/p>\n

Omiksi vastuualueikseni t\u00e4ss\u00e4 projektissa muodostuivat UI-suunnittelu ja sis\u00e4ll\u00f6ntuotanto sek\u00e4 liiketalous. Lis\u00e4ksi olen osallistunut sovelluskehityksen visuaalisen ilmeen muokkaamiseen my\u00f6s kooditasolla. T\u00e4m\u00e4n portfolion p\u00e4\u00e4paino\n on p\u00e4\u00e4- ja sivutoimissani, eli sis\u00e4ll\u00f6ntuotannossa ja liiketaloudessa. Lis\u00e4ksi olen my\u00f6s kertonut sek\u00e4 reflektoinut ryhm\u00e4n projektinhallintaa ja tehnyt itsearvioinnin.<\/p>\n <\/div>\n <\/div>\n

\n \n <\/div>\n
\n \n
Kokeile uusinta demoa t\u00e4st\u00e4!<\/span><\/a>\n <\/span>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n
\n \n
\n \n
\n
\n \n \n
\n \n
\n \n
\n \n \n

UI Case 1: Projekti alkuun<\/h2>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n
\n \n
\n \n
\n
\n \n \n
\n \n
\n \n
\n \n
\n
\n \n \n
\n \n
\n \n \n
\n

Kaikkien projektien on alettava jostain. Luonnollisesti projektin alkuvaiheessa suunnitteluty\u00f6t\u00e4 tulikin runsaasti. Omaksi roolikseni muodostuikin nopeasti sovelluksen visuaalisen ilmeen suunnittelu. <\/p>\n

Alussa p\u00e4\u00e4dyin yksinkertaiseen n\u00e4kym\u00e4\u00e4n, jossa ohjeet tulevat yl\u00f6s vasemmalle, lokeropyramidi keskelle, lokeroitava kortti alas, ohje sen alle ja “en osaa sanoa” painike oikealle. Vaikka n\u00e4kym\u00e4 oli alkeellinen, peruselementit\n alkoivat t\u00e4ss\u00e4 vaiheessa jo hahmottua. Suunnitelman avulla my\u00f6s koodarimme p\u00e4\u00e4siv\u00e4t luomaan komponentteja, joiden perusteille uusinkin sovellusversio on rakennettu.<\/p>\n

Alussa suurena oppimistavoitteena oli Adobe Xd-ohjelman k\u00e4ytt\u00f6. T\u00e4m\u00e4n opin onneksi nopeasti ja ohjelma onkin ollut todella hy\u00f6dyllinen ty\u00f6kalu koko opintojakson ajan. Ennest\u00e4\u00e4n tuttujen Photoshopin ja Illustratorin avulla\n my\u00f6s yksityiskohtaisempia elementtej\u00e4, logoja ja tekstej\u00e4 on ollut helppo luoda.<\/p>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n

\n
\n \n \n
\n \n
\n \n
\n
\n \n \n \"\"\n
<\/div>\n <\/div>\n
\n Ensimm\u00e4inen versio korttien lajittelun\u00e4kym\u00e4st\u00e4\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n
\n \n
\n \n <\/path>\n <\/svg>\n <\/div>\n
\n \n
\n \n
\n \n
\n
\n \n \n
\n \n
\n \n
\n \n \n

UI Case 2: Tringo<\/h2>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n
\n \n
\n \n
\n
\n \n \n
\n \n
\n \n \n
\n

Jo alkuvaiheessa syntyi idea “Tringosta”, hahmosta joka ohjaa k\u00e4ytt\u00e4j\u00e4\u00e4 sovelluksen k\u00e4yt\u00f6ss\u00e4. Idean taustalla oli sovelluksen inhimillist\u00e4minen niin, ett\u00e4 k\u00e4ytt\u00e4j\u00e4 ik\u00e4\u00e4n kuin keskustelisi dialogin edetess\u00e4 my\u00f6s hahmon kanssa. Ensimm\u00e4inen\n Tringo-hahmotelma olikin valmiina jo heti ensimm\u00e4iseen k\u00e4ytt\u00f6liittym\u00e4\u00e4n. <\/p>\n

Tringo on luotu iPad tabletilla, Procreate -piirto-ohjelman avulla. Kehityinkin my\u00f6s Procreaten k\u00e4yt\u00f6ss\u00e4 ja piirt\u00e4misess\u00e4 jonkun verran Tringoa hahmotellessa. Sain t\u00e4st\u00e4 my\u00f6s pienen kipin\u00e4n erilaisten piirroshahmojen tekemiseen my\u00f6s\n tulevaisuudessa. Ensimm\u00e4isen\u00e4 maskotti sai iloisen ilmeen, jonka j\u00e4lkeen loin sille kaksi muuta tunnetilaa. N\u00e4it\u00e4 tunnetiloja oli tarkoitus hy\u00f6dynt\u00e4\u00e4, jos k\u00e4ytt\u00e4j\u00e4 esimerkiksi k\u00e4y keskustelua v\u00e4\u00e4rin ja Tringo haluaa viesti\u00e4 h\u00e4mmennyst\u00e4.\n Itse piirt\u00e4misen v\u00e4livaiheita en ole dokumentoinut, mutta k\u00e4yt\u00e4nn\u00f6ss\u00e4 ensimm\u00e4inen vaihe oli \u00e4\u00e4riviivojen hahmottelu, jonka j\u00e4lkeen syntyi v\u00e4rimaailma kuvastamaan eri lokeroiden tunnetiloja. <\/p>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n

\n \n
\n \n
\n
\n \n \n
\n \n
\n \n
\n
\n \n \n \"\"\n
<\/div>\n <\/div>\n
\n Iloinen “perus” tringo\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n
\n
\n \n \n
\n \n
\n \n
\n
\n \n \n \"\"\n
<\/div>\n <\/div>\n
\n S\u00e4ik\u00e4ht\u00e4nyt tringo\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n
\n
\n \n \n
\n \n
\n \n
\n
\n \n \n \"\"\n
<\/div>\n <\/div>\n
\n H\u00e4mmentynyt tringo\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n
\n \n
\n \n <\/path>\n <\/svg>\n <\/div>\n
\n \n
\n \n
\n \n
\n
\n \n \n
\n \n
\n \n
\n \n \n

UI Case 3: Muokkausta, uusia n\u00e4kymi\u00e4<\/h2>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n
\n \n
\n \n
\n
\n \n \n
\n \n
\n \n \n
\n

Ensimm\u00e4isen k\u00e4ytt\u00f6liittym\u00e4version j\u00e4lkeen sovelluksen ulkoasu alkoi kehittym\u00e4\u00e4n nopeasti. Keskustelun muita vaiheita t\u00e4ytyi alkaa kehitt\u00e4m\u00e4\u00e4n ja niille t\u00e4ytyi my\u00f6s suunnitella ulkoasut ja toiminnallisuudet. My\u00f6s lajitteluvaiheen ulkoasua\n tuli muokata, jotta se n\u00e4ytt\u00e4isi ammattimaisemmalta. Lis\u00e4ksi tarvittiin toisen vaiheen n\u00e4kym\u00e4, kategorian valinta n\u00e4kym\u00e4, tekstiruutu sek\u00e4 korttien valinta n\u00e4kym\u00e4.<\/p>\n

T\u00e4ss\u00e4 vaiheessa opin tekem\u00e4\u00e4n jokaisesta k\u00e4ytt\u00f6liittym\u00e4hahmotelmasta monta versiota, ettei muu tiimi olisi yhden vaihtoehdon varassa. Usein ensimm\u00e4isest\u00e4 “visusta” kehittyikin viel\u00e4 monta versiota, joiden avulla ulkoasu saatiin hiottua\n kohdalleen. Tarvittaessa pystyin kysym\u00e4\u00e4n ryhm\u00e4lt\u00e4ni mielipiteit\u00e4 ja korjausehdotuksia, jotka auttoivat projektia eteenp\u00e4in l\u00e4pi kev\u00e4\u00e4n. <\/p>\n

Alla on kuvattu, kuinka lajitteluvaiheen ulkoasu muokkautui ennen ensimm\u00e4ist\u00e4 demoa ja hieman sen j\u00e4lkeen. <\/p>\n <\/div>\n <\/div>\n

\n \n <\/div>\n
\n \n
\n \n
\n
\n \n \n
\n \n
\n \n
\n
\n \n \n \"\"\n
<\/div>\n <\/div>\n
\n Versio 1\n <\/div>\n <\/div>\n <\/div>\n
\n \n <\/div>\n
\n \n
\n
\n \n \n \"\"\n
<\/div>\n <\/div>\n
\n Versio 3, v\u00e4rimaailman testailua\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n
\n
\n \n \n
\n \n
\n \n
\n
\n \n \n \"\"\n
<\/div>\n <\/div>\n
\n Versio 2, k\u00e4yt\u00f6ss\u00e4 ensimm\u00e4isess\u00e4 demossa\n <\/div>\n <\/div>\n <\/div>\n
\n \n <\/div>\n
\n \n
\n
\n \n \n \"\"\n
<\/div>\n <\/div>\n
\n Versio 4, navigaation ja korttipohjan testailua\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n
\n \n
\n \n
\n
\n \n \n
\n \n
\n \n \n
\n

Lajittelun\u00e4kym\u00e4n lis\u00e4ksi tarvittiin siis my\u00f6s muita n\u00e4kymi\u00e4, jotta keskustelu saataisiin etenem\u00e4\u00e4n. Keskustelun toisessa vaiheessa korttien otsikoiden ja ohjeiden oli muututtava ja k\u00e4ytt\u00e4j\u00e4lle oli luotava mahdollisuus valita lajitelluista\n korteista tietty kategoria ja sen sis\u00e4lt\u00e4 kortti sek\u00e4 selitt\u00e4\u00e4 valintaansa. T\u00e4ss\u00e4 vaiheessa t\u00e4ytyi itse ulkoasun lis\u00e4ksi hahmotella my\u00f6s sit\u00e4, tulevatko valinta ja tekstiruudut omille sivuillensa, vai k\u00e4ytett\u00e4isiink\u00f6 niin sanottua\n “overlayta”. <\/p>\n <\/div>\n <\/div>\n

\n \n <\/div>\n
\n \n
\n \n
\n
\n \n \n
\n \n
\n \n
\n
\n \n \n \"\"\n
<\/div>\n <\/div>\n
\n Kategorian valinta versio 1\n <\/div>\n <\/div>\n <\/div>\n
\n \n <\/div>\n
\n \n
\n
\n \n \n \"\"\n
<\/div>\n <\/div>\n
\n Tekstiruutu. K\u00e4yt\u00f6ss\u00e4 monessa paikassa\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n
\n
\n \n \n
\n \n
\n \n
\n
\n \n \n \"\"\n
<\/div>\n <\/div>\n
\n Vaihe 2, versio 1\n <\/div>\n <\/div>\n <\/div>\n
\n \n <\/div>\n
\n \n
\n
\n \n \n \"\"\n
<\/div>\n <\/div>\n
\n Kortti-overlay. K\u00e4yt\u00f6ss\u00e4 demo 1 versiossa\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n
\n \n
\n \n <\/path>\n <\/svg>\n <\/div>\n
\n \n
\n \n
\n \n
\n
\n \n \n
\n \n
\n \n
\n \n \n

UI Case 4: Ensimm\u00e4inen etusivu<\/h1>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n
\n \n
\n \n
\n
\n \n \n
\n \n
\n \n \n
\n

Kun keskustelun perusvaiheet oltiin suunniteltu, alkoi olla ajankohtaista luoda sovellukselle jonkunn\u00e4k\u00f6inen etusivu. Alkuper\u00e4isen etusivun oli tarkoitus olla informatiivinen ja hieman landing page -tyylinen. T\u00e4m\u00e4 alkuper\u00e4inen etusivu\n kuitenkin kuopattiin t\u00e4ysin my\u00f6hemm\u00e4ss\u00e4 vaiheessa, mutta ensimm\u00e4isen demon ajan se oli k\u00e4yt\u00f6ss\u00e4. N\u00e4iden sivujen suunnittelun lis\u00e4ksi osallistuin yhdess\u00e4 Kasperin ja Eliaksen kanssa my\u00f6s HTML-rakenteen ja CSS-muotoilun rakentamiseen.\n K\u00e4yt\u00e4nn\u00f6ss\u00e4 sivustorakenne perustui kiinte\u00e4\u00e4n navigaatioom, gridiin jossa kuvat sijaitsivat, flexboxiin jossa infolaatikot sijaitsivat ja footeriin. <\/p>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n

\n \n
\n \n
\n
\n \n \n
\n \n
\n \n
\n
\n \n \n \"\"\n
<\/div>\n <\/div>\n
\n Versio 1\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n
\n
\n \n \n
\n \n
\n \n
\n
\n \n \n \"\"\n
<\/div>\n <\/div>\n
\n Versio 2\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n
\n
\n \n \n
\n \n
\n \n
\n
\n \n \n \"\"\n
<\/div>\n <\/div>\n
\n Versio 3\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n
\n
\n \n \n
\n \n
\n \n
\n
\n \n \n \"\"\n
<\/div>\n <\/div>\n
\n Versio 4\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n
\n \n
\n \n
\n
\n \n \n
\n \n
\n \n \n
\n

Etusivun lis\u00e4ksi sivulle luotiin my\u00f6s erillinen “yleist\u00e4”-sivu, johon kirjoitettiin lis\u00e4tietoa Trigenda-menetelm\u00e4st\u00e4. <\/p>\n <\/div>\n <\/div>\n

\n \n
\n \n
\n
\n \n \n
\n \n
\n \n
\n
\n \n \n \"\"\n
<\/div>\n <\/div>\n
\n Versio 1\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n
\n
\n \n \n
\n \n
\n \n
\n
\n \n \n \"\"\n
<\/div>\n <\/div>\n
\n Versio 2\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n
\n \n
\n \n <\/path>\n <\/svg>\n <\/div>\n
\n \n
\n \n
\n \n
\n
\n \n \n
\n \n
\n \n
\n \n \n

UI Case 5: Oma sivu ja summary<\/h2>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n
\n \n
\n \n
\n
\n \n \n
\n \n
\n \n \n
\n

T\u00e4ss\u00e4 vaiheessa sovelluksen ensimm\u00e4inen t\u00e4ysi demo oli rakennettu ja esitetty. Keskustelun pystyi k\u00e4ym\u00e4\u00e4n alusta loppuun ilman ongelmia, joskaan se ei ollut t\u00e4ysin responsiivinen kaikilla laitteilla. Responsiivisuuden lis\u00e4ksi demon\n j\u00e4lkeen p\u00e4\u00e4teemaksi oli kuitenkin tarkoitus ottaa kirjautumisominaisuuden ja summaryn, eli k\u00e4sittelyosuuden rakentaminen. N\u00e4it\u00e4 varten oli siis luotava hahmotelmat. <\/p>\n

Ensimm\u00e4isen\u00e4 tein niin sanotun “oman sivun”, eli sivun jolle k\u00e4ytt\u00e4j\u00e4 p\u00e4\u00e4tyy kirjauduttaan sis\u00e4\u00e4n. T\u00e4h\u00e4n oli tarkoitus tulla n\u00e4kyville k\u00e4ytt\u00e4j\u00e4n omat tiedot, k\u00e4ydyt keskustelut ja muut tapahtumat sek\u00e4 mahdollisuus luoda uusi keskustelu.\n Omaa sivua ei kuitenkaan p\u00e4\u00e4dytty k\u00e4ytt\u00e4m\u00e4\u00e4n toisessa demossa, sill\u00e4 sprintin p\u00e4\u00e4paino k\u00e4\u00e4ntyi lopulta muualle.<\/p>\n <\/div>\n <\/div>\n

\n \n <\/div>\n
\n \n
\n \n
\n
\n \n \n
\n \n
\n \n
\n
\n \n \n \"\"\n
<\/div>\n <\/div>\n
\n Oma sivu versio 1\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n
\n
\n \n \n
\n \n
\n \n
\n
\n \n \n \"\"\n
<\/div>\n <\/div>\n
\n Oma sivu versio 2\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n
\n \n <\/div>\n
\n \n \n
\n

Oman sivun lis\u00e4ksi teht\u00e4v\u00e4n\u00e4 oli k\u00e4sittelyosuus, johon k\u00e4ytt\u00e4j\u00e4n oli tarkoitus ammattilaisen kanssa koota valintojaan sek\u00e4 perusteluita niihin. T\u00e4m\u00e4 hahmotelma sai my\u00f6s v\u00e4isty\u00e4 uuden visuaalisen ilmeen tielt\u00e4, mutta sit\u00e4 kuitenkin\n k\u00e4ytettiin pohjana uuden k\u00e4sittelyosuuden luomiseen.<\/p>\n

Hahmotelmista voi huomata, kuinka esimerkiksi tekstiruutujen elementtej\u00e4 on kierr\u00e4tetty my\u00f6s my\u00f6hemm\u00e4ss\u00e4 vaiheessa.<\/p>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n

\n \n
\n \n
\n
\n \n \n
\n \n
\n \n
\n
\n \n \n \"\"\n
<\/div>\n <\/div>\n
\n Summary versio 1\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n
\n
\n \n \n
\n \n
\n \n
\n
\n \n \n \"\"\n
<\/div>\n <\/div>\n
\n Summary versio 2 (minimaalisia muutoksia)\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n
\n
\n \n \n
\n \n
\n \n
\n
\n \n \n \"\"\n
<\/div>\n <\/div>\n
\n Summary versio 3\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n
\n
\n \n \n
\n \n
\n \n
\n
\n \n \n \"\"\n
<\/div>\n <\/div>\n
\n Summary versio 4 (minimaalisia muutoksia)\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n
\n \n
\n \n <\/path>\n <\/svg>\n <\/div>\n
\n \n <\/path>\n <\/svg>\n <\/div>\n
\n \n
\n \n
\n \n
\n
\n \n \n
\n \n
\n \n
\n \n \n

UI Case 6: Uusi aika, ammattimainen ilme<\/h2>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n
\n \n
\n \n
\n
\n \n \n
\n \n
\n \n \n
\n

Hieman Demo 1 -kokonaisuuden j\u00e4lkeen aloitimme Trigendan tuotteenomistajien kanssa keskustelun siit\u00e4, kuinka sovelluksen visuaalista ilmett\u00e4 tulisi raikastaa ja yhdent\u00e4\u00e4 olemassa olevan tuotteen ja nettisivun kanssa. Olimmekin my\u00f6s\n ryhm\u00e4n\u00e4 sit\u00e4 mielt\u00e4, ett\u00e4 sovellus tarvitsisi ammattimaisempaa tuulahdusta.<\/p>\n

T\u00e4ss\u00e4 vaiheessa apuun astui Sampo Rossi, joka on toiminut Trigendan graafikkona jo aikaisemmin. Minun teht\u00e4v\u00e4ni oli keskustella Sampon ja Trigendan kanssa uudesta toteutuksesta sek\u00e4 yhdess\u00e4 tuottaa sovellukselle uusi ilme. Lopulta\n Sampon ideoiden perusteella saimme aikaiseksi uuden ulkoasun, jonka pohjalta l\u00e4hdimme laajentamaan muotoilua muihin elementteihin sek\u00e4 muokkaamaan koko keskustelun ilmett\u00e4. Suurimpana muutoksena uuteen sovellukseen tuli se, ett\u00e4\n keskell\u00e4 sijaitsevan valintakolmion sijasta n\u00e4kym\u00e4 jakautuisi kahteen osaan, jossa valintakolmio sijaitsi oikealla ja ohjeet, sek\u00e4 lajittelukortti vasemmalla.<\/p>\n

Vaikka t\u00e4ss\u00e4 vaiheessa Sampo tekikin suurimman suunnitteluty\u00f6n, opin itse toimimaan yhteisty\u00f6ss\u00e4 toisen graafikon kanssa. Tuntuikin, ett\u00e4 h\u00e4n ammattilaisena arvosti mielipidett\u00e4ni ja kuunteli ehdotuksiani uuden ilmeen suhteen. T\u00e4m\u00e4\n antoi itsevarmuutta, sek\u00e4 t\u00e4rke\u00e4\u00e4 oppia my\u00f6s tulevaisuutta varten.<\/p>\n <\/div>\n <\/div>\n

\n \n <\/div>\n
\n \n
\n \n
\n
\n \n \n
\n \n
\n \n
\n
\n \n \n \"\"\n
<\/div>\n <\/div>\n
\n Sampon ensimm\u00e4inen vedos. V\u00e4rit sek\u00e4 asettelu vaihtoon\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n
\n
\n \n \n
\n \n
\n \n
\n
\n \n \n \"\"\n
<\/div>\n <\/div>\n
\n Sampon toinen versio, josta lopullinen ilme alkoi muotoutumaan\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n
\n \n <\/div>\n
\n \n \n
\n

Kun uusi visuaalinen ilme oli suunniteltu, oli koko ryhm\u00e4llemme selv\u00e4\u00e4, ett\u00e4 koodin muokkausta tullaan tarvitsemaan paljon. T\u00e4ss\u00e4 vaiheessa ty\u00f6teht\u00e4v\u00e4ni keskittyiv\u00e4tkin CSS-muotoiluun graafisen suunnittelun sijaan. Adobe Xd-ty\u00f6t eiv\u00e4t\n kuitenkaan olleet ohi, sill\u00e4 sovellukseen t\u00e4ytyi suunnitella uuden visuaalisen ilmeen pohjalta viel\u00e4 useita k\u00e4ytt\u00f6liittymi\u00e4, jotta keskustelu saataisiin k\u00e4yty\u00e4 loppuun asti. <\/p>\n

Alla olevassa kuvassa n\u00e4kyy valmis Adobe Xd ty\u00f6py\u00f6t\u00e4. Lopulta Sampon hahmotelman pohjalta teinkin l\u00e4hes kymmenen uutta n\u00e4kym\u00e4\u00e4n, jotka johdattelivat luotua teemaa. Vaikeinta olikin se, ett\u00e4 isot elementit piti saada nyt kahteen osaan\n jaettuun k\u00e4ytt\u00f6liittym\u00e4\u00e4n. T\u00e4st\u00e4 selvisimme kuitenkin sivuston kelausta sek\u00e4 overlay -n\u00e4kymi\u00e4 hy\u00f6dynt\u00e4m\u00e4ll\u00e4<\/p>\n <\/div>\n <\/div>\n

\n \n <\/div>\n
\n \n
\n
\n \n \n \"\"\n
<\/div>\n <\/div>\n
\n Adobe Xd ty\u00f6p\u00f6yt\u00e4\n <\/div>\n <\/div>\n <\/div>\n
\n \n
\n \n
\n
\n \n \n
\n \n
\n \n
\n
\n \n \n \"\"\n
<\/div>\n <\/div>\n
\n Scrollin hy\u00f6dynt\u00e4mist\u00e4 ohjeruudussa\n <\/div>\n <\/div>\n <\/div>\n
\n \n <\/div>\n
\n \n
\n
\n \n \n \"\"\n
<\/div>\n <\/div>\n
\n Uusi scrollia hy\u00f6dynt\u00e4v\u00e4 overlay\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n
\n
\n \n \n
\n \n
\n \n
\n
\n \n \n \"\"\n
<\/div>\n <\/div>\n
\n Kategorian valinta jaetulla ruudulla\n <\/div>\n <\/div>\n <\/div>\n
\n \n <\/div>\n
\n \n
\n
\n \n \n \"\"\n
<\/div>\n <\/div>\n
\n Uusi, yksinkertaistettu etusivu\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n
\n \n \n
\n \n
\n \n
\n \n
\n
\n \n \n
\n \n
\n \n
\n \n \n

UI Case 7: Uusi Tringo<\/h2>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n
\n \n
\n \n
\n
\n \n \n
\n \n
\n \n \n
\n

Viimeisen\u00e4 k\u00e4ytt\u00f6liittym\u00e4\u00e4n liittyv\u00e4n\u00e4 asiana halusin viel\u00e4 hienostella vanhaa Tringo-maskottia, tekem\u00e4ll\u00e4 siit\u00e4 sulavalinjaisemman ja ammattimaisemman n\u00e4k\u00f6isen. P\u00e4\u00e4tinkin piirt\u00e4\u00e4 Tringon alusta kokonaan uudelleen, t\u00e4ll\u00e4 kertaa tarkemmilla\n vedoilla. Samalla uuden sovelluksen sinert\u00e4v\u00e4 ilme v\u00e4littyi my\u00f6s Tringoon, jonka v\u00e4rik\u00e4s asu muuttui kokosiniseksi.<\/p>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n

\n \n
\n \n
\n
\n \n \n
\n \n
\n \n
\n
\n \n \n \"\"\n
<\/div>\n <\/div>\n
\n Vanha Tringo\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n
\n
\n \n \n
\n \n
\n \n
\n
\n \n \n \"\"\n
<\/div>\n <\/div>\n
\n Uusi muokattu Tringo\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n
\n \n
\n \n <\/path>\n <\/svg>\n <\/div>\n
\n \n <\/path>\n <\/svg>\n <\/div>\n
\n \n
\n \n
\n \n
\n
\n \n \n
\n \n
\n \n
\n \n \n

WordPress ja TikoBiz<\/h2>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n
\n \n
\n \n
\n
\n \n \n
\n \n
\n \n \n
\n

Opintojakson aikana syntyi luonnollisesti my\u00f6s muutakin sis\u00e4lt\u00f6\u00e4. TikoBiz sivutoimi edellytti sen, ett\u00e4 sovellukselle teht\u00e4isiin landing-page tyylinen WordPress sivu, jonka avulla pystyisi harjoittelemaan sis\u00e4ll\u00f6ntuotantoa ja hakukoneoptimointia.\n T\u00e4m\u00e4n teht\u00e4v\u00e4n kautta WordPress tulikin minulle hyvin tutuksi ja auttoi my\u00f6s tekem\u00e4\u00e4n p\u00e4\u00e4t\u00f6ksen siit\u00e4, ett\u00e4 t\u00e4m\u00e4 portfolio tulisi olemaan WordPress pohjainen.<\/p>\n

WordPressin toteutustavaksi ja teemaksi muodostui hetken testailun j\u00e4lkeen Colibri-WP. Colibri on Elementorin tapainen drag-and-drop editori, jolla sai nopeasti tehty\u00e4 modernin n\u00e4k\u00f6ist\u00e4 j\u00e4lke\u00e4. Harkitsin my\u00f6s Elementorin k\u00e4ytt\u00f6\u00e4, mutta\n lopulta Colibri vei voiton hyvien valmiiden elementtiens\u00e4 ansiosta. Colibri on k\u00e4yt\u00f6ss\u00e4 my\u00f6s t\u00e4ll\u00e4 portfolio sivustolla. Kyseist\u00e4 editoria hetken k\u00e4ytt\u00e4neen\u00e4 olen kuitenkin huomannut, ett\u00e4 osa hy\u00f6dyllisist\u00e4 ominaisuuksista on maksumuurin\n takana, eik\u00e4 kaikkia haluttuja muokkauksia pysty v\u00e4ltt\u00e4m\u00e4tt\u00e4 tehd\u00e4 loogisesti. Esimerkiksi monta kuvaa sis\u00e4lt\u00e4v\u00e4n sliderin lis\u00e4\u00e4minen on teeman ilmaisversiolla hankalaa ja siksi t\u00e4ll\u00e4 sivustolla kuvat ovatkin staattisia, vaikka olisin\n paikoittain halunnut k\u00e4ytt\u00e4\u00e4 slidereit\u00e4. <\/p>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n

\n \n
\n \n
\n
\n \n \n
\n \n
\n \n
\n
\n \n \n \"\"\n
<\/div>\n <\/div>\n
\n Colibrin muokkausn\u00e4kym\u00e4 TrigendaDigi sivustolla\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n
\n \n
\n \n
\n
\n \n \n
\n \n
\n \n \n
\n

Colibrin negatiivisista puolista huolimatta ihastuin kuitenkin sen helppouteen ja erityisesti k\u00e4teviin dividereihin, joiden avulla sivustolle saa lis\u00e4tty\u00e4 karismaa ja mielenkiintoa. My\u00f6s valmiista sis\u00e4lt\u00f6palikoista on ollut apua sivustoja\n tehdess\u00e4.<\/p>\n <\/div>\n <\/div>\n

\n \n <\/div>\n
\n \n
\n
\n \n \n \"\"\n
<\/div>\n <\/div>\n
\n Dividerin, blurratun taustan ja Colibrin valmiin sis\u00e4lt\u00f6elentin avulla tehty info-osuus TrigendaDigi sivulla\n <\/div>\n <\/div>\n <\/div>\n
\n \n <\/div>\n
\n \n
\n
\n \n \n \"\"\n
<\/div>\n <\/div>\n
\n Dividerien ja valmiin elementin sek\u00e4 overlap ominaisuuden avulla tehty kiteytys portfolio sivulla\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n
\n \n
\n \n
\n
\n \n \n
\n \n
\n \n \n
\n

Teeman ja rakenteen valmistuttua sivustolle tuli tuottaa sis\u00e4lt\u00f6\u00e4. Sivustolle tulikin lyhyet kiteytykset siit\u00e4, mit\u00e4 ovat TrigendaDigi ja Ticorporate. Lis\u00e4ksi kerroin my\u00f6s meid\u00e4n tiimist\u00e4mme sek\u00e4 sovelluksessa k\u00e4yt\u00f6ss\u00e4 olevasta tekniikasta.\n Tein sivustolle my\u00f6s Blogi-alasivun, jonne kirjoitin jonkun verran projektin etenemisest\u00e4.<\/p>\n

Ryhm\u00e4 -osuutta varten minun oli tarkoitus piirt\u00e4\u00e4 jokaisesta ryhm\u00e4n j\u00e4senest\u00e4 hieman piirroshahmon tyylinen naamakuva. Ty\u00f6 j\u00e4i kuitenkin kesken ja lopulta ehdin piirt\u00e4\u00e4 viidest\u00e4 tiimil\u00e4isest\u00e4 vain kolme. T\u00e4m\u00e4 oli ensimm\u00e4inen kerta\n kun piirsin kasvokuvia ja olenkin siihen n\u00e4hden tyytyv\u00e4inen lopputulokseen, vaikka ty\u00f6 osoittautuikin suhteellisen hankalaksi ja aikaa viev\u00e4ksi.<\/p>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n

\n \n
\n \n
\n
\n \n \n
\n \n
\n \n
\n
\n \n \n \"\"\n
<\/div>\n <\/div>\n
\n Sasu\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n
\n
\n \n \n
\n \n
\n \n
\n
\n \n \n \"\"\n
<\/div>\n <\/div>\n
\n Kassu\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n
\n
\n \n \n
\n \n
\n \n
\n
\n \n \n \"\"\n
<\/div>\n <\/div>\n
\n Elias\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n
\n \n
\n \n
\n
\n \n \n
\n \n
\n \n \n
\n

Sis\u00e4ll\u00f6ntuotannon lis\u00e4ksi WordPress sivusto tuli siirt\u00e4\u00e4 lokaalista ymp\u00e4rist\u00f6st\u00e4 Ticorporaten palvelimelle. T\u00e4m\u00e4 osoittautuikin yll\u00e4tt\u00e4v\u00e4n hankalaksi ja siirrossa meni l\u00e4hes koko ty\u00f6p\u00e4iv\u00e4. Eniten ongelmia tuotti config-tiedostojen\n muokkaaminen, jonka onnistuin tekem\u00e4\u00e4n muutaman kerran v\u00e4\u00e4rin. Iso kiitos avusta kuuluu kuitenkin Teemu P\u00f6lkille, joka l\u00e4hes k\u00e4dest\u00e4 pit\u00e4en auttoi minua siirt\u00e4m\u00e4\u00e4n sivuston onnistuneesti. <\/p>\n

Kun sivusto oli siirretty, muokkasin sit\u00e4 viel\u00e4 hieman lopulliseen ulkoasuunsa. T\u00e4m\u00e4n j\u00e4lkeen isoksi tavoitteeksi muodostui hakukoneoptimointi. T\u00e4t\u00e4 varten asensin Yoast SEO lis\u00e4osan, jonka avulla sivuston metatietoja pystyi muokkaan\n ja sivuston sai yhdistetty\u00e4 Googlen hakukonsoliin. Tavoitteena minulla oli, ett\u00e4 hakemalla “Trigendadigi”, ilmestyisi oma sivuni ensimm\u00e4isen\u00e4 hakutuloksiin. P\u00e4iv\u00e4 google-rekister\u00f6itymisen j\u00e4lkeen sivusto alkoikin ilmestym\u00e4\u00e4n hakutuloksiin.\n My\u00f6s blogi ja demo ilmestyv\u00e4t tuloksiin ja sivusto l\u00f6ytyi kirjoittamalla hakuun Trigenda ticorporate. <\/p>\n

Jatkossa hakukoneoptimointia voisi kuitenkin kehitt\u00e4\u00e4 niin, ett\u00e4 sivusto tulisi hakutuloksiin my\u00f6s hakemalla trigenda digi v\u00e4lily\u00f6nnin kanssa, sek\u00e4 pelk\u00e4st\u00e4\u00e4n trigenda. Huomasin t\u00e4m\u00e4n kuitenkin olevan vaikeaa, sill\u00e4 Trigendan oma sivusto\n sek\u00e4 somet tulevat usein hakutuloksiin ensiksi.<\/p>\n <\/div>\n <\/div>\n

\n \n <\/div>\n
\n \n
\n
\n \n \n \"\"\n
<\/div>\n <\/div>\n
\n trigendadigi googletus. Google yritt\u00e4\u00e4 korjata hakuun v\u00e4lily\u00f6nti\u00e4. Kaikki halutut sivut kuitenkin ilmestyv\u00e4t tuloksiin\n <\/div>\n <\/div>\n <\/div>\n
\n \n <\/div>\n
\n \n
\n
\n \n \n \"\"\n
<\/div>\n <\/div>\n
\n Trigenda ticorporate haku. Etusivu tulee hakutuloksiin\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n
\n \n
\n \n
\n
\n \n \n
\n \n
\n \n \n
\n

WordPress sivun ja sis\u00e4ll\u00f6ntuotannon lis\u00e4ksi TikoBiz -sivuty\u00f6 sis\u00e4lsi minun osaltani markkinoinnin ja sen erilaisten tapojen sek\u00e4 kanavien opiskelua. Opin lis\u00e4\u00e4 muun muassa inbound ja outbound markkinoinnista, ostopersoonista ja poluista\n sek\u00e4 muutamasta sosiaalisen median kanavasta ja suoramarkkinoinnista. Lis\u00e4ksi osallistuin Trigenda Oy:n tuotteenomistajien kanssa TrigendaDigi sovelluksen liiketoimintasuunnitteluun. Koska TrigendaDigist\u00e4 on tarkoitus tuottaa tuote\n oikeille yrityksille myyntiin, p\u00e4\u00e4sin my\u00f6s konkreettisesti suunnittelemaan sovelluksen mahdollista markkinointistrategiaa ja erilaisia hinnoittelumalleja. <\/p>\n

Liiketalouden sivuty\u00f6n kautta p\u00e4\u00e4sin my\u00f6s esiintym\u00e4\u00e4n ja pitchaamaan muutaman kerran. N\u00e4in sain paljon lis\u00e4\u00e4 esiintymisvarmuutta ja alankin pikku hiljaa p\u00e4\u00e4st\u00e4 eroon esiintymisj\u00e4nnityksest\u00e4ni. N\u00e4iden oppien pohjalta esitin ryhm\u00e4n toisen\n demon kokonaan yksin ja sain esityksest\u00e4 positiivista palautetta. Tarkoituksena olisi my\u00f6s, ett\u00e4 toimin 12.5. esitett\u00e4v\u00e4n “konkurssi” demon esitt\u00e4j\u00e4n\u00e4. <\/p>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n

\n \n \n
\n \n
\n \n
\n \n
\n
\n \n \n
\n \n
\n \n
\n \n \n

T\u00e4st\u00e4 TrigendaDigi.Ticorporate.fi sivustolle!<\/h2>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n
\n
\n \n \n
\n \n
\n \n
Paina t\u00e4st\u00e4<\/span><\/a>\n <\/span>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n
\n \n
\n \n <\/path>\n <\/svg>\n <\/div>\n
\n \n <\/path>\n <\/svg>\n <\/div>\n
\n \n
\n \n
\n \n
\n
\n \n \n
\n \n
\n \n
\n \n \n

Projektinhallinta ja sen reflektointi<\/h2>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n
\n \n
\n \n
\n
\n \n \n
\n \n
\n \n \n
\n

Koko Ticorporaten yhten\u00e4 t\u00e4rkeist\u00e4 oppimistavoitteista on projektinhallinnan hy\u00f6dynt\u00e4minen osana ty\u00f6t\u00e4. Kaikki opintojakson ryhm\u00e4t ovatkin k\u00e4ytt\u00e4neet Scrum-viitekehyst\u00e4 apuna ty\u00f6n j\u00e4sentelyss\u00e4 ja hallinnoimisessa. Projektinhallinnan\n apuna k\u00e4ytettiin my\u00f6s Githubia ja Zenhubia.<\/p>\n

Mielest\u00e4ni itse Scrum toimikin tiimiss\u00e4mme hyvin alusta alkaen. Scrum Master Petteri sek\u00e4 Product Owner Elias tekiv\u00e4t ty\u00f6ns\u00e4 hyvin ja heid\u00e4n roolinsa olivat selke\u00e4t. Elias oli mukana kaikissa asiakkaan kanssa k\u00e4ydyiss\u00e4 keskusteluissa\n ja piti huolen ett\u00e4 heid\u00e4n toiveensa v\u00e4littyiv\u00e4t meille. Petteri piti huolen siit\u00e4, ett\u00e4 tiimi oli kartalla Daily Scrumien, viikkopalaverien ja retrospektiivien avulla. Tiimi pysyi ajan tasalla my\u00f6s sen ansiosta, ett\u00e4 toimimme kokoajan\n yhteisess\u00e4 et\u00e4ty\u00f6tilassa Discordissa. Kukaan ei siis j\u00e4\u00e4nyt ilman apua jos ongelmia ilmeni ja ongelmat ratkaistiin heti. My\u00f6sk\u00e4\u00e4n p\u00e4\u00e4t\u00f6ksi\u00e4 ei tarvinnut tehd\u00e4 yksin, vaan ne tehtiin yhteistuumin. Scrumin t\u00e4rkein oppi minulle oli\n huomata se, miten Scrumi toimii k\u00e4yt\u00e4nn\u00f6ss\u00e4 osana pitk\u00e4kestoista projektia ja kuinka sen avulla voidaan kehitt\u00e4\u00e4 tiimin toimintaa.<\/p>\n

Githubin k\u00e4ytt\u00f6 osana projektinhallintaa sujui hyvin. Muutosten tekemisiin k\u00e4ytettiin brancheja, jotka yhdistettiin niiden valmistuessa “main”-haaraan, jossa sijaitsi sovelluksen sen hetkinen versio. Ennen demoja sovellus rakennettiin\n GitHub pagesin avulla, jolloin saatiin valmiit ja jaettavissa olevat demoversiot. Opintojakson aikana opin paljon uutta Githubista ja en\u00e4\u00e4 sen k\u00e4ytt\u00f6 ei tunnukaan ongelmalliselta, vaan arkip\u00e4iv\u00e4iselt\u00e4.<\/p>\n

Vaikeuksia meille aiheutti kuitenkin projektinhallinta Zenhubissa. Alussa teimme liian suppean product backlogin ja m\u00e4\u00e4ritimme teht\u00e4ville liian suuria toimintopistem\u00e4\u00e4ri\u00e4. Emme my\u00f6sk\u00e4\u00e4n m\u00e4\u00e4ritt\u00e4neet erillisi\u00e4 valmiuskriteereit\u00e4 jokaisella\n teht\u00e4v\u00e4lle, emmek\u00e4 v\u00e4ltt\u00e4m\u00e4tt\u00e4 muistaneet sulkea teht\u00e4vi\u00e4 ajoissa. Zenhub pysyi kuitenkin suhteellisen hyvin ajan tasalla, vaikka sen k\u00e4ytt\u00e4minen oli vajavaista. Viimeiseen sprinttiin p\u00e4\u00e4timme kuitenkin tehd\u00e4 ryhtiliikkeen saamamme\n palautteen perusteella. Ennen t\u00e4t\u00e4 saimme Frostigonin Antony Smalilta t\u00e4rkeit\u00e4 vinkkej\u00e4 Zenhubin siistimiseen. Aloitimme taskien pilkkomisella pienemmiksi palasiksi, joiden toimintopisteet olivat v\u00e4h\u00e4isempi\u00e4. Kategorisoimme teht\u00e4v\u00e4t\n sen mukaan, millaiseen aihealueeseen ne liittyv\u00e4t. Lis\u00e4ksi m\u00e4\u00e4ritimme vihdoin jokaiselle erillisille teht\u00e4v\u00e4lle oman valmiusvaatimuksen, sek\u00e4 tiedostot joita sen t\u00e4ytt\u00e4miseen tuli muokata. Zenhubin, backlogien ja taskien hiominen\n kuntoon olikin mielest\u00e4ni yksi t\u00e4rkeimpi\u00e4 oppimiskokemuksia opintojakson tavoitteet huomioiden.<\/p>\n <\/div>\n <\/div>\n

\n \n <\/div>\n
\n \n
\n
\n \n \n \"\"\n
<\/div>\n <\/div>\n
\n Kuvassa Burndown report ennen ja j\u00e4lkeen siistimisen. Ensimm\u00e4isest\u00e4 kuvasta voi huomata, ett\u00e4 teht\u00e4v\u00e4t olivat isoja kokonaisuuksia, joita suljettiin paljon kerrallaan. Toisessa kuvassa taas n\u00e4kee, ett\u00e4 teht\u00e4v\u00e4t on sljettu ajallaan ja ne ovat kooltaan\n pienempi\u00e4. (Kuva lainattu ryhm\u00e4n Scrum Masterilta Petterilt\u00e4)\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n
\n \n \n
\n \n
\n \n
\n \n
\n
\n \n \n
\n \n
\n \n
\n \n \n

Itsearviointi<\/h2>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n
\n \n
\n \n
\n
\n \n \n
\n \n
\n \n \n
\n

Ticorporate on ollut pitk\u00e4 opintojakso, jonka aikana oma sek\u00e4 ryhm\u00e4ni toiminta on kehittynyt paljon. Alussa ty\u00f6skentely tuntui erikoiselta, enk\u00e4 v\u00e4ltt\u00e4m\u00e4tt\u00e4 edes tajunnut mik\u00e4 koko projektin p\u00e4\u00e4m\u00e4\u00e4r\u00e4 on. Alussa my\u00f6s meid\u00e4n, Frostigonin\n sek\u00e4 Trigendan v\u00e4linen yhteydenpito oli hidasta, jonka takia projektin alkutaipale oli hieman verkkainen. Ryhm\u00e4ll\u00e4 oli kuitenkin alusta alkaen hyv\u00e4 henki ja ty\u00f6motivaatio, joiden pohjalta ty\u00f6t alkoivat sujumaan ja ty\u00f6skentely alkoi\n tuntumaan arkip\u00e4iv\u00e4iselt\u00e4. Meille oli alusta alkaen ilmiselv\u00e4\u00e4 se, ett\u00e4 ty\u00f6t tullaan tekem\u00e4\u00e4n yhteisess\u00e4 ty\u00f6huoneessa niin, ett\u00e4 kaikki ovat kokoajan puheyhteyden p\u00e4\u00e4ss\u00e4. Kaikki tekiv\u00e4tkin p\u00e4\u00e4t\u00f6ksi\u00e4 tasavertaisesti ja ongelmista\n keskusteltiin. <\/p>\n

Ensimm\u00e4isen demon j\u00e4lkeen aloimme pit\u00e4m\u00e4\u00e4n entist\u00e4 aktiivisemmin yhteytt\u00e4 Frostigoniin sek\u00e4 my\u00f6s suoraan Trigendaan. T\u00e4st\u00e4 oli suuri apu, sill\u00e4 ulkopuolisen n\u00e4kemysten sek\u00e4 vaatimusten saaminen edisti projektia hurjasti. Opimme tiimin\u00e4,\n sek\u00e4 opin itse paljon asiakkaan kanssa ty\u00f6skentelyst\u00e4 ja asiakasl\u00e4ht\u00f6isyydest\u00e4. Alussa oli hankalaa selitt\u00e4\u00e4 teknisi\u00e4 edellytyksi\u00e4 tuotteen omistajille, mutta lopulta asioiden havainnollistamisesta yksinkertaisin termein tuli normaalia.\n Alussa saattoi my\u00f6s tuntua hankalalta tuoda omia mielipiteit\u00e4\u00e4n esille, mutta t\u00e4m\u00e4kin helpottui kuin keskustelut tiheytyiv\u00e4t. Uskalsin esimerkiksi ehdottaa Sampoa tekem\u00e4\u00e4n muutoksia h\u00e4nen visuaalisen ilmeens\u00e4 hahmotelmaan ja mielest\u00e4ni\n lopputuloksesta tulikin t\u00e4m\u00e4n ansiosta parempi. Tavallaan aluksi tuntuikin, ett\u00e4 oli vaikeaa antaa ammattilaiselle kehitysideoita, mutta t\u00e4m\u00e4 muuri murtui nopeasti. Mielest\u00e4ni varsinkin opintojakson loppuvaiheilla molemminpuolinen\n kanssak\u00e4yminen meid\u00e4n, Frostigonin ja Trigendan v\u00e4lill\u00e4 onkin ollut sujuvaa ja avointa.<\/p>\n

Itse opin projektin aikana paljon my\u00f6s sis\u00e4ll\u00f6ntuotannosta sek\u00e4 liiketaloudesta. Adobe Xd:n k\u00e4ytt\u00f6 oli kokonaan uusi asia, mutta siit\u00e4 tuli l\u00e4hes arkip\u00e4iv\u00e4ist\u00e4 ja sujuvaa. Opin ottamaan vastaan palautetta tiimil\u00e4isilt\u00e4ni sek\u00e4 hy\u00f6dynt\u00e4m\u00e4\u00e4n\n heit\u00e4 voimavarana suunnittelussa. Opin piirt\u00e4m\u00e4\u00e4n piirroshahmoja Procreaten avulla, sek\u00e4 k\u00e4ytt\u00e4m\u00e4\u00e4n piirtotablettia suunnitteluty\u00f6kaluna. WordPressin k\u00e4yt\u00f6st\u00e4 en muistanut paljoakaan, mutta nyt minusta tuntuu ett\u00e4 pystyn luomaan\n ja siirt\u00e4m\u00e4\u00e4n palvelimelle toimivan ja modernin n\u00e4k\u00f6isen hakukoneoptimoidun nettisivun. P\u00e4\u00e4sin my\u00f6s eroon esiintymispelostani erilaisten esitysten avulla sek\u00e4 opin lis\u00e4\u00e4 markkinoinnista, ostopersoonista ja liiketoimintasuunnittelusta.<\/p>\n

Viimeisimp\u00e4n\u00e4, muttei v\u00e4h\u00e4isimp\u00e4n\u00e4, olemme ryhm\u00e4mme ty\u00f6hyvinvointi-aktiviteettina pelanneet ajan salliessa GeoGuessr-maantietopeli\u00e4. Tavoitteemme olikin rikkoa peliss\u00e4 20 000 pistett\u00e4, jonka lopulta saavutimme heitt\u00e4m\u00e4ll\u00e4. Vaikka t\u00e4m\u00e4\n voi vaikuttaa ep\u00e4olennaiselta, mielest\u00e4ni t\u00e4m\u00e4 kuvaa sit\u00e4, kuinka hyvin ryhm\u00e4mme on toiminut yhteen ja kuinka hyv\u00e4 porukka meist\u00e4 lopulta hioutui. Projektin jatkokehityksest\u00e4 on jo k\u00e4yty alustavia keskusteluja ja toivonkin, ett\u00e4\n tulevaisuudessa ammattilaisk\u00e4yt\u00f6ss\u00e4 n\u00e4hd\u00e4\u00e4n valmis TrigendaDigi sovellus, eik\u00e4 vain pilotoitavaa demoa. Katsotaan, mit\u00e4 kes\u00e4, syksy ja productlab tuovat tullessaan. <\/p>\n <\/div>\n <\/div>\n

\n \n <\/div>\n
\n \n
\n
\n \n \n \"\"\n
<\/div>\n <\/div>\n
\n GeoGuessr enn\u00e4tyspisteet. Saa haastaa.\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n<\/div>","protected":false},"excerpt":{"rendered":"

Mik\u00e4 on TrigendaDigi? TrigendaDigi on websovellus, joka perustuu Trigenda-dialogimenetelm\u00e4n ja fyysisen Trigenda-tuotteen digitalisoimiseen. Projekti on tehty toimeksiantona Trigenda Oy:n ja Frostigon Oy:n toimesta. Trigendalta olemme saaneet apua ja vaatimuksia sovelluksen toiminnallisuuteen ja ilmeeseen, kun taas Frostigon on antanut meille teknisen ohjenuoran. Projekti on kehitetty kev\u00e4\u00e4ll\u00e4 2021 Ticorporate VIII-opintojakson aikana viiden hengen tiimin voimin. Projektinhallinnassa on […]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"page-templates\/full-width-page.php","meta":[],"_links":{"self":[{"href":"http:\/\/localhost\/wordpress\/wp-json\/wp\/v2\/pages\/675"}],"collection":[{"href":"http:\/\/localhost\/wordpress\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"http:\/\/localhost\/wordpress\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"http:\/\/localhost\/wordpress\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"http:\/\/localhost\/wordpress\/wp-json\/wp\/v2\/comments?post=675"}],"version-history":[{"count":20,"href":"http:\/\/localhost\/wordpress\/wp-json\/wp\/v2\/pages\/675\/revisions"}],"predecessor-version":[{"id":1440,"href":"http:\/\/localhost\/wordpress\/wp-json\/wp\/v2\/pages\/675\/revisions\/1440"}],"wp:attachment":[{"href":"http:\/\/localhost\/wordpress\/wp-json\/wp\/v2\/media?parent=675"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}