tirsdag 14. januar 2014

BarentsWatch tilpasset mobiler og andre skjermstørrelser



Det ble 19. desember lansert en ny versjon av BarentsWatch som gjorde sidene tilpasset til diverse mobiler og nettbrett, såkalt responsivt design. Det er ikke en egen mobil versjon, men tekniske endringer slik at det samme innholdet tilpasser seg avhengig av størrelsen på nettleser/skjerm. Om telefonen holdes liggende eller stående så vil innholdet presenteres forskjellig.



Som del av arbeidet ble mye av den bakenforliggende koden for det visuelle på sidene forenklet og noen funksjoner endret for å sikre tilgang ved bruk av peking (touch) i steden for mus.

I den foregående testingen kom det mange gode innspill som ble tatt hensyn til i den endelige versjonen (se under for en oppsummering).

Vi ønsker også innspill på den endelige versjonen som også har rom for utbedring og kan inneholde problemer vi har oversett. Kom gjerne med innspill på ting som fungerer bra også!


Om du gir innspill, informer gjerne om:
  • Type enhet: iPad X, iPhone X, Samsung X, HTC X etc
  • Operativsystem: iOS/Android/Windows - evt PC/MAC
  • Browser/nettleser: Safari, Chrome, Internet Explorer, Firefox etc
  • Har du et skjermbilde du vil dele kan du sende dette til post@barentswatch.no
  • Sidene kan også testes på PC/mac ved å lage vinduet ditt like smalt som en mobiltelefon.
  • Se gjerne på hva andre har kommentert og se om du får samme problem eller ikke. 
  • Si gjerne om du mener det du rapporterer er kritisk eller kosmetisk.

Vi vil særlig jobbe med forbedringer av kartklient og havneoversikt på mobil.
Kommentarer til innspillene i testperioden:

Tilbakemeldinger fra bloggen
Testing av mobile sider desember 2013

Oppsummering

De fleste tilbakemeldingene vi fikk gjaldt kart og havneoversikt på mobil. Vi har fått rettet opp en del feil, og fått noen gode forbedringsforslag som vi tar med oss videre. Vi ble spesielt glade for testingen som ble gjort på Windows Phone, for der ble det funnet noen alvorlige bugs vi ikke var klar over.
Vi setter pris på at så mange tok seg tid til å teste, og at feilrapportene var så godt beskrevet at det var enkelt å gjenskape de fleste av dem.

Svar pr tilbakemelding

Lite plass til kartet på mobil

Tilbakemeldinger

Pål Julius Skogholt 17. desember 2013 kl. 16.50 - Hei, her pilot.barentswatch.net/Kart/Havets-ressurser/Korallrev/ er den viktigaste informasjon (kartet) avskriven med alt for lite plass. Informasjonen over kartet bør kunne skjulast i ein meny. Testa på Xperia Z med Opera.

Eivind Rinde - 19. desember 2013 kl. 11.09 - I skjermbildene der kartet er viktig er det for mye tekst/annen info slik at kartet blir lite. Dette gjelder både for mobilt og PC bruk 

Svar

Det er lagt inn et kryss-ikon i høyre hjørne for å lukke informasjonen. Det er også lagt inn transparent bakgrunn på informasjonen, slik at man ser at det er noe bak. På sikt jobber vi mot en løsning der kartklienten, på mobil og stor skjerm, vil være en fristilt funksjon uten menyene fra de vanlige sidene.

Timeslider

Tilbakemeldinger

Gjermund Haugen 17. desember 2013 kl. 17.18- Får ikke timeslider til å fungere på f.eks temp+vindobservasjoner på Android - Samsung Galaxy S4 - verken chrome eller standardnettleser.

Gjermund Haugen 17. desember 2013 kl. 17.25 - Får ikke timeslider til å fungere for MET-kartlag på Samsung Galaxy S4/Android/chrome+standardnettleser i stående modus. I liggende modus får jeg til å spille gjennom (play) innen et døgn/måned/år, men ikke manuelt og f.eks over midnatt.
  

Svar

Det å lage en god timeslider på mobil er en utfordring, og vi ser at brukeropplevelsen kan forbedres også på desktop. Foreløpig skjules avspillingsmuligheten på små skjermer.

Ytelse og havnebilde

Tilbakemelding

Gjermund 18. desember 2013 kl. 09.08 - To kommentarer fra en iphone-bruker:
-lasting av første side tok lang tid. Jeg var på 3G-nettet
-havneoversikten: bildet av havna og kartet ble satt sammen under hverandre. Ellers ganske "snasent" å få portalen på mobil! Bra

Svar

Dersom det ble testet like etter prodsetting så kan det hende det ble ekstra tregt fordi cachen var slettet. Den første som går inn på siden vil oppleve den som ekstremt treg, så kanskje var Gjermund «uheldig» og var først inne.
Ellers ønsker vi selvsagt å optimalisere ytelsen så mye som mulig, ved å redusere størrelse på filer og antall requests. Forsiden på barentswatch.no er ca 1 MB for øyeblikket.  
Havneoversikten: Mye av innholdet stables under hverandre på små skjermer. Det gjelder også bildet og kartet over havna.

Lupesymbol

Tilbakemelding

Magne Velle 18. desember 2013 kl. 09.15 - Det funka fint for meg, både i liggande og ståande format. Eg har Sony Xperia Z med Android 4.2.2. Det einaste er at når eg ser eit lupesymbol på eit bilete, forventar eg at eg skal kunne trykke på biletet og forstørre det. Det funka ikkje. Helsing Magne

Svar

Denne klarer vi ikke å gjenskape. Det finnes ikke bilder med lupesymbol, og heller ikke funksjonalitet for å forstørre bilder (enda).  Det kan hende han har forvekslet det rosa kartsymbolet som ligger i øverste venstre hjørne på bilder som tilhører artikler med kartutsnitt, med et lupesymbol...

Menyfeil på Internet Explorer

Tilbakemelding

18. desember 2013 kl. 09.39 - Kosmetisk: "Føsteside" kommer opp fint, sideveis sveiping og meny fungerer fint. Lettlest og mye "luft", men BarentsWatch logo er 90% skjult bak bilde øverst. Det er dermed kun webadressen som forteller meg at jeg er på BarentsWatch sine sider. Det samme kan fremprovoseres i Internet Explorer på PC ved å gjøre vinduet like smalt som en mobiltelefon.
Feilen fremkommer når mobil brukes stående. Benyttes den liggende, kommer skrivebordsversjonen opp. Mobil: Nokia Lumia 920, Windows Phone 8, Internet Explorer 10 mobile. Willy Gautvik, Kystverket.

Svar

Denne har vi fikset.

Zooming i kart på Windows Phone

Tilbakemelding

18. desember 2013 kl. 09.49 - Feil: Det er ikke mulig å zoome i kart i mobilversjonen. På Pc kan en benytte musehjulet til dette. På mobil, vil forsøk på å zoome ved pinching føre til at en forstørrer hele nettsiden, ikke kartet. Mobil: Nokia Lumia 920, Windows Phone 8, Internet Explorer 10 Mobile.
Willy Gautvik, Kystverket

Svar

Ifølge http://docs.openlayers.org/library/mobile.html er det ikke støtte for touch events i Open Layers 2 på Windows Phone 7. Muligens gjelder dette også Windows Phone 8. Dessverre får vi ikke fikset denne så lenge vi bruker Open Layers 2 på kartene.

Menyfeil engelsk/norsk

Tilbakemelding

18. desember 2013 kl. 10.03 - Feil: I mobilversjonen: Dersom en skifter til engelsk språk, slutter navigasjonsmenyen å fungere slik den skal. Skifter en til en annen side via menyen (når språket er endret til engelsk), ledes en kun til tomme sider med kun overskrift.
Dette kan også fremprovoseres i Internet Explorer på desktop ved å gjøre vinduet så smalt at moblversjonen trer i kraft. Willy Gautvik, Kystverket

Svar

Denne har blitt fikset. Menyen fungerer på engelsk nå.

PDF (havneoversikt)

Tilbakemelding

Eivind Rinde 19. desember 2013 kl. 10.19 - PDF i Nasjonal Havneoversikt: Det er noen uheldige sideskift. Overskrift Proviant for Bodø blir stående sist på side. For Tromsø står Spillolje alene på siste side. Vet ikke om det er systematisk

Svar

Her har vi lagt inn en fix, men vi vet ikke om det fungerer før vi har generert opp alle pdfene på nytt. Forhåpentligvis vil det fungere, men det gjenstår å se…

Tegnforklaring borte på mobil (havneoversikt)

Tilbakemelding

Eivind Rinde 19. desember 2013 kl. 11.25 - Kartinformasjonen/forklaring på Havneoversikten blir borte med smalere/mobil browser

Svar

Vi har skjult denne for små skjermer pga plassproblem. Det kan hende vi også burde gjort alle ikonene like – for når det er forskjellig farge på dem så lurer man jo på hvorfor…

Zooming i kaikart

Tilbakemelding

Eivind Rinde 19. desember 2013 kl. 12.21 - Havneportal: Zoom/sentrering av kaikart er ikke helt god på mobil/smal versjon, f.eks Harstad. Kaiene er utenfor bildet.

Svar

Denne har vi ikke gjort noe med enda, men har den på blokka!

Ingen kommentarer:

Legg inn en kommentar

Vil du legge igjen en kommentar?

1) Hvis du har google-konto, velg Profil: Google i lista under, logg på slik det forklares og skriv inn som en offentlig synlig leser. (foretrekkes)

2) Hvis du ikke har google-konto; velg Profil: Anonym i lista under, skriv inn kommentar og signer med navn og arbeidssted.

Takk for at du bidrar til at BarentsWatch-bloggen blir et sted for informasjons- og meningsutveksling!