
Color & Scale is an iOS app that utilize SCNKit in Xcode to demonstrate how color and scale can be use to create aesthetically pleasing hierarchical
composition

Role : Developer, UX/UI Designer
Duration : 1 week - Autumn 2018
Tools : Sketch, Adobe Illustrator, Xcode
Type : iOS mobile application development
Objective: Create an app which utilize SceneKit in Xcode to create a visual composition that demonstrates your understanding of the concepts of color and scale. Only primitive object in SceneKit allowed. (SCNPlane, SCNBox, SCNSphere, SCNPyramid, SCNCone, SCNCylinder, SCNCapsule, SCNTube, and SCNTorus)
design
process
/ ideation
What is color & scale?
Color: well... it's color.
Scale: Scale refers to the size of an object (a whole) in relationship to another object (another whole).
Designers can pull your focus and attention to a certain point by manipulating scale and color. Naturally, what's the biggest will grab your attention first as well as what's brightest. But sometimes, big and bright doesn't mean that they are beautiful and elegant, for this project I want to create an abstract composition of big, bright yet beautiful spheres to showcase the concept of color and scale.
/ ui design
#FFF2D1
#F1BAE3
Color ?
> I love pastel colors. If you have been visiting my page, maybe you got a hint already. To me, there's something beautiful about light shades of color that just go in harmony with others. I went on my trusted website coolors.co and chose a color combination I like.
#C9BAE8
#45698F
#26CFD1
Scale
> Due to the nature of this assignment, I'm only allowed to use existing primitive shapes in SCNKit. I went with Sphere because I think it's the smoothest and most soft out of all the available shapes.
/ final design
/ development
As you can see, there are moving spheres. These are made using SCNSphere , part of the SCNKit in Xcode. I created 3 mothers nodes (SCNNode), each with 2 child nodes constantly rotating around the mother nodes.
The lighting of of SCNLight made the look of the sphere dull and unpleasant at thebeginning thus I changed it and it could have a flat design look.
Scene & properties set up


Nodes (spheres) set up
