Digital Almanac

I want to show you the final project in screens at The Oslo School of Architecture and Design, spring 2015. Ida Marrable and I collaborated with Gyldendal Publishing. We had about four weeks to work with this project.

Gyldendal Publishing is considering to develop an app for iPhone and Android phone. The app will be based on the contents of the printed edition, ­Almanakk for Norge.


The Almanac has a kalendrium for this year with dates for holidays and official anniversaries, information about sunrise and sunset (this is used by for example the military), tidewater, weather statistics, it has a planet map, rules on hunting and fishing and so on. The content is extensive!



The content needs adjustments to work in a digital platform. We also had to consider the amount of specialized and good apps for each of the topics the almanac covers – how can the user benefit by having them all in one app?

We did a survey and got access to a survey done by Gyldendal. The surveys gave us insights to what type of  topics in the almanac people are most and least interested in, and the topics that different kinds of people are interested in.


With the insight we got from the surveys about what people is most and least interested in, we started with the information architecture. What you see here is the Alamacs table of content. When you see this page it feels like a lot to take in, so we gave some topics new names, merged some topics and categorized them.

Based on this we choose a concept: A kind of calender mixed with a book. You have a dashboard with prefered information from today, based on your geolocation. Here are some pictures of our prototype:









A short video of our prototype for iPhone.


Hope you liked it! Please ask if you have any questions. We choose to focus on some areas of the app, for further developments there are multiple areas we would like to explore.
Gyldendal Publishing – thanks for the collaboration! AHO Works Exhibition – thanks for the nomination.




The semester is over – hello summer

The second semester at AHO is over, and I want to show you our final project – Digital Almanac. Ida and I were nominated for AHO Awards in the category «prize for interaction design».


For now, this is all I’ll show you – a picture from AHO Works Exhibition. A longer post is coming soon. Promise. The final month at school were really busy for me, working around the clock with the final task in screens and graphic design for AHO Works Exhibition – so it’s been nice to reintroduce my brain to other stuff again.

Right now I’m spending some time in Sigdal, the municipality I’m from, while working with some design projects.

For now, I want to show you something that’s not work or school related – but some iPhone pictures and gifs from the last couple of days in Sigdal municipality. Let me introduce you to the mountain Andersnatten.


thkittelsen lauvliaThe artist Theodor Kittelsen lived in Sigdal and painted Andersnatten numerous times. This is his view from the porch at Lauvlia.

Th._Kittelsen,_Andersnatten,_postkortOne of Kittelsen’s paintings of Andersnatten.



Almanac for Norway

2015-05-08 10.21.23


Just a quick update from the Almanac project. We are in the middle of understanding the almanac, trying to make a new information architecture. Ida and I are also working with concept and sketches.

Processed with VSCOcam with k1 presetGyldendal has a great office, so here you see our joy after visiting them for the first time.

Only three weeks until the final delivery and AHO works exhibition!

legoWe also made some Lego animals at Bekk Consulting (yes, there were a different goal for the day than just being good at building Lego animals), and our animal won!


What’s your type

For the 4th module in screens – we made a picture app. We were supposed to explore different ways of making a touch experience for looking at a set of pictures. I choose pictures of different typefaces (what a surprise). Unfortunately, I got sick, and this course has the speed of a fighter plane (as we say in Norwegian). Fortunately, I were able to make a prototype and user test it.



This is my first lowfi prototype of the interface:

I looked at different ways of categorising typefaces, like different types of usage, describing terms and the academic terms:

I ended up with these categories, because I wanted to make the typefaces more accessible for people:

User testing


We got to user test our app at Netlife Research, which was both really useful and frustrating. I don’t have much experience with user testing, and sitting in another room and seeing someone explore your design is a rather new feeling. You often feel like your design is logical and understandable, so to discover flaws and errors, it’s useful to see the design through another pair of eyes. We also got a great introduction to Netlife Research and how to go about user testing.

We were facing different kinds of obstacles with the picture sets we choose. One of the obstacles with my app, was that some people see the pictures as information – as they should read the text and understand them. So for the final delivery, that was one of my main issues to work on. I looked at how the details affected how you see the pictures.


The final delivery


Try my prototype

I would recommend to use an iPhone 6 in landscape mode to test the app (to be specific, HEHE). Then you would get an idea about the interactions.

Further developments

There are some limitations in Proto.io, so the favourite function is not working. In the app you can see how it would look like if someone already has some favourites. I would also like to have more typefaces in the app, and have more information about typefaces in the I tab. Some of the text about the typefaces are using academic terms, and it would have been a good possibility to teach people a bit about typefaces.

And of course, I would like to make the app responsive.

The final module

We just got started with the final module. Ida and I are working with Gyldendal – so we are really exited! More information about the project coming soon.



This is the final result from the tap, swipe & flick module. Luciola is a tablet app. We used Unity to make the touch experience possible. When working with interactions, you have to try them and see how your idea actually feels – so it’s really useful to get an introduction to different kinds of software.

Eirik, Martin and I want the user to get in a meditative state of mind by interacting with the Luciolas. You move around in a world with the Luciolas, and your actions will affect them in different ways.


Here you see Martin and Eirik playing with one the first versions (we are planning to make a video of the final result).


M3_luciola_bilde1_marte,eirik,martin_2015 M3_luciola_bilde5_marte,eirik,martin_2015M3_luciola_bilde2_marte,eirik,martin_2015 M3_luciola_bilde3_marte,eirik,martin_2015


Tap, swipe & flick

New two week module in sceens, and we are going to make a touch experience for tablets using Unity. Martin, Eirik and I have been working with a lot of different concepts, but now we have decided. 3D-models are being shaped as I write. Let’s just hope it turns out as good as our imagination pictures it.




How far and where do you go?

For the last two weeks we had a internet carpentry crash course, using html, css and (maybe) some java to make a website. We also worked with concepts, and the webpage could only have one page and had to use a data source that exists. First I looked at using distance to understand something better, or how to understand distance better. The problem with a lot of my ideas was that I would have to represent an amount (like bytes or data) in something, so I would basically have to set the rules.

Skjermbilde 2015-03-05 kl. 22.59.36

Skjermbilde 2015-03-05 kl. 22.59.42

Skjermbilde 2015-03-05 kl. 22.59.27





Some of the first sketches

Then I looked at the actual physics of the internet. There is a theory that the internet weights the same as a strawberry, if you count and weigh the electrons that carry the information around. There is some skepticism to this theory.

Skjermbilde 2015-03-05 kl. 22.57.42


I also looked at the actual weight of the internet, if you include servers, screens, cables and so on.

Skjermbilde 2015-03-05 kl. 23.04.56

According to the brief, the webpage was supposed to show some information live, and we were allowed to calculate how the numbers would evolve – but with something this unspecific it would be hard to make an exact calculation.

That got me thinking «what other parts of the internet is physical?»

Our teacher for this module, Jørn, showed me this website. You can see where the servers you visit by entering a website are located: http://www.monitis.com/traceroute/

Skjermbilde 2015-03-05 kl. 22.51.39

This became the datasource for my project. In my prototype you write a website of your choice, and get to see the km you have travelled to enter the website, a map, and google street view from the different locations.


I want to make the user more aware of the physical aspect of the internet, and explore the places where the servers are located.

The website is missing some finishing touches, since it’s a prototype.

By entering a website, you visit servers all over the world. How far and where do you go?

Try my prototype:


Data visualization using personal data

For the last weeks we have been working with Processing and data visualization. We were supposed to use personal data as input, and I decided to visualize my browser history. For me, this is kind of personal, I rarely let people use my computer or phone.

I did struggle with the code part, it seemed like everyone did, but we got help and the course was more about exploring what the result could be. What possibilities does code have and how does it change the interaction.

I have previously been working with information graphics, and I see some of the same principles in data visualization – but you can allow more data and smaller objects. When using Illustrator you kind of have to make a lot manually – you have to do the calculation and so on.  Also, by using Processing it’s possible to make the data interactive, and the viewer can take an active part in the visualization – by using the cursor and so on.

This is my sketch:

Browser History Sketch

The sketch focuses on time used on different categories, top sites and the path between the different sites.

And this is how far I got with Processing (and even though this is so private for me, I post it on my blog…):
Browser History Processing

From January 14 2015 22:08 to February 02 2015 11:44 I visited 10 756 urls and 381 unique websites. This data visualization only shows the websites that I have visited over 7 times. I have not been using private mode, and when I was browsing, I did not know that it would be used for this task.

By looking at the results from my own data, I could tell what kind of work I was doing and generally what interested me. I actually thought I was more of a hypochondria than the results show. It would be really interesting comparing this to others browser history.

The task also triggered some thoughts about further developments; working with memory and browser history. It’s so hard maneuvering through your own history, trying to remember what you were doing or find things.

New studio and elective courses

Elective course (a course we have once a week) started today, Ida and me are the only designers in «Freehand Sketching». We are in the wonderful and big A1, (something else than «bunkersen» (as we call it), where we spent last semester). Just look at the ceiling:
Processed with VSCOcam with f2 preset

We started from scratch, exploring tools and materials. Great for a paper-freak like me. And it’s also great with a analog day of the week. I bought my first ProMarker pen (those industrial designers and architects are getting to me).
Processed with VSCOcam with k1 preset
Processed with VSCOcam with p5 preset

In Interaction Design 2: Screens, the studio course, we started with Processing and data visualization.

2015-01-27 21_43_32

Look at this wonderful mouse tracker, haha. It takes time to learn Processing, but our teacher Marius knows everything there is to know about code, so that’s kind of comforting. For this module we are supposed to visualize data from our own life. My plan, as we speak, is to track exposure to certain subjects online. We were introduced to different apps and websites that track you somehow, these sites are quite interesting:

Moves Activity Diary. This also shows your location.
Foursquare, I will definitely use this to discover places in Oslo.
Iconosquare gives you statistics from Instagram:

Skjermbilde 2015-01-27 kl. 22.25.49

Skjermbilde 2015-01-27 kl. 22.26.02I’m still fascinated with how much I used Instagram in 2012.