Code Monkey home page Code Monkey logo

handbook's Introduction

Variant Handbook

Text

Edit text by changing files in pages.

Development

yarn to install dependencies

yarn dev to run development server

Configuration

The handbook should run locally without any variables, but there are some features requiring them. Without AZURE AD configuration, login won't work. Without ALGOLIA configuration indexing won't work. These are how ever optional features and the handbook will work fine without them.

See .env.example for required environment variables:

# Get from Azure AD registered App settings (only required if you want to test login)
AZURE_AD_CLIENT_ID=
AZURE_AD_CLIENT_SECRET=
AZURE_AD_TENANT_ID=

# Random string for cookie secrets
JWT_COOKIE_SECRET=


# Settings for indexing (not required unless you're testing indexing)
BASE_URL=https://handbook.variant.no
ALGOLIA_APP_ID=
ALGOLIA_API_KEY=

# Used for searching by client. Public keys
NEXT_PUBLIC_ALGOLIA_APP_ID=WZBDX5TTC9
NEXT_PUBLIC_ALGOLIA_READ_KEY=184c48e3d13eb260eab5a8e980234778

# Used for prompting GPT when searching, only need if testing this functionality
PINECONE_API_KEY=
PINECONE_API_ENVIRONMENT=us-east4-gcp
OPENAI_API_KEY=

If you have access to Vercel you can generate secrets by doing:

vercel env pull

Architecture and design decisions

Organizing is done through module folders where all relevant files are located. This is to easer be able to remove/delete code and complete sets of code. However, there are some assets (e.g. manifest files and some images) which are more practical as public files (inside public/). These will be available as static files hosted on the root path.

Styles are used as CSS Modules with as specific naming as possible. If nested components, use BEM naming convention.

Reusable or generic components should be moved to the Styleguide monorepo.

This site should be static and exportable as clean HTML.

License

Code is licensesd under MIT.

Content is licensed under CC BY-SA 4.0. Tl;DR: Please use our content! But also take part in making the industriy a bit better by being open!

handbook's People

Contributors

adriansberg avatar anders-hammervold avatar andersns avatar andreashartveit avatar astride avatar carosyse avatar cbrevik avatar dependabot[bot] avatar elkebab avatar ellenwagnild avatar hildeor avatar jberglund avatar krakels avatar kristinqnesset avatar linnhelendyrhaug avatar magnusolderoesaether avatar martinbolinmoller avatar mikaelbr avatar nikolaia avatar oddsve avatar rix1 avatar rosvik avatar sarahse avatar sloevhaug avatar strombraaten avatar tore avatar toretefre avatar trulshj avatar trymvei avatar variantjorgen avatar

Stargazers

avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar

Watchers

avatar avatar avatar avatar avatar avatar avatar avatar avatar

Forkers

rix1 cbrevik kristinqnesset hildeor jarandb jakobsen dahly96 taareskjold martinbolinmoller elkebab trulshj vegardfeste smkil hindalen

handbook's Issues

👔 Definitionen av Gadgets

För att förtydliga posten om gadgets i handboken så skulle vi ha tydligt definerat vad detta är och vad det betyder. Vem äger vad, vad är innanför och vad behöver vi tänka på?

Detta är nödvändigtvis inget som behöver hamna i handboken, men jag tänker det är bra att ha haft en prat runt det.

Se over teksten, og bruk det som er i skissa

I arbeidet med å redesigne håndboka har vi gjort noen endringer på teksten:

  1. Flytta informasjonen på tvers av sider, og omrokkert ut fra sånn det var
  2. Tilpassa teksten, og fjerna noe av det som var der fra før

Her kunne vi nok definitivt jobba på en ryddigere måte, ved å bruke issues for å dokumentere alle endringer, men det har vi altså ikke gjort. Beklager det 😞

Dermed blir en viktig del av arbeidet her å se over teksten og bruke det som står i skissa. Dette gjelder altså alle sidene.

Kontaktpersoner for design

Redesign og spissing av landingsside

Etterhvert som håndboken har vokst og vokst med innhold har vi aldri tatt oss tid til en restrukturering og et par skritt tilbake for å se om innholdet og essensen dukker opp godt nok.

Det er ulike målgrupper til håndboken:

  1. Nye varianter som ikke kjenner til sine rettigheter, betingelser, rutiner, praksiser etc.
  2. Erfarne varianter som vil slå opp hvordan de gjør spesifikke ting. Timeføring, utgiftsføring, hvordan gjennomføres ting som de gjør sjeldent og trenger litt påminnelse.
  3. Deltakere av forskjellige teams som har oppgaver de gjør utenom det vanlige. Personalledere, sosial, fag, ledere osv.
    1. Nye i rollen som vil se hvordan ting gjennomføres.
    2. Erfarne som bruker det som arbeidsverktøy og kvalitetssikring.
  4. Potensielle varianter som ønsker å se hvordan det er i Variant og hva Variant har å tilby.

Siste målgruppen er lavest prioritert men likevel viktig. Det å tilby lett konsumerbar informasjon i en oversiktsside som det første besøkende møter. Det er nyttig for å navigere igjennom alle undersidene for øvrige målgrupper og spesielt viktig for nye varianter som ikke nødvendigvis har full oversikt over alle betingelser. Vi ser at håndbok og åpen informasjon her er veldig viktig for folk som undersøker info om Variant - og det er en fint ting for alle om vi greier å være konsise nok på landingssiden til å gi en god TL;DR Variant.

Tasks

Initiell forslag til struktur

Progresjonsplan - Struktur

Spring Cleaning 2019

Våren kommer!

Hur bör vi genomföra en vårrengöring? Kan vi sätta några mål för den?

Tänker att vi kan gott göra ett tappert försök på att säga samma som vi gör nu men med mindre antal bokstäver.

Egen side med eksempler som illustrerer timeføring, reiseregning osv?

Fremdeles i designfasen, ikke klar for utvikling
Relatert til #222

  • Analysere
  • Lage et forslag om hva som kan/bør gjøres nå, og hva som kan/bør gjøres seinere
  • Vurdere arbeidet sammen med @mikaelbr

Bakgrunn

Gjennom innsiktsarbeidet vi gjorde med håndboka nylig lærte vi at det er mange som ønsker seg eksempler på noen administrative oppgaver. Noen av oppgavene som har blitt nevnt er:

  • Reiseregning
  • Timeføring (f. eks for variantdag)
  • Utgiftsrapportering

For å begrense mengden med informasjon anbefaler vi å ikke inkludere det som en del av teksten på "Praktisk Info"-siden, men heller skille det ut som en egen side, for de som vil gå et nivå dypere. På denne måten kan vi skrive i teksten, "Trenger du noen håndfaste eksempler for å komme i gang? Trykk her", for så å sende deg videre til eksempelsida, uten å ta opp for mye plass.

Nøyaktig hvordan dette løses har vi ikke landa på, men skiller denne oppgava ut fra det opprinnelige arbeidet nå for å snevre ned omfanget.

Uferdige skisser

image

image

image

Kontaktpersoner for design

Omdirigering når man trykker på Variant-logoen

Når man først har gått inn på håndboka så er det ingen måte å klikke seg tilbake til "hovedsida" på. Burde man ikke heller komme tilbake til Variant.no i stedet for landingssida på håndboka når man trykker på logoen? Siden navigasjonen ikke er sticky så må man jo scrolle helt til toppen for å trykke på logen i det hele tatt, og da vil det jo være like enkelt å trykke på "En variants håndbok", som linker til det samme stedet. Da kan vel like godt logoen linke tilbake til variant.no?

Skjermopptak.2022-09-29.kl.16.15.21.mov

Hvem vet hva når det sendes søknad til oss?

Det må komme godt frem hvordan vi behandler informasjonen til en søkekandidat og hva man kan forvente at blir delt innad i Variant i løpet av en ansettelsesprosess.

Hva er åpent og hva er konfidensielt? Hva kan kandidaten forvente at alle ansatte vet, og hva vet kun de som er involvert i prosessen?

Søk på tvers av håndbøker

Har ofte behov for raskt å finne riktig tekst i håndboka. Men husker ikke nøyaktig hvilken av de, det skjer litt for ofte at jeg ikke vet hvilken det står i. Og ønsker å kunne finne det lett uten å måtte åpne alle håndbøkene.

Foreslår å endre tittel fra "Lederplattform - tillitsledelse", til "Tillitsbasert ledelse"

https://handbook.variant.no/quality_manual#Lederplattform-tillitsledelse
I arbeidet med å omstrukturere håndboka har vi flytta på teksten som handler om "Lederplattform - tillitsledelse". Se skissa under for å forstå det bedre.

I denne nye konteksten mener vi at det gir mer mening å bruke "Tillitsbasert ledelse" som tittel, spesielt med tanke på at det også nevnes i teksten, og at det er noe utydelig hva som menes "lederplattform".

Disclaimer

Syns du at "3. Prosesser" er et rart navn for å dekke Strategi, HMS osv, så vil vi veldig gjerne ha forslag! Legg det igjen i kommentarfeltet under. Det samme gjelder også tittelen på sida ("Hvordan vi gjør ting")

Skisse

image

Kontaktpersoner for design

[Parent] Flytte informasjonen fra Lokasjoner-sida inn i Praktisk info

En ting som kan jobbes videre med er å flytte innholdet som er på Lokasjonssida, den dag i dag, inn i f. eks Praktisk info-sida. Nå som vi har innlogging kan vi da automatisk velge kontor basert på hvilken by du har tilknytning til.

Det er en del info som går på rutiner som vil være ulikt for hvert av kontorene våres. Hittil har vi skilt ut det til en dedikert Lokasjoner-side i dagens løsning, men det var sett på som en midlertidig løsning.

Det vi ønsker å gå videre med er en interaktiv komponent hvor man kan bytte mellom byer under hver av de relevante punktene, sånn som det her:

Relatert til

Relevante skjermbilder

Fra Lokasjoner-sida:

Image

Fra Praktisk info-sida:

Image

Kontaktpersoner for design

Flytt håndboken over til now.sh

Mange av de eksisterende systemene våre kjører på now.sh. Dette for å kunne bygge kontinuerlig opp nye eksemplarer i f.eks pull requests og se en preview av det som bidras. Ofte er endringene visuelle eller tekstendringer som gjør at det kan være nyttig.

Stemmer for at vi også flytter håndboken for å få til den byggingen på en enkel måte. Må se å få tilpasset det med bruk av Travis f.eks.

Skrive tekst om sommerjobb til sida om Kvalitetsrutiner/Prosesser

Link til Figma

Vi ser at vi snakker utfyllende om de ulike sidene av en karriere i Variant, men vi mangler info om sommerjobb.

Gjerne noe som beskriver hva man kan forvente som sommerjobber. Kanskje også linke til tidligere takeover-sider?

Her har vi sikkert bloggposter som kan inspirere til hva man skal skrive.

Per dags dato finnes det tekster om:

  • Ansettelse og jobbintervju (selve prosessen der)
  • Nyansatt - Velkommen ombord (hva som skjer før og etter oppstart)
  • Personaloppfølging

(Veldig) liten bug i hurtignavigasjon

Hurtignavigasjon til del 1: Lederplattform - tillitsledelse under fanen "Kvalitetsrutiner" i håndboken fungerer ikke.
href går nå til #lederplattform---tillitsledelse. Fix er å endre til #lederplattform-tillitsledelse

Hilsen overnysgjerrig jobbsøker :)

Dokumentasjon for search-index

Kunne vi skrevet en /search-index/README som forklarer søket i korte trekk? Tenker ikke nødvendigvis en detaljert guide, men heller en overordnet beskrivelse med noen nøkkelord som setter indekseringsscriptene i riktig kontekst for leseren.

Originally posted by @tormodhau in #158 (comment)

Link til Lenovo PC utdatert

Linken til Lenovo PCen under PC-valg i håndboken finnes ikke i sortimentet lengre, denne bør oppdateres. Ser ut som samme type finnes hvis man googler samme navn.

Forenkle hvordan man navigerer i håndboka

Bakgrunn

Ut fra innsiktsarbeidet vi gjorde har vi fått høre at det er flere som sliter med å navigere seg rundt i håndboka, "Jeg veit jeg har sett det før, men jeg husker ikke hvor jeg fant det" er en typisk kommentar vi har hørt flere ganger.

Vi har en hypotese om at:

  • Folk flest ser sidemenyen, men overser menyen i toppen
  • Og at grunnen til at de overser menyen i toppen er at det visuelle skillet mellom variant.no og håndboka er for lite, så det føles ikke ut som du bytter kontekst i like stor grad
  • Ved å tydeliggjøre skillet mellom variant.no og håndboka vil det også bli lettere å se at menyen i toppen erstattes med en håndbok-spesifikk meny

Skjermbilde 2022-10-11 kl 10 57 00

Løsningsforslag

  • Sticky toppmeny (for å sørge for at brukeren ser den når de scroller nedover)
  • Sidemeny som følger med når du scroller
  • Visuelt større forskjell på utrykket til håndboka når man trykker seg inn.
  • Samle innholdet under "Praktisk info"-siden i underkategorier

Skisser

Kommer tilbake til endelige skisser, men dette er det vi jobber med, bare for å illustrere poenget ovenfor.
image

Verdt å følge med på framover

Nå gjør vi en mindre endring på det strukturelle, men større på det visuelle. Framover burde vi riktignok gjøre en undersøkelse for å se om det har blitt lettere å navigere i håndboka, og finne tilbake til ting man har lest tidligere, eller om vi burde større strukturelle grep, som å f. Eks forholde vårs til én meny i stedet for to:

image

Flytte høyremenyen på eksisterende håndbok til venstresida, og få den til å se ut som skissa

Se funksjonell prototype i Figma.

image

Løsningsforslag

Se denne seksjonen i Figma for mer informasjon.

image

Interaksjon:

Når man scroller nedover og kommer til et nytt hovedtema, blir kategorien i menyen “Om { tema }” rosa og alle underpunkter av den kategorien blir åpnet.

Man kan også klikke på en link i venstre meny og da vil kategorien som det menypunktet ligger under bli rosa og alle underpunkter av kategorien åpnes.

image

Kontaktpersoner for design

Legge til Info om bildebanken?

Burde vi inkludere noe info om bildebanken? For eksempel at linken er photo.variant.no, og noen grunnleggende greier om hvordan bruke den? For eksempel det at sånn som Photoprism er lagt opp så er "Album" overordna, også kan man legge mapper inn i Album, men du kan ikke legge en mappe inn i en mappe. Det vil si at vi kan ha et album som heter Variantdag, også kan man legge bilder fra variantdagen i april 2022 inn der f. eks.
Det vil si at en mappe representerer et øyeblikk i tid, eller én hendelse (sommerjobbrekruttering i 2022), men albumene representerer f. eks alt rekrutteringsarbeid.

Videre diskusjon

Dette blir utover det å bare skrive en tekst, men vi burde nok tatt en oppvask på hvordan vi bruker tags/etikketter/labels i sammenheng med album. Det ville kanskje vært lettere å finne bilder på tvers av album, og hva som faktisk var konteksten bildene blei tatt i, dersom vi brukte tags som:

  • Arbeid
  • faglig
  • sosialt
  • bra egna til trykt materiale

Legg til global navigasjon

Nå er det 3 ulike sider i håndboken men ingen måte å lenke mellom annet i teksten. Burde legge til en ny navigasjon som lar man navigere mellom sider. Tror vi må til med en redesign etterhvert, så dette kan gjøres på en enkel måte i en overgangsfase

Navngivning: En variants håndbok/Fundamentet

Skriv forslag i kommentarfeltet 👇

Når du kommer inn på håndboka så er landingssida vår den som i dag heter "En variants håndbok".

image

Gjennom innsiktsarbeidet lært vi at det er flere faktorer som skaper forvirring. En av de faktorene er at en side har "Kvalitetshåndbok" som overskrift, i tillegg til siden som heter "En variants håndbok", i tillegg da til den overordna Håndboka, med stor H.

For å begrense forvirring foreslår vi å endre navnet til noe som ikke inkluderer ordet "Håndbok", som f. eks Fundamentet, men det kan godt hete noe annet.

Kontekst

Trykk her for å se hva slags innhold som er på sida, og hvordan designet er lagt opp.

image

Kontaktpersoner for design

Lag en smud farge-overgang på headeren når bakgrunnsfargen endres ved scrolling

Det kan hende det her er helt unødvendig, spesielt siden det kun vil vises på landingssida til håndboka, men det hadde vært sykt kult om headeren hadde en smud fargeovergang, når man går fra den lilla bakgrunnen til den beige bakgrunnen:

image

Oppgaver

  • I første omgang kan vi gå for et mer brått fargeskifte, fra lilla (#282552) til beige (#F8F6EF)
  • Deretter vil vi optimalt sett ha en jevn farge overgang fra lilla til beige, som en slags animasjon

Illustrasjon

Kontaktpersoner for design

Ved et søk vises det først "ingen resultater" før søket faktisk er ferdig

Som tittelen sier, når du søker så får du først beskjed om at søket ditt ikke hadde noen resultater, fram til søket faktisk er ferdig og kan levere de resultatene som fantes.

Om jeg ikke tar heelt feil så vil den prosessen her også vare lengre når du har dårlig internettdekning, sånn at det kan se ut som søket ditt ikke hadde noen resultater lenge nok til at man tenker "Å nei, da får jeg leite videre da".

Skjermopptak.2022-09-29.kl.16.24.23.mov

Løsningen her burde vel altså være at man enten ser en spinner som jobber, evt en tekst som sier "Gi meg et lite øyeblikk mens vi graver i arkivet", før man altså ser søkeresultatet.

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.