Labs

Tälle sivulle on kerätty kiinnostuksen kohteita ja tutkinnan alla olevia Labs kokeiluja.

Fonttikokeilu (Bitter) 
Fonttikokeilu (Montserrat)
Fonttikokeilu (Roboto)
Fonttikokeilu (Open Sans)

Ilmaisia kuvapalveluja:

Inspiroivia verkkosivuja: 

Tekoälyä hyödyntävät lasit

Tekoälyä hyödyntävät älylasit ovat nousseet teknologiamaailman kuumaksi puheenaiheeksi, yhdistäen muotia ja huippuluokan toimintoja. Näitä laseja kehitetään paitsi arjen helpottamiseen myös uusien kokemusten tarjoamiseen. Esimerkiksi Meta Ray-Ban -älylasit ja Even Realitiesin kaltaiset innovaatiot vievät teknologiaa askeleen lähemmäs jokapäiväistä elämää. Kehitys on nopeaa ja uusien mallien julkaisujen odotetaan kiihtyvän.

Edut keskittyvät tyylikkyyteen, reaaliaikaisuuteen ja monipuolisuuteen, mutta haasteina ovat yksityisyys, akunkesto ja kustannukset. Käyttökohteet vaihtelevat viihteestä ammattityöhön ja kehitys lupaa entistä saumattomampaa teknologian integraatiota arkeen.

Virtuaalitodellisuus uutiset

Tässä on lista sivustoista, joista voi saada viimeisimmät lisätyn todellisuuden (AR, Augmented Reality) uutiset. 

TechCrunch: https://techcrunch.com/
TechCrunch raportoi laajasti teknologiasta, mukaan lukien AR-innovaatiot, startupit ja laitteet. Sopii erityisesti uusimpien AR-teknologioiden seuraamiseen.

The Verge: https://www.theverge.com/
The Verge kattaa AR-uutisia osana laajempaa teknologiakenttää, keskittyen laitteisiin, ohjelmistoihin ja kuluttajasovelluksiin.

ARPost: https://arpost.co/
ARPost on erikoistunut nimenomaan lisättyyn todellisuuteen, tarjoten syvällisiä artikkeleita, arvosteluja ja alan uutisia.

Road to VR: https://www.roadtovr.com/
Vaikka sivusto keskittyy virtuaalitodellisuuteen (VR), se kattaa myös AR-uutisia, erityisesti laitteisiin ja kehitykseen liittyen.

VentureBeat: https://venturebeat.com/
VentureBeat seuraa AR:ää osana laajempaa teknologiakenttää, keskittyen liiketoimintaan, investointeihin ja teknologian kehitykseen.

Meta Ray-Ban Smart Glasses (3. sukupolvi)

https://www.meta.com/fi/ai-glasses/

Edut: 

Haasteet: 

Käyttökohteet: 

Suomessa Silmäasema myy Ray Ban älylaseja ja niitä voi käydä kokeilemassa heidän liikkeissään. Itse pidin niistä ja mm. musiikin kuuntelu sujui vaivatta.

https://www.silmaasema.fi/artikkeli/ray-ban-meta.html

Even Realities G1

https://www.evenrealities.com/g1

Edut: 

Haasteet: 

Käyttökohteet: 

Samsung Smart Glasses (tulossa 2025)

https://blog.google/products/android/android-xr/

Edut: 

Haasteet: 

Käyttökohteet: 

Kaareva näyttö

Tietokoneen näytöt ovat kehittyneet hurjasti viime vuosina, ja erityisesti kaarevat näytöt, kuten Lenovo ThinkVision T34w-30, ovat nousseet suosituksi vaihtoehdoksi niin toimistokäytössä kuin kotona. 

Näytöt vaihtelevat kooltaan, resoluutioltaan, paneelityypiltään (esim. IPS, VA, TN) ja ominaisuuksiltaan. Kaarevat näytöt, kuten ThinkVision T34w-30, tarjoavat laajemman katselukulman ja immersiivisemmän kokemuksen, mikä voi parantaa tuottavuutta ja mukavuutta varsinkin laajalla näytöllä työskennellessä. Nykyaikaiset näytöt sisältävät usein myös lisäominaisuuksia, kuten sinivalon suodatusta, monipuolisia liitäntöjä (HDMI, DisplayPort, USB-C) ja ergonomisia säätömahdollisuuksia.

Lenovo ThinkVision T34w-30 34" -kaareva näyttö

Lenovo ThinkVision T34w-30 on suunniteltu erityisesti tehokkuutta ja mukavuutta arvostaville käyttäjille, kuten toimistotyöntekijöille tai moniajoa harrastaville. 

Koodikokeiluja: 

"Labs Mouse Color Shift" ; "Labs Real-Time Clock" ; "Labs Animated Wave Background" ; "Labs Spinning 3D Cube"

Koodikokeilu: Mouse Color Shift - Liikuta hiirtä!

Kuvaus

Kun liikutat hiirtä sivulla, tausta vaihtaa väriä pehmeästi hiiren sijainnin perusteella. Efekti käyttää HSL-värimallia, joten se pysyy harmonisena ja hillittynä. Labs: Mouse Color Shift: Liikuta hiirtä ja katso taustan muuttuvan! [väriä vaihtava alue vieressä ja koodi alla]

Tyyli: html

<!-- Labs-osio HTML -->
<div id="color-shift">
 <p>Mouse Color Shift - Liikuta hiirtä!</p>
</div>
<!-- CSS -->
<style>

  #color-shift {
    padding: 20px;
    text-align: center;
    min-height: 100px; /* Voit säätää kokoa */
    transition: background-color 0.3s ease; /* Pehmeä siirtymä */

  }

</style>
<!-- JavaScript -->
<script>

  const area = document.getElementById('color-shift');
  document.addEventListener('mousemove', (event) => {
    const x = event.clientX / window.innerWidth; // Hiiren X-sijainti (0-1)
    const y = event.clientY / window.innerHeight; // Hiiren Y-sijainti (0-1)

    // HSL-väri: sävy (hue) muuttuu X:n mukaan, kylläisyys ja kirkkaus Y:n mukaan

    const hue = Math.floor(x * 360); // 0-360 astetta
    const saturation = Math.floor(y * 100); // 0-100%
    const lightness = 50; // Kiinteä kirkkaus, voit säätää
    area.style.backgroundColor = `hsl(${hue}, ${saturation}%, ${lightness}%)`;

  });

</script>

Koodikokeilu: Real-Time Clock

Kuvaus

Kello näyttää paikallisen ajan ja päivittyy joka sekunti JavaScriptin avulla. Se on selkeä ja yksinkertainen, ilman turhia koristeita.

Koodi: html

<!-- Labs-osio HTML -->
<div id="clock">
  <p>Real-Time Clock</p>
  <span id="time"></span>
</div>
<!-- CSS -->
<style>
  #clock {
    padding: 20px;
    text-align: center;
  }
  #time {
    font-family: monospace; /* Selkeä, minimalistinen fontti */
    font-size: 1.5em; /* Säädä kokoa tarpeen mukaan */
  }
</style>
<!-- JavaScript -->
<script>
  function updateClock() {
    const now = new Date();
    const hours = String(now.getHours()).padStart(2, '0'); // 2 numeroa, esim. "09"
    const minutes = String(now.getMinutes()).padStart(2, '0');
    const seconds = String(now.getSeconds()).padStart(2, '0');
    const timeString = `${hours}:${minutes}:${seconds}`;    document.getElementById('time').textContent = timeString;
  }
  // Päivitä kello heti ja sitten joka sekunti
  updateClock();
  setInterval(updateClock, 1000);
</script>

Tässä on yksinkertainen, toimiva ja visuaalisesti selkeä HTML-pohjainen ammuntapeli: "Avaruusampuja".

Pelin kuvaus:

Pelin ominaisuudet: