Jump to content

Setting up the design system

Jimi Wikman



As I prepare for the next step in my life, I am also taking some time to dig into the other creative side to start setting up a design system. This will help me do mockups for content before I build it. It will also allow me to be more consistent with content as I reuse components rather than inventing them from scratch every time. As I will share some aspects with the Prisma methodology design as part of the Flexible Atlassian Setup, there will be some overlap. This will speed things up for when I build the Prisma community later on.

A Design system takes a while to build, but I am in no rush, so I will let it take the time it takes. The foundation of colors and fonts are pretty straight forward and I already have made the basic color work. I will still need to add the Invision Community specific colors and fonts, but that will take longer to untangle as Invision Community does not have a design guide yet.


With the base colors, I can start doing some concept art, which is important for some articles and documentation I am creating. What I need most though are the components so I can start building more pages and start structuring the database templates. This will require a little time to set up with the component props, but it should be easy to use later on.

As you can see from the screenshot above, I am focusing on the brand colors to create the variations and then I have created some gradients. I have also created a Confluence space for documentation, but I will keep that one closed for now until I have any content there. The documentation is more long term anyway, as I don't need a lot of documentation for my self.

I am also taking some time during the design to mapping out some YouTube content, like classification and styles. This is also tied in to the mapping I am making in Jira using the StoryMap plugin.



So, all in all, I am setting up the foundation for next year and I am planning a lot. As things get more structured, I also feel more eager to start building!

Next year will be awesome.



Recommended Comments

There are no comments to display.

Add a comment...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

  • Create New...