portfolio-before/project_01.html at master · iamleejihye/portfolio-before · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
<!doctype html>
<head>
    <title>JIHYE LEEE</title>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no">
    <link href="index.css" rel="stylesheet">
    <link href='http://fonts.googleapis.com/css?family=Lato:300,400,700' rel='stylesheet' type='text/css'>
    <link rel="stylesheet" href="//code.jquery.com/ui/1.11.2/themes/smoothness/jquery-ui.css">
    <link rel="shortcut icon" href="asset/favicon.ico"/>
    <script src="jquery-2.1.3.js"></script>
    <script src="jquery-2.1.3.min.js"></script>
    <script>
        (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
                    (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
                m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
        })(window,document,'script','https://www.google-analytics.com/analytics.js','ga');

        ga('create', 'UA-86397112-1', 'auto');
        ga('send', 'pageview');

    </script>
</head>
<html>
<body>
<div class="j-side-menu">
    <div class="j-flex">
        <div>
            <div class="j-menues text-uppercase">
                <a href="http://jihyeleee.com/blog" target="_blank"><div class="j-menu-project">project</div></a>
                <a href="blog.html"><div class="j-menu-blog">blog</div></a>
                <a href="about.html"><div class="j-menu-about">about</div></a>
            </div>
            <div class="j-menu-snss text-uppercase">
                <a href="https://www.behance.net/designerleee" target="_blank">
                    <div class="j-menu-sns">behance</div>
                </a>
                <a href="https://www.facebook.com/iamleejihye" target="_blank">
                    <div class="j-menu-sns">facebook</div>
                </a>
                <a href="http://instagram.com/my.daily.routine" target="_blank">
                    <div class="j-menu-sns">instagram</div>
                </a>
            </div>
            <span class="j-body">© JIHYE LEE. 2017</span>
        </div>
    </div>
</div>
<div class="container">
    <header>
        <div class="j-menu icon"></div>
        <a href="index.html"><div class="j-logo icon"></div></a>
    </header>
    <section>
    <div class="j-project-text">
        <a href="project_07.html" class="icon j-icon-arrow-left"></a>
        <a href="project_02.html" class="icon j-icon-arrow-right"></a>
        <p class="j-title">RIDIBOOKS FOR MAC, WINDOWS</p>
        <p class="j-body">
            It's a redesigning project of RIDIBOOKS for Mac, Windows in order to integrate into an identity of RIDIBOOKS.
        </p>
        <p class="j-body-korean">
            전자책 서비스 <a href="https://goo.gl/Xpdme1" target="_blank">리디북스</a>
            Mac, Windows 용 프로그램인 <a href="https://goo.gl/QTTd6I"/ target="_blank">PC 뷰어</a>의
            내 서재, 구매목록 등의 메인 화면 개선을 진행하였습니다.
            이 프로젝트는 리디북스의 iOS, Android 앱과 브랜드 아이덴티티를 통합을 위해 진행하였습니다.
            메인 화면에서는 주로 리디북스 서점에서 산 책을 다운받고 관리할 수 있습니다.
            화면의 넓이가 좁아 책장 목록이 숨겨져 있는 모바일 앱과 달리,
            큰 화면을 사용할 수 있는 PC 뷰어는 한눈에 책장 목록과 책장을 볼 수 있는 시원한 구조로 설계되어 있습니다.
            그래서 모바일 앱과 완전히 같게 디자인하기보다는 PC 뷰어에 맞추면서도
            '리디북스'라는 하나의 브랜드 제품으로 느낄 수 있게 디자인하였습니다.
            <p class="j-annotation">*모든 기획과 UI, GUI 디자인을 진행하였습니다.</p>

        </p>
    </div>

        <ul class="j-project" id="j-project-01">
            <li class="j-thumbnail">
                <img src="img/j-project_01.png">
            </li>
            <li class="j-thumbnail">
                <img src="img/j-project_01_02.png">
            </li>
            <li class="j-thumbnail">
                <img src="img/j-project_01_03.gif">
            </li>
        </ul>
    </section>
    <footer>
        <div class="j-contact-title j-body">
            contact
        </div>
        <div class="j-contact">
            <div class="j-mail j-title">
                <a href="mailto:iam.leejihye@gmail.com">
                    iam.leejihye@gmail.com
                </a>
            </div>
            <div class="j-title">
                010.2053.0301
            </div>
        </div>
        <div class="j-sns">
            <span class="j-body">
                <a href="https://www.dribbble.com/iamleejihye" target="_blank">Dribbble</a>
            </span>
            <span class="j-body">
                <a href="https://www.behance.net/designerleee" target="_blank">Behance</a>
            </span>
            <span class="j-body">
                <a href="https://www.facebook.com/iamleejihye" target="_blank">Facebook</a>
            </span>
            <!-- <span class="j-body">
                <a href="http://instagram.com/writeveryday" target="_blank">Instagram</a>
            </span> -->
        </div>
        <address>
            <div class="j-body">
                © JIHYE LEE. 2017
            </div>
        </address>
    </footer>
</div>
</body>
</html>
<script>
    $('.j-menu').on('click', function() {
        $('.j-side-menu').fadeToggle('fast');
        $(this).toggleClass('x');
        $('html,body').toggleClass('hidesScrollBar');
    });

    $(document).ready(function(){
        $('.j-menu-about').click(function(){
            $('.j-about').fadeTo('fast');
        });
    });

    $(function() {
        $(document).keyup(function(e) {
            switch(e.keyCode) {
                case 37 :
                    window.location="project_07.html";
                    break;

                case 39 :
                    window.location="project_02.html";
                    break;
            }
        });
    });


</script>