Slik gjorde vi det: E39

Sent om kvelden 2. pinsedag tikka meldinga inn til redaksjonen om at avgjørelsen for hvor den nye E39 skal gå, var tatt. Erna Solberg fortalte at den såkalte indre-traséen ble valgt, og det vakte reaksjoner. Men hva er egentlig indre-traséen og midtre-traséen? Vi ville gjøre det litt enklere for folk å orientere seg, så vi bestemte oss på formiddagen tirsdag for å legge ut et kart som toppelement til en kommentar fra samfunnsredaktør Jan Erik Røsvik.

Teknisk sett er det et tidligere laga  illustrator-kart lagra som jpg, lagt inn i en enkel html-template for interaktiv-sidene våre. Ikke veldig avansert, men veldig effektivt. Templaten gjør at vi får slike prosjekter ut på nett i løpet av en halvtime.

Reklamer

RUSH i Ålesund fikk hederlig omtale fra NONA

Artikkel hentet fra smp.no

Sunnmørsposten hedret for nettjournalistikk

Konkurrerte med NRK og TV 2 om årets nettsak.
Sunnmørsposten fikk diplom og hederlig omtale under NONA14-konferansen (The Norwegian Online News Organisation) i Oslo onsdag ettermiddag. Nettprosjektet «Rush i Ålesund» gikk til finalen i klassen for redaksjoner under 50 ansatte, der NRK P3DOKUMENTAR til slutt stakk av med seieren. I tillegg til Sunnmørsposten, fikk også tv2.no heder for sitt «Bom-o-meter».

I juryens begrunnelse for å gi hederlig omtale til Sunnmørsposten, heter det at «Dette er journalistikk som tar det lokale på kornet, og det må gjøres digitalt. Dette funker ikke på noen annen måte. Det at avisen da velger å bruke så mye tid og krefter på et prosjekt som dette, vitner om at de tør å satse. Det er ikke stor og viktig journalistikk, men det er en snakkis for en lokalavis som er superlokal. Vitner om overskudd lokalt, og det bør verdsettes.»

– Ett av jurymedlemmene sa om smp.nos prosjekt at «Det her er veldig snacksy og helt etter mitt hjerte for å kombinere ulike medier. Det er også et godt grep for å registrere et godt poeng», uttalte NONA-leder Ingeborg Volan da Sunnmørspostens Tormod Utne mottok hedersprisen på vegne av avisa.

Juryen besto av Tone Libråten (NRK), René Svendsen (Fredriksstad Blad), Reidun Kjelling Nybø (Norsk redaktørforening) og Dan Kåre Engebretsen (VG). I klassen for redaksjoner over 50 ansatte, vant bt.no for «Jannes historie», mens «Null CTRL» og «To Russia with Love» (Dagbladet.no) fikk hederlig omtale. Årets netthode 2014 ble Inge Thorud, utviklingssjef i DB Medielab.

Fikk heder Prisvinnere, diplommotakere og juryen for netthodeprisene 2014. Fra venstre: Tormod Utne (Sunnmørsposten), Ola Strømman, Inge Thorud og Eugene Brandal Laran (Dagbladet), Nareas Sae-Khow (NRK P3dokumentar), Tove Knutsen (Bergens Tidende) og jurymedlemmene Dan Kåre Engebretsen, Tone Libråten og Reidun Kjelling Nybø. TV2 fikk også hederlig omtale, men var ikke til stede da bildet ble tatt. FOTO: MORTEN KARLSEN, NETTAVISEN

Fikk heder Prisvinnere, diplommotakere og juryen for netthodeprisene 2014. Fra venstre: Tormod Utne (Sunnmørsposten), Ola Strømman, Inge Thorud og Eugene Brandal Laran (Dagbladet), Nareas Sae-Khow (NRK P3dokumentar), Tove Knutsen (Bergens Tidende) og jurymedlemmene Dan Kåre Engebretsen, Tone Libråten og Reidun Kjelling Nybø. TV2 fikk også hederlig omtale, men var ikke til stede da bildet ble tatt. FOTO: MORTEN KARLSEN, NETTAVISEN

 

Slik gjorde vi det: Festivalguiden

Kulturgruppa i Sunnmørsposten har fòret folket med informasjon om festivaler hver sommer. Men vi har aldri laget en digital oversikt, det synest vi det var på tide å gjøre noe med. Etter NICAR satt jeg igjen med bl.a. litt kunnskap om Python, og prosjektet jeg gjorde der, passet godt som utgangspunkt til en festivalguide. Tanken med guiden var å la folk ta utgangspunkt i sine behov og la guiden finne den perfekte festivalen for dem. Så den starter med tidspunkt for når vil du gå på festival, deretter plotter du inn hva du er interessert i, hva du ønsker å betale og hvilke spesielle behov du har.

Vi tok utgangspunkt i et Google docs-skjema som flere journalister la inn informasjon på, og jeg satte opp en lokal server på maskina og bygget prosjektet derfra. Med Python slapp jeg da å lage en detalj-side for hver enkelt festival, men kunne generere detalj-sider ut fra ett enkelt html-dokument. Genialt og utrolig tidsbesparende! Jeg brukte også github underveis for å lagre versjoner av koden etterhvert som den ble utviklet. Sorteringsfunksjonen ble vi spesielt fornøyde med, den fant vi her. Til slutt kjørte vi freeze.py og genererte ut alle statiske filer som vi la ut på serveren vår.

Vi vet at vi ikke har fått med rubbel og rake av festivaler i Nordvest (for det finnes vanvittig mange små og mellomstore festivaler der ute), derfor la vi inn et Google Form så folk kan sende inn sine festivaler. Og det gjør de, så guiden kommer til å vokse fremover. Vi har allerede oppdatert noen av funksjonene også, og det kommer til å jobbes videre etterhvert som vi samler inn erfaringer og får tilbakemeldinger.

Festivalguiden ble lansert 28. mai, prøv den selv her.

Liv-Jorunn

Bilde

Slik gjorde vi det: Bomkalkulatoren

En mandag seint i mai fikk vi besøk av Jens Finnäs fra J++ i Sunnmørsposten. Han var her i forbindelse med et kurs i regi av NxtMedia om å «komme i gang med datajournalistikk» som var åpent for alle. Vi benytta anledningen til å få utvikla en enkel kalkulator der folk kunne regne ut sine bomutgifter når den nye bypakken i Ålesund blir rulla ut.

Det fine med å snakke med folk som kan er at svaret på om dette var mulig var «ja, du behöver bara lite javascript». Så da satte vi oss ned, og jeg lærte å skrive javascript fra grunnen av. Slik ser hele koden ut:

 

<!doctype html>
<html lang=»en»>
<head>
<meta charset=»utf-8″>
<link rel=»stylesheet» type=»text/css» href=»http://static.polarismedia.no/skins/prod/global/css/reset.css»/&gt;
<link rel=»stylesheet» type=»text/css» href=»http://static.polarismedia.no/skins/prod/global/css/grid980.css»/&gt;
<link rel=»stylesheet» type=»text/css» href=»http://static.polarismedia.no/skins/prod/global/css/global.css»/&gt;
<link rel=»stylesheet» type=»text/css» href=»http://static.polarismedia.no/skins/prod/group/polarisBundle/css/polarisBundle.css»/&gt;
<link rel=»stylesheet» type=»text/css» href=»http://static.polarismedia.no/skins/prod/publication/smp/css/smp.css»/&gt;
<link rel=»stylesheet» type=»text/css» href=»http://static.polarismedia.no/skins/prod/global/css/adtech-colorbox.css»/&gt;
<link rel=»stylesheet» type=»text/css» href=»http://static.polarismedia.no/skins/prod/global/css/widget.polaris.jobClassifieds.css»/&gt;
<script type=»text/javascript» src=»http://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.1/jquery.min.js»&gt;
</script>

<!– Mobilview først–>
<meta name=»viewport» content=»width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no»>
</head>

<body>
<style type=»text/css»>
#kalkulator select{
font-size: 18px;
}

#kalkulator .question{
margin-top: 35px;
}

#kalkulator .cost{
text-align: right;
}

#kalkulator h3{
margin-bottom: 0px;
margin-top: 35px;
font-size: 18px;
}

#kalkulator {
padding: 25px;
}

#kalkulator .options label{
font-size: 12px;
display: inline-block;
}

#kalkulator .result{
max-width: 330px;
}

</style>
<div class=»container egghvit» id=»kalkulator»>
<h2>Regn ut hvor mye bypakken vil koste deg</h2>
<p>Bypakken i Ålesud ble vedtatt 22.mai. Fra 2016 og i 16 år fremover blir det bomring rundt byen. En bompassering koster 20 kroner for personbil og 60 kroner for biler over seks meter. Én passering gjelder i én time, mellom 17.00 og 22.00 gjelder tretimersregel. Kjøp av bombrikke gir 10% rabatt.</p>
<form onchange=»countCost()»>
<div class=»questions»>
<div class=»question»>
<div class=»text»> <h3>Hvor mange dager i uka kjører du bil til jobben?</h3>
<p style=»font-size:14px»>(Tur/retur) </p>
</div>
<div class=»options»>
<div class=»car»>
</div>
<div class=»number job»>
<select>
</select>
<label>
<input type=»radio» value=»20″ name=»carJob» checked> Bil under 6 meter
</label>
<label>
<input type=»radio» value=»60″ name=»carJob»> Bil over 6 meter
</label>
</div>
</div>
</div>
<div class=»question»>
<div class=»text»><h3>Hvor mange ganger i uka kjører du bil til fritidsaktiviteter?</h3>
<p style=»font-size:14px»>(Mellom 17 og 22 gjelder tretimersregelen) </p>
</div>
<div class=»options»>
<div class=»car»>
</div>
<div class=»number hobby»>
<select>
</select>
<label>
<input type=»radio» value=»20″ name=»carHobby» checked> Bil under 6 meter
</label>
<label>
<input type=»radio» value=»60″ name=»carHobby»> Bil over 6 meter
</label>
</div>
</div>
</div>
</div>
</form>
<div class=»result»>
<div class=»box week»>
<h3>
Per uke:
</h3>
<table>
<tr>
<td>
Dine jobbreiser koster:
</td>
<td class=»cost-job cost»>

</td>
</tr>
<tr>
<td>
Dine fritidsreiser koster:
</td>
<td class=»cost-hobby cost»>

</td>
</tr>
<tr>
<td>
Totalt:
</td>
<td class=»cost-total cost»>
</td>
</tr>
<tr>
<td>
Med brikke koster det:
</td>
<td class=»cost-reduced cost»>
</td>
</tr>
</table>
</div>
<div class=»box month»>
<h3>
Per måned:
<p style=»font-size:14px»>(Fire uker per måned.)</p>
</h3>
<table>
<tr>
<td>
Dine jobbreiser koster:
</td>
<td class=»cost-job cost»>

</td>
</tr>
<tr>
<td>
Dine fritidsreiser koster:
</td>
<td class=»cost-hobby cost»>

</td>
</tr>
<tr>
<td>
Totalt:
</td>
<td class=»cost-total cost»>
</td>
</tr>
<tr>
<td>
Med brikke koster det:
</td>
<td class=»cost-reduced cost»>
</td>
</tr>
</table>
</div>
<div class=»box year»>
<h3>
Per år:
<p style=»font-size:14px»>(47 uker per år.)</p>
</h3>
<table>
<tr>
<td>
Dine jobbreiser koster:
</td>
<td class=»cost-job cost»>

</td>
</tr>
<tr>
<td>
Dine fritidsreiser koster:
</td>
<td class=»cost-hobby cost»>

</td>
</tr>
<tr>
<td>
Totalt:
</td>
<td class=»cost-total cost»>
</td>
</tr>
<tr>
<td>
Med brikke koster det:
</td>
<td class=»cost-reduced cost»>
</td>
</tr>
</table>
</div>
</div>
</div>

<script type=»text/javascript»>
function countCost(){
var jobCar=$(«input[type=’radio’][name=’carJob’]:checked»).val()*2
var hobbyCar=$(«input[type=’radio’][name=’carHobby’]:checked»).val()
var hobby=$(«.number.hobby select»).val()*hobbyCar
var job=$(«.number.job select»).val()*jobCar
var totalCost=hobby+job
var reducedCost=totalCost*0.9

$(«.box.week .cost-job»).html(job + » kr»)
$(«.box.week .cost-hobby»).html(hobby + » kr»)
$(«.box.week .cost-total»).html(totalCost + » kr»)
$(«.box.week .cost-reduced»).html(reducedCost + » kr»)

$(«.box.month .cost-job»).html(job*4 + » kr»)
$(«.box.month .cost-hobby»).html(hobby*4 + » kr»)
$(«.box.month .cost-total»).html(totalCost*4 + » kr»)
$(«.box.month .cost-reduced»).html(reducedCost*4 + » kr»)

$(«.box.year .cost-job»).html(job*47 + » kr»)
$(«.box.year .cost-hobby»).html(hobby*47 + » kr»)
$(«.box.year .cost-total»).html(totalCost*47 + » kr»)
$(«.box.year .cost-reduced»).html(reducedCost*47 + » kr»)

}
var lists=$(«.number select»);
lists.each(function(){
var list=$(this)
for(var i=0; i<10; i++){
list.append(«<option>»+i+»</option>»)
}
})
countCost()
</script>
</body>
</html>

 

For det trente øye er dette ganske enkelt og grunnleggende, men for folk som meg – nybegynnere – er dette temmelig skremmende greier å holde styr på. Men med en ekspert ved sin side, går det meste bra. Vi lanserte kalkulatoren dagen derpå, og saken hoppa rett inn på best lest-lista. Dette er noe folk vil vite og har savna info om.

Ingenting er garantert eller ferdig vurdert i bypakke-debatten i Ålesund, men dette verktøyet var tydlig savna, selv om resultatet kan bli annerledes.

Se kalkulatoren og prøv den selv her.

Liv-Jorunn