Design system

I started by making a copy of design system I had created previously in order to speed up the workflow in Figma. Some elements web elements were changed on the website. Design systems help create structure to the design process that can become chaotic at times especially for me as I tend to be somewhat unorganized.

Dashboard design

The dashbaord design takes inspiration from various app that use darker UI which I find more pleasing to use as it doesn't strain the eyes when looked for longer periods of time.

The landing page design is your run of the mill SaaS company landing page that uses as similar color pallet than the dashboard itself. Dark navy and dark blue create enough contrast for the elements and teal and sea green colors are excellent for highlighting elements such as buttons. With light drop shadows

Mobile design

The mobile version dashboard fits the screen of smaller devices but of course an application like Softa would be best suited for desktop usage but since the app does have chat functionality being able to message and comment is important even if you are on the move.

While I don't see myself as a master Illustrator I was quite happy how the illustration came about with relatively little effort. Using a similar color pallet as the dashboard, the illustration fits theme well.

To me the Softa logo resembles something a mid 90's tech company would use which is why I found it suitable for this project. The logo was more of afterthought for this project, not too much time spent in making it.

The landing page is quite bare bones but I did add some nice interaction to bring the website to life. A good interaction make pushing or hovering over a button enjoyable while being as unobtrusive as possible. Hover interactions by nature do not work on mobile due to hovering over an element not being natural with touch screens.