SmartCosmos Marketplace
The SmartCosmos team was tasked at its conception to begin prototyping work on a potential app store site that would allow the SmartCosmos team and 3rd-party developers to create and sell extensions, plugins, and expansions to the Objects platform that is currently under development. This would generate both interest and publicity for the company and the platform. It would seek to become a premier place to generate or use solutions for the Internet of Things (IoT).
PLEASE MAKE NOTE THAT I AM UNDER AN NDA FOR THIS PROJECT AND CAN ONLY SHOW LIMITED AMOUNTS OF THE EARLY CONTENT.
Challenges
We knew where we had to get to, just not quite on how to start and what would be the best path to get there. For a site of this scope you need a large amount of research, something of which until then, I had only done on a small scale before. However, this obstacle forced me to better my knowledge of UI/UX principles and challenged me to always be on the lookout for better ways of going about designing a complex system. Also, we had to think about a single question, how does one make an e-commerce site without being too obtuse to use, but without being a copy of other successful ones out there?
Project Scope
As you can probably guess, the project scope for a website, and one that would update its content regularly, is astronomical. For the sake of what I am allowed to show here, I will say that the scope was to create some research and early design concepts that would be guiding light in how the website would be formed, designed, and built. This manifested itself in the form of a moodboard, a design guideline exploration manual, and early prototype color comps. Unfortunately, the sketches for this project have been lost.
Moodboarding
Moodboards are great for when you're trying to develop the overall feel of a project. It sets the tone and shows off the things that inspire both you and the direction you're wanting to take with the design of the product. This moodboard in particular expanded upon the idea of we wanted our site to look and what we wanted to convey to our visitors. It especially helped pound home the theme of space that worked perfectly with SmartCosmos.
Design Philosophy Exploration
This document here is a collection of all the research that was put in to the Marketplace design. From these guidelines, my team and I were finally able to take our first steps towards designing a functional, yet pleasing to the eye, interface and layout for the website. The sections found within are about Fonts, Color Palettes, Animations, and Visual Elements and Patterns. I presented this before a group of stake holders and product managers for their feedback and approval, which I was later given and the design step commenced shortly afterwards.
Basic Color Comps
These two images are some extremely basic color comps for a very early version of the website. I really wish I could show more as it’s a slick-looking site, but unfortunately the NDA restricts me to only certain parts of the process. The homepage of the website functions in two parts, the top and bottom. The top is a welcome page with a call to action, education opportunity, and immediate log in option. The bottom is where a user can take their first baby steps towards interacting with the marketplace. When a use scrolls down or uses the explore button, the whole site scrolls down revealing the marketplace ready to go! There are no extensions on display in the bottom screen because at the time, there was nothing to populate that area with.
