Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Dribbbleで見つけたコンセプトデザインを実装/potatotips-56-concept-design

M"e
November 15, 2018

 Dribbbleで見つけたコンセプトデザインを実装/potatotips-56-concept-design

M"e

November 15, 2018
Tweet

More Decks by M"e

Other Decks in Technology

Transcript

  1. Copyright © ZOZO Technologies, Inc. All Right Reserved. ίϯηϓτσβΠϯ ‣4NBSUIPNFDPOUSPMBQQDPODFQU

    ‣4BN"UNPSF ,JXJ4BN  ‣IUUQTESJCCCMFDPNTIPUT4NBSU IPNFDPOUSPMBQQDPODFQU
  2. Copyright © ZOZO Technologies, Inc. All Right Reserved. Smart home

    control app concept by Sam Atmore (Kiwi Sam) https://dribbble.com/shots/5435750-Smart-home-control-app-concept ߏ੒ ‣εΫϩʔϧͱ߹Θͤͯͷ਺஋දࣔ ‣എܠ৭ͷάϥσʔγϣϯมԽ ‣೾໛༷ͷഎܠ
  3. Copyright © ZOZO Technologies, Inc. All Right Reserved. Smart home

    control app concept by Sam Atmore (Kiwi Sam) https://dribbble.com/shots/5435750-Smart-home-control-app-concept ߏ੒ ‣εΫϩʔϧͱ߹Θͤͯͷ਺஋දࣔ ‣εΫϩʔϧUPVDIFT.PWFE @XJUI  ‣਺஋6*$PMMFDUJPO7JFX ‣എܠ৭ͷάϥσʔγϣϯมԽ ‣άϥσʔγϣϯܭࢉ ‣೾໛༷ͷഎܠ ‣6*#F[JFS1BUI
  4. Copyright © ZOZO Technologies, Inc. All Right Reserved. Smart home

    control app concept by Sam Atmore (Kiwi Sam) https://dribbble.com/shots/5435750-Smart-home-control-app-concept ߏ੒ ‣εΫϩʔϧͱ߹Θͤͯͷ਺஋දࣔ ‣εΫϩʔϧUPVDIFT.PWFE @XJUI  ‣਺஋6*$PMMFDUJPO7JFX ‣എܠ৭ͷάϥσʔγϣϯมԽ ‣άϥσʔγϣϯܭࢉ ‣೾໛༷ͷഎܠ ‣6*#F[JFS1BUI
  5. Copyright © ZOZO Technologies, Inc. All Right Reserved. Ͳ͏࣮૷͢Δ͔ʁ ‣εΫϩʔϧʹԠͯ͡ͷ਺஋ΛٻΊΔ

    ‣਺஋Λ΋ͱʹઃఆ͢Δ৭Λܭࢉ͢Δ #4f8cf8 #da1428 ͜ͷ෦෼Λܭࢉ͢Δ
  6. Copyright © ZOZO Technologies, Inc. All Right Reserved. άϥσʔγϣϯͷ৭Λܭࢉ͢Δ ‣౳ൺܭࢉ

    ‣ҧ͏৭ʹมԽ͢Δࡍʹ༻͍Δܭࢉํ๏ ‣౳ࠩܭࢉ ‣ಉܥ৭ͰมԽΛग़͢ࡍʹ༻͍Δܭࢉํ๏
  7. Copyright © ZOZO Technologies, Inc. All Right Reserved. άϥσʔγϣϯͷ৭Λܭࢉ͢Δ ‣౳ൺܭࢉ

    ‣ҧ͏৭ʹมԽ͢Δࡍʹ༻͍Δܭࢉํ๏ ‣౳ࠩܭࢉ ‣ಉܥ৭ͰมԽΛग़͢ࡍʹ༻͍Δܭࢉํ๏
  8. Copyright © ZOZO Technologies, Inc. All Right Reserved. ౳ൺܭࢉͷࣜ ։࢝৭ɿʮ33B

    ((B ##Bʯ ໨త৭ɿʮ33C ((C ##Cʯ 9ਐ௙཰ 3 9  3C3B  9 3B ( 9  (C(B  9 (B # 9  #C#B  9 #B ˞9d ੔਺
  9. Copyright © ZOZO Technologies, Inc. All Right Reserved. ࣮૷ ‣։࢝৭GDG

    ‣໨త৭EB ‣࠷େ਺஋ ‣ݱࡏͷ਺஋εΫϩʔϧʹԠͯ͡มԽ͢Δ
  10. Copyright © ZOZO Technologies, Inc. All Right Reserved. εΫϩʔϧʹԠͯ͡ͷ਺஋ var

    currentPointY: CGFloat = 0.0 // Ͳͷ͘Β͍εΫϩʔϧ͍ͯ͠Δ͔ͷҐஔ override func touchesMoved(_ touches: Set<UITouch>, with event: UIEvent?) { guard let touch = touches.first else { return } let diff = touch.previousLocation(in: view).y - touch.location(in: view).y currentPointY += diff let temperature = Int(currentPointY / (view.frame.height / CGFloat(max))) } ‣։࢝৭GDG ‣໨త৭EB ‣࠷େ਺஋
  11. Copyright © ZOZO Technologies, Inc. All Right Reserved. άϥσʔγϣϯܭࢉ extension

    UIColor { var red: CGFloat { return cgColor.components?[0] ?? 0.0 } var green: CGFloat { return cgColor.components?[1] ?? 0.0 } var blue: CGFloat { return cgColor.components?[2] ?? 0.0 } } ‣։࢝৭GDG ‣໨త৭EB ‣࠷େ਺஋
  12. Copyright © ZOZO Technologies, Inc. All Right Reserved. άϥσʔγϣϯܭࢉ let

    max = 60 let ratio = (temperature * 100 / max) let startColor = UIColor(red: 79/255, green: 140/255, blue: 248/255, alpha: 1.0) let endColor = UIColor(red: 218/255, green: 20/255, blue: 40/255, alpha: 1.0) // R(X) = (Rb - Ra) * X/100 + Ra let r = (endColor.red - startColor.red) * CGFloat(ratio) / 100 + startColor.red let g = (endColor.green - startColor.green) * CGFloat(ratio) / 100 + startColor.green let b = (endColor.blue - startColor.blue) * CGFloat(ratio) / 100 + startColor.blue view.backgroundColor = UIColor(red: r, green: g, blue: b, alpha: 1.0) ‣։࢝৭GDG ‣໨త৭EB ‣࠷େ਺஋
  13. Copyright © ZOZO Technologies, Inc. All Right Reserved. var currentPointY:

    CGFloat = 0.0 override func touchesMoved(_ touches: Set<UITouch>, with event: UIEvent?) { guard let touch = touches.first else { return } let diff = touch.previousLocation(in: view).y - touch.location(in: view).y currentPointY += diff let max = 60 let temperature = Int(currentPointY / (view.frame.height / CGFloat(max))) let ratio = (temperature * 100 / max) let startColor = UIColor(red: 79/255, green: 140/255, blue: 248/255, alpha: 1.0) let endColor = UIColor(red: 218/255, green: 20/255, blue: 40/255, alpha: 1.0) // R(X) = (Rb - Ra) * X/100 + Ra let r = (endColor.red - startColor.red) * CGFloat(ratio) / 100 + startColor.red let g = (endColor.green - startColor.green) * CGFloat(ratio) / 100 + startColor.green let b = (endColor.blue - startColor.blue) * CGFloat(ratio) / 100 + startColor.blue view.backgroundColor = UIColor(red: r, green: g, blue: b, alpha: 1.0) }