This week we didn’t have any lecture content, we just focussed on building our Elements project.

So far I have my Brand Guidelines and the first couple of frames of my website. I decided to start building up the element properties content. I started off with the element Scandium and designed this screen in this style that I a had previously sketched.

 

 

 

 

 

 

However in my prototype I will not show the periodic table zoomed up in this way as I’ve learned users do not like this in similar apps.

 

 

 

 

 

 

 

 

 

 

 

 

This is what the design looks like in the brand colours and style, I’m created this in dark mode first but will now move onto light mode.

 

 

 

 

 

 

 

 

 

 

 

 

 

 

While I was building this version I decided to try something different with the structural model. I went with the more 3D rendered version to try it out. However, I think that the design before was a bit cleaner and bit easier to see the configuration of the element. Therefore I will change this.

 

 

 

 

 

 

Looking back on what was important for users to know, I think I should make the electronic configuration clearer. To do this I will add it in text underneath diagram.

 

 

 

 

 

 

 

 

 

 

 

Next I repeated this process for 2 more elements which is all I could get done this week.

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

Since we are having our final critique next week I wanted to work on some quiz element to show for feedback.

These were the sketches I had for the layout and type of questions:

 

 

 

 

 

 

 

 

 

 

 

 

From there I started my first question in the prototype:

 

 

 

 

 

 

 

 

 

 

 

 

 

These images show all the frames involved for this question in both dark and light mode. In these frames I have the question screen, the correct answer screen and 3 incorrect answer screens.

I thought these came out quite well and they were fairly easy to reproduce so for the the last amount of time I had before the critique I made another question following this format.

 

 

 

 

 

 

 

Everything here is pretty much the same as the last question except with different answers so I decided to show the flows in the prototype to explain how the user would move through this question.

---

Next Week

Next week I want to have all 5 element information screens done and more quiz questions completed in different formats.