Skip to main content

Fedora IoT Web Page - Initial Ideas

ยท 3 min read
Emma Kidney

Just an update on what I've been working on :) Click through to see my process and progress starting to create a web page mock-up for Fedora IoT as part of the Fedora Website Revamp!

As part of the Fedora Website Revamp, I got tasked with creating a mock-up of the Fedora IoT web page. I reference the Fedora IoT logo a lot here. I was unable to locate high quality SVGs, so I just made some quick vectors as placeholders.


I bounced off of what Mo was creating for the Fedora Workstation page in order to keep things cohesive. I looked at her mood board when brainstorming. I've included a picture below of my initial ideas:


I wanted to do something with the cubes that are used in the Fedora IoT logo. I compared them to an image on the mood board of an LED keyboard.


This was what I came up with! So then I placed in the mock-up along with a placeholder hero image, as well as fading out the gradient toward the end to it can merge into the rest of the page.

Pattern Mockup1

My second idea was to take the square and make it into a gradient cube and sort of morph it into a suitable background.

Here is the draft I made up following on from that idea:


I tried to implement a duplicate of the cube within the pattern but I don't think it works too well.



Considering that the IoT edition is aims for edge devices and such, I thought about maybe including a RaspbarryPi as the hero image:

RPi idea

I currently don't have a high quality image of an Raspberry Pi but I was provided with an SVG created by a previous intern. With that as a placeholder, here are my current drafts for the Fedora IoT web page:



Obviously these are just drafts for the moment. More work needs to go into refining the details etc but I just wanted to give you an idea of what I have so far!

For my next steps, I'm in the process of learning Blender with the goal of possibly creating a 3D rendering of a RaspberryPi. I am also going to refine the background with the gradient cuboid and plan out the rest of the web page.

If you have any feedback for me on my current drafts please don't hesitate to either message me @ or email me @ :) I am also active on the channel.