Design, UX, Teknologi & Ytelse - når din portal blir enda bedre!

Design, UX, teknikk og ytelse - når din portal blir enda bedre!

Stefan Petri
publisert:

Fra iøynefallende og slående til ganske diskret og likevel nyttig – i løpet av de siste ukene og månedene har vi gjort en rekke endringer på TutKit.com. Dette inkluderer ytelsesforbedringer og tekniske oppdateringer, så vel som tilpasninger i design og brukeropplevelse. Alt i alt har dette en positiv innvirkning på din brukeropplevelse. En omfattende oversikt over hva som har endret seg under panseret og på toppen.

Nå blir det mørkt

Fra nå av kan du når som helst med bare ett klikk endre designet til mørkt eller lyst. Vi har satt det som standard i samsvar med operativsystemet.

Aktiver mørkt design på TutKit.com.

I samme ånd har vi også konvertert alle bilder til AVIF-format, slik at nettleseren din ikke trenger å laste ned så mye data (ca. 70% reduksjon i filstørrelse for bildene).


Ressurser, maler og e-bøker: mer på en rask titt, uten unødvendig klikking

Tradisjonelt har vi vist små forhåndsvisningsbilder for innholdet på sidene våre for ressurser, maler og e-bøker. På den måten ser du direkte hva du kan forvente når du laster ned.

Bak hvert forhåndsvisningsbilde var det også en liten meny. Gjennom den kunne du forstørre forhåndsvisningsbildet, markere innholdet som favoritt og hente kompatibilitetsanvisninger. Hyggelig ... Men det betydde også at du måtte åpne menyen for å forstørre hvert bilde, klikke på et ikon, se på bildet og lukke det før du gikk til det neste. En unødvendig omvei. Derfor har vi fjernet menyen. Nå er det nok å føre musepekeren over et lite forhåndsvisningsbilde, og voilà: Den store versjonen vises.

Ved revisjonen oppstod også ytterligere nyttige tilpasninger: Kompatibilitetsanvisningene kan nå nås via det direkte synlige ikonet med informasjon-i. Favoritter for innholdet kan markeres via det også direkte synlige stjerneikonet, som dessuten nå bare vises for innloggede brukere.

Hover-effekten på enkelte elementer
Redusert til det vesentlige: Når du ser på våre enkeltinnhold, trenger du bare å sveve over forhåndsvisningsbildet for å se det i stor størrelse. Flere funksjoner som tidligere var skjult i en meny, er nå direkte tilgjengelig via ikoner.

Videoopplæringer: Nå kan du også være visuelt informert her!

Hvis du for en stund siden besøkte en av sidene våre med videoopplæringer, møtte du ikke mye mer enn en overveiende grå ørken av tekster og avspillingsknapper. Visningen har blitt fullstendig revidert, slik at den nå tar opp layouten til ressurser, maler og e-bøker.

Med andre ord: Også i våre videoopplæringer vises nå små forhåndsvisningsbilder, som rett og slett ser mer estetisk tiltalende ut. Om videoen er gratis eller en fersk oppdatering, kan du – som med ressurser – se i form av fargede merker på bildene.

Ny visning: videoer med forhåndsvisningsbilder
Fra grå til wow: Mens du tidligere bare så avspillingsknapper på videoopplæringene, viser vi nå også forhåndsvisningsbilder på opplæringene.

Dermed presenterer sidene våre seg nå konsekvent ensartet. Uansett om det er en ressurs, mal, e-bok eller videoopplæring: Det er et forhåndsvisningsbilde som forstørres når du svever over det; det er en knapp for nedlasting eller avspilling av videoen; det er ikoner for mer informasjon og for favoritter; hvis det er tilgjengelig ytterligere materiale som prosjektfiler, veiledninger eller tekstbaserte opplæringer, finner du lenkene til disse nederst i beskrivelsestekstene.

I tillegg har unødvendige ting som trekantikoner for å kunne åpnes og lukkes for tekstene blitt fjernet, slik at visningen nå kommer mer ryddig frem etter prinsippet "mindre er mer". Alle optimaliseringer er til slutt også laget for mobile enheter.

Stor opprydning på sidene for totalpakker

Hva kan fjernes? Hva kan vises annerledes? Hva kan plasseres på en bedre måte? Slike spørsmål rettet vi til sidene våre for totalpakker, for å gjøre dem slankere samtidig som vi fortsatt opprettholder informasjonsinnholdet. I tillegg til de allerede nevnte endringene i visningen av enkeltinnhold, gjorde vi følgende tilpasninger:

Galleri: I galleriene viser vi hvordan du for eksempel kan bruke våre ressurser og maler. Tidligere var det en roterende effekt her. Søtt, men også distraherende. Vi har derfor redusert visningen av det nye galleriet til akkurat tre ting: du ser det valgte bildet, en undertittel og navigasjon til venstre og høyre – uten store effektbråk rundt.

Åpne og lukke og litt mer farge: Inntil nylig kunne nesten hver seksjon på en totalpakker-side åpnes og lukkes, med tilsvarende knapper i form av trekanter tilgjengelig. Denne funksjonen ble fjernet. Gjør sidene enda renere – og la oss være ærlige: Er det noen som noensinne har brukt denne funksjonen? Ved siden av dette har vi jevnlig tilført mellomoverskriftene mer farge. Fra øverst til nederst skiller nå en myk TutKit-grønnfarge de forskjellige områdene fra hverandre, i stedet for en klumpete svart farge.

Info-område: Øverst til høyre på totale pakkesider samler vi all tilleggsinformasjon, for eksempel angående kompatibilitet, antall innhold og kategorier. Det samler seg en del data her.

Vi har ryddet opp og forbedret illustrasjonene i info-området. Læringsprogresjonen i opplæringsprogrammer vises nå bare for innloggede brukere (utloggede besøkende trenger den ikke likevel). Vurderingen av pakkene våre har flyttet ned til kommentarområdet. Nytt i info-området er en lenke til bruksrettighetene. Den mest synlige endringen gjelder fremstillingen av personene som har laget pakken. I stedet for navnene deres viser vi deg portrettene deres. Forhåpentligvis vil det også virke litt vennligere på deg ...

Mange små detaljforbedringer:

  • ikke mer slider-navigasjon for programvare/kategorier
  • generelt kontinuerlig rulling i søk, kategorisider osv.
  • Kort: mindre skygger, bort med ikoner, firkantede hjørner
  • Kort: bort med animasjon, i stedet grønt overlapp
  • Hover-effekt for splittknapp optimalisert
  • Større ansikter, for eksempel i blogg og videovisning
  • Ansikt i kontaktskjemaet
  • Fotlinje helt ny (ingen åpning mer, vis ansikt osv.)
  • Forfatterside: "Til forfatterens nettsted" bort, kontinuerlig rulling, grønne overlapper
  • Forside: Nye innhold vises ikke lenger som slider
  • 4 kolonner for forfattere
  • Sidesteg i pop-ups
  • ny modul for målgrupper

Med færre spørsmål om ytelsesforbedring

Raske sider som laster raskt – Google liker det, vi liker det, og du liker det sikkert også. Når det gjelder ytelsen til portalen vår, vil vi fortsette å gjøre forbedringer i fremtiden. For eksempel har vi implementert bildeoptimalisering. De ble nemlig byttet fra det slanke JPG-formatet til de mye slankere WEBP- og AVIF-formatene.

I tillegg har vi jobbet med databaser og spørringer som foregår når sidene våre lastes. Ganske teknisk altså, men for å gi et eksempel: Når du besøker en av sidene våre med opplæringspakker, må systemet blant annet vite hvor langt du kan se videoene. Har du medlemskap? Har du kjøpt pakken? Er enkelte videoer kanskje gratis? Slike spørsmål må vi stille en masse ved sidevisning, noe som selvfølgelig tar tid. Derfor fokuserer vi på ytelsesforbedring her (OBS, nå blir det virkelig teknisk):

  • Unødvendige databaseforespørsler som ba om mer informasjon enn nødvendig, ble fjernet.
  • Hastigheten på de mest utførte databaseforespørslene ble forbedret.
  • Koden i PHP-metodene ble optimalisert, og gjentatte databaseforespørsler i visse løkker ble eliminert.
  • Alle deler av systemet vårt ble gjennomgått for unødvendige databaseforespørsler som ble brukt på alle sider, spesielt de som var knyttet til menyvalgene våre. Disse ble optimalisert for bedre ytelse.
  • Det ble oppdaget at noen databaseforespørsler ble gjentatt unødvendig mange ganger, spesielt de som koblet brukere til pakker. Disse repetisjonene ble løst ved hjelp av et midlertidig bufferlagersystem (cache), noe som sparte både tid og ressurser.
  • Systemets feillogg ble overvåket, og alle rapporterte problemer ble løst.
  • Automatiske systemoppgaver (cronjobber) ble gjennomgått for å identifisere de som tok for lang tid eller brøt sammen. Disse oppgavene ble gjort mer effektive ved å filtrere informasjon direkte fra databasen i stedet for å gjøre dette indirekte via PHP-kode.

Er alt teknisk oppdatert? Ja, alt er oppdatert!

Vi har selvfølgelig også optimalisert mye under panseret og oppdatert programvarepakker som:

  • Oppdatering til nyeste versjon av PHP.
  • Laravel (rammeverket vårt) ble oppdatert fra versjon 9 til 10.
  • Nesten 35 pakker fra rammeverket ble oppdatert, samt SDK fra betalingsleverandøren vår, Braintree.
  • Vi bruker nå http2 (vi ville helst bruke versjon 3, men Apache-serveren støtter den (foreløpig) ikke.
  • Ubuntu ble oppdatert fra 20.04 til 22.04 (viktig for AVIF-bildestøtte).

Hva kommer fremover?

Vi jobber intenst med å gjøre portalen vår tilgjengelig flerspråklig fra januar. Det er en betydelig innsats, men det vil gjøre oss stolte når vi har oppnådd det.

I tillegg vil det fra neste uke være mulig å kjøpe enkeltinnhold med rabatt hvis det er en kampanje. Dette fører til at vår separate butikk (shop.psd-tutorials.de) ikke lenger blir oppdatert med nye produkter, og vil også være offline senest innen utgangen av første kvartal 2024, og alle våre innhold vil bare være tilgjengelig på TutKit.com.

Vi har også planer om å sende ut nyhetsbrev minst 1 gang i måneden i 2024, slik at alle medlemmer og abonnenter får se hva som er nytt. For en ting har vi alltid klart: Hver uke har det blitt lagt ut minst én nytt innhold online!

Selvfølgelig vil vi fortsette å tilby interessante nye innhold. Jeg har for eksempel lyst til å lage et nytt opplæringsprogram om Adobe Photoshop Elements, siden det endelig har skjedd noen endringer på grensesnittet og det er nå verdt å lage et helt nytt opplæringsprogram om det. Temaet kunstig intelligens vil fortsatt oppta oss, og vi vil oppdatere eksisterende produkter eller lage helt nye produkter i den forbindelse.

Mangler det noe? Da kan du gjerne sende meg en e-post til info@tutkit.com. Jeg ville også bli glad hvis bloggen fikk en kommentarfunksjon. Hva synes du? Forståelig eller kommenterer nesten ingen likevel på grunn av tidsmangel?

Publisert av Stefan Petri
Publisert:
Fra Stefan Petri
Stefan Petri driver sammen med sin bror Matthias det populære fagforumet PSD-Tutorials.de samt e-læringsplattformen TutKit.com, som setter et fokus på utdanning og videreutdanning av digitale profesjonelle ferdigheter. 
Tilbake til oversikten