개발 이야기 - Simplayer5

개발 2014.12.18 02:25 Posted by 시미카

한 8개월 전에 뮤직 플레이어에 관련해서 포스팅을 올린 적이 있었다.

(http://dyngina.tistory.com/37)



이 포스트의 마지막 말이

"아직까지는 전혀 불편한 점이 없기에 이 버젼을 6달 넘게 쓰고 있지만,

언젠간 필요한 게 생기거나, 질리면 새로 만들지도 모르겠다. 끝"


이었는데 정말 만들게 되었다.





글은 8개월만에 썼지만, 사실 저 포스팅을 적고 난 뒤 약 2개월만에 새로 프로젝트를 착수했던 것 같다.

(기록은 6월 18일이라고 되어 있다)


버젼 4에서 뭔가 불만이 있었던 것은 아닌데, 한계점이 보였던 것 까지는 기억한다.

아무래도 새롭게 도전하고 싶었던지 디자인부터 내부까지 싹 뜯어고치기로 결정하는데는 2개월 걸렸다.



5로 넘어가면서 바뀐 점은 크게 정리하면


1. 디자인 대폭 변경

2. 음악 말고도 아티스트, 앨범으로 정렬

3. 음악, 아티스트, 앨범 수 표시

4. 검색 기능

5. 리스트 최적화


디자인 대폭 변경


Simplayer4가 심플 컬러를 베이스로 한 디자인이었다면

Simplayer5는 블러 글래스를 베이스로 디자인을 했다.


어쩔 수 없이 컬러의 비중이 많이 줄어들 수밖에는 없었지만, 그래도 나름대로 유지는 했다.



(리스트 쪽에 테마 컬러의 흔적은 남아있다)


이외에도 이번 버젼에서는 디자인에 신경을 좀 많이 썼다.



아티스트, 앨범 정렬



(사실 가장 큰 변화점이 아닐까 싶다)


Simplayer4와 5의 가장 큰 차이점이라면 이게 아닐까 싶다.

아티스트와 앨범으로 정렬. 기존 타 플레이어에는 항상 있었기에 아쉬웠던 기능

개인적으로는 많이 쓰는 기능은 아니지만, 결정적일 때 찾기 쉬워지게 되었다.



음악, 아티스트, 앨범 수 표시





이 부분은 그리 어려운 건 아니었다. 다만 설정 창의 디자인이 변경되면서 

사실 넣을 게 없어서 넣은 기능 중 하나다.


검색 기능




이 플레이어에서 음악을 검색하는 방법은 3가지가 있다.


1. 그냥 치기 - 

     예를 들어 Beautiful Rain이란 노래를 찾고 싶다면 그저 beau...를 차례로 치기만 하면 된다. 

     그러면 플레이어가 자동으로 b~, be~, bea~로 시작하는 노래로 리스트를 이동한다.

     사실상 4번이면 거의 원하는 노래를 찾아간다고 보면 될 정도로 찾는 속도가 빠르다.

     다만 이 기능은 앞부터 검색하기 때문에 중간 단어는 찾지 못한다.


2. 인덱서 - 

     이전 버젼부터 있지만, 서두 문자로 이동한다.



사실상 기능은 '그냥 치기'의 하위호환이지만, 

인덱서는 마우스를 주로 잡고 있을 때 접근성이 빠르다.


3. 검색

    5.1이 되어서야 드디어 넣을 수 있었다. 기획 자체는 예전부터 있었지만

    능력 부족인지 번번히 실패했지만 이번에는 성공했다.




리스트 최적화


이 부분은 다른 포스팅에서 다뤄볼 예정이다.





마치며...


이번 버젼에서는 상당히 고생을 많이 했다. 여러가지 시도도 많이 했고, 

C#이라는 언어 자체를 이전보다 더 많이 다뤄볼 수 있는 기회도 됐다.

코드를 정리하는 능력은 아직 멀었지만, 앞으로 나아가는 이상 언젠간 괜찮아지지 않을까...




언젠가 또 무언가 필요하거나 질린다면 Simplayer6가 나올지도 모르겠다.




저작자 표시 비영리 변경 금지
신고

'개발' 카테고리의 다른 글

개발 이야기 - Simplayer5  (0) 2014.12.18
개발 이야기 - 런쳐  (0) 2014.07.17
개발 이야기 - 뮤직플레이어  (4) 2014.04.05

개발 이야기 - 런쳐

개발 2014.07.17 15:29 Posted by 시미카

방학이라 심심해서 적어보는 개발 이야기.

이번에는 런쳐 이야기다.


런쳐가 무엇인가 하면, 그냥 빠르게 어떤 폴더나 프로그램, 파일을 실행시키는 프로그램 정도다.

대충 '시작' 과 크게 다르지는 않다.






* 왜 만들었나?


'시작' 만으로는 사실 좀 불편한 점이 있다. 드래그해서 추가라던가, 약간 미묘하다던가.

개인 취향이지만, 이런 부분에 동의해서 사용하는 게

'ObjectDock' 'RocketDock' 등이 있다. 물론 이 둘은 테마 꾸미기의 일환일 때가 많지만.


그 ObjectDock을 사용하고 있었는데, 이 프로그램이 '바탕화면 보기' 기능을 작동시키면

약 10에서 20초정도 까맣게 멈췄었다. 단지 그게 싫어서 만들게 된 프로그램이다.




* 기존 프로그램과 다른 점?


사실상 없다. 오히려 부족한 기능도 많고, 버젼업을 해도 바뀐 건 디자인밖에 없다.

하지만, 이 프로그램을 만들게 되면서 많은 걸 알게 됐고, 

코드 정리도 깔끔하게 할 수 있었다는 건 사실이다.






#1. List Launcher




대강 이런 모습니다.

화면 오른쪽에 작은 막대가 항상 위에 떠있고, 누르면 이게 스르륵 나오는 방식이다.

세로 길이는 모니터 화면에 꽉 맞게 했다.

아쉽게도 드래그&드롭으로 파일, 폴더 추가는 되지 않았고, 단지 실행시키는 것만 가능했다.




추가할 때는 이런 창으로 추가를 했다.


다만 이 버젼에는 문제점이 2가지 있었는데


  1. 추가할 때 새로 창이 뜨는 건 별로였다.

  2. 모니터가 2개일 때 메인 모니터의 오른쪽에 막대가 뜬다.

       = 누르기 힘들다.


였다. 그래서 코드를 정리할 겸 새로 만들었다.





#2. ListLauncherPlus



색이 바뀌었다.

이 버젼에서는 위의 두 가지 문제점을 해결했다.


추가할 때 이렇게 내려왔다.



쓰기에는 나름 편했다.

그런데 이것도 빨리 질렸었다.




#3. Simplauncher


Simple + Launcher 의 합성어(?) 로 이름을 지어봤다.

모니터가 2개일 때 맨 오른쪽에 뜨면, 클릭하기 불편하므로, 그냥 왼쪽에 두기로 했다.




왼쪽의 스위치를 누르면 저렇게 화면 정 중앙에 검은 줄이 뜬다.

그리고 이 버젼에서 드디어 "드래그 + 드롭"으로 추가와 자리 이동을 추가했었다.


항목 수정도 이렇게 됐었다.




다만 쓰다보니, 아이콘이 정 중앙에 뜨기 때문에 클릭하기 힘들었다.

기타 여러가지 이유로 좀 질린 탓에, 또 새로 만들었으니...



#4. Simplauncher+


이 이름 우려먹는 건 꽤 오래될 것 같다.




스위치가 왼쪽에 있는 건 같지만, 이번엔 왼쪽에 저렇게 뜬다.

위치 이동에 애니메이션을 줬고, 기타 여러 버그를 수정했었다.




환경설정과 항목 수정은 저렇게 왼쪽에서 뜨게 했었다.

항목 드래그해서 지우는 기능도 생겼었다.

다만 질리지도 않게 이것도 질려서, "마지막으로 만들자" 식으로 하나를 만들었다.




#5 Simplauncher Flat


사실 Flat 디자인하고는 크게 상관은 없다.

그냥 유행이라 이렇게 지어보고 싶었던 것 같은데...



테마를 좀 더 밝게 했고, 정사각형에 가깝게 했다.




환경설정과 항목 설정은 따로 나오도록 바꿨다.

아직까지는 마음에 들어서 지금 몇달째 쓰고 있다.





* 마치며


사실상 그렇게 기능이 뛰어난 프로그램도 아니었지만, 

"그냥 만들어보자" 해서 만든 프로그램 중에 하나가 아닌가 싶다.
(뮤직 플레이어도 비슷하긴 하지만)


그래도 원하는 걸 만들다보니 즐겁게 만들 수 있었던 것같다.

저작자 표시 비영리 변경 금지
신고

'개발' 카테고리의 다른 글

개발 이야기 - Simplayer5  (0) 2014.12.18
개발 이야기 - 런쳐  (0) 2014.07.17
개발 이야기 - 뮤직플레이어  (4) 2014.04.05

개발 이야기 - 뮤직플레이어

개발 2014.04.05 00:02 Posted by 시미카

대학교 들어가고 나서 하도 할 게 없어서 방치해뒀던 블로그에 썰이나 풀려고 함.

대회가 다 끝나서 알고리즘하고 C++을 반 접고, 비슷한데 재밌어 보이던 C#을 잡은 지 어연 2년



사실 C#을 잡았던 이유가 알송이 좀 많이 불편해서 

(알송이 안좋은 프로그램이란 건 아닌데, 그 당시 뭔가 불편한 사항이 있었던 건 기억함)

C#이면 내가 뮤직 플레이어를 만들 수 있지 않을까 해서 시작한 게 아주 틀린 말은 아니었음


여튼 엄청난 시행착오 끝에 몇달만에 그럭저럭 노래 재생이 되는 프로그램을 하나 만들었는데,

이름은 무려 짓지 않았다!


1.



그냥 딱 재생만 되게 만든 형태인데, 이게 어떤 방법이냐면, 그냥 하드의 어떤 폴더를 정한 후에

시작할 때 확장자 mp3로 된 것 긁어서 갖고오게 했다. 새로고침을 누르면 목록이 갱신되고


그 당시에는 나름대로 쓸만했던 것 같다. 단축키도 됐었고... 

사실 재생에 대한 건 전부 됐던 것 같다.

하지만 따분해 보이는 디자인에 별 기능이 없어서 새로 만들기로 했다.


2. Portable Media Player



통칭 PMP. 이름을 처음 지은 플레이어인데, 사실 유저는 혼자였기에 의미는 없었다.

아직까지는 C# WinForm으로 만든 프로그램이었고, 이 때 알송 가사 기능을 처음 넣었었다.

(누군가 도와줬던 것 같은데, 잊어먹음)


앨범아트가 나오기도 하고, 전체적으로 깔끔하게 해보려고 노력을 많이 했다.

왼쪽 위의 메뉴에 뭔가 넣으려고는 했는데, 사실 페이크다.


알송 가사 기능을 넣을 때 추가한 기능이 있는데, 가사의 싱크를 조절하는 기능이었다.

당시에는 버그가 좀 많이 있어서 불완전하긴 했어도 어쨌든 동작은 했었다.

맨 밑의 토마토색에 있는 의미를 모르는 줄이 그 싱크 조절 스테이터스다.


보시다시피 우중충하기도 했고, 뭔가 바꿔보고 싶어서 또 프로젝트를 날리고 새로 짰다.

3번째 뮤직플레이어의 탄생이었다.


3. Simplayer



심플레이어 네이밍을 처음 사용한 뮤직 플레이어인데, 이름의 유래는 짐작할 수 있듯이 Simple + Player다.

말 그대로 간단한 플레이어를 지향하는 의미에서 지은 이름이고, 지금까지 쓰고 있다.


기능으로서는 배경에 앨범 커버를 흐릿하게 해서 이쁘게 만들었고, 

테마색을 앨범아트의 대표색을 추출해서 쓴다. 즉, 앨범아트 바뀌면 저 회색 부분이 바뀐다.

그 당시에는 꽤나 만족했던 기능이고, 지금도 쓰고싶지만 아쉽게도 이 기능은 버렸기에...


구조적으로는 WinForm에서 WPF로 넘어왔다. 

기억하기에는 WPF로 처음 시도한 프로그램이 아닐까 싶은데... 잘 기억은 나지 않는다.

하지만 디자인은 꽤 바뀌었지만 기능은 거의 변하진 않았다.


여튼 당시에 꽤나 머리 싸매면서 있는 감각 없는 감각 다 모아서 디자인을 했었고, 

다 만들었을 때 꽤나 만족을 했었다. 물론 지금 봐도 내 기준에서는 꽤나 걸작이라고 생각한다.

(기능 면은 제외하고).


쓰는 도중에 인터넷에서 디자인 샘플을 보던 도중 꽤나 매력적이고 심플한 디자인을 발견했는데,

갑자기 욕구가 생겨서 한번 구현해볼까? 해서 하나 더 만들었다. 순서로는 4번째 플레이어.


4. SQPL



이름이 왜 저러냐면 네모 모양이라서 Square Player 라고 하려다가 타자치기 힘들어서

그냥 SQPL로 줄여서 프로젝트 이름을 지었다. 사실 유저가 혼자라서 이름은 상관없지만.


아마 검색하면 비슷한 디자인을 볼 수 있을텐데, 그대로 구현하려고 노력은 했다.

미묘하게 바뀐 곳이 있지만.


스크린샷에는 없지만, 목록을 불러올 수 있으며, 화면 좌편에 뜨고, 목록에 앨범아트를 띄웠다.

노래 찾는 속도가 빨라졌고, 미관상 이쁘기도 했다.


근데 내가 쓰기 불편했다. 그래서 몇주 쓰다가 버리고 새로 만들었다.

질리지도 않고 5번째 플레이어를 만들었는데...



5. SimplayerFLAT

다시 Simplayer 시리즈로 돌아왔다.

이것도 아마 어디서 디자인을 본 것 같은데, 딱히 라이센스라던가 그런게 걸려있지 않은 것 같아서

한 80% Mock up을 따와서 구현해봤다. 원 디자인에 비하면 이건 못만든 편이지만.

(애초에 디자인 안배우고 대충 때려박는 사람과 디자이너는 차이가 클 수밖에 없다고 생각한다)


원래대로 플레이어 + 리스트 방식으로 돌아왔다.


리스트에 간단하게 음악 이름과 플레이 시간만 뜨도록 변경됐다.

조금 차이점이라면, 오른쪽 아래의 화살표를 누르면 목록이 접어진다. 

미니 플레이어라고 할 수 있는데, 지인이 의견을 내서 만들었다.


그리고 처음으로 인덱서를 구현했는데, 왼쪽 아래의 'Y' 모양이 그것이다.

누르면 이니셜이 쫙 뜨는데, 누르면 그쪽으로 이동된다. 지금도 쓰고 있는 편리한 기능

이 버젼에서는 이름순으로 자동 정렬을 시켰으니 되는 일이었다.


이 플레이어로 진짜 오랫동안 몇달을 썼던 것 같다. 서너달 썼던 것 같다.


잘 쓰고 있었는데, 위의 '지인'이 말하기를

'한 번 배포 가능하게 여러 설정 넣어보는 게 어떻겠느냐' 라는 의견을 냈다.


괜찮은 기능이라고 생각해서 수정할까 싶어서 보는데,

코드가 답이 없었다. 물론 지금 짜는 코드도 답이 없긴 매한가지지만


여튼 그래서 또 새로 프로젝트를 만들었고, 이것이 6번째이며 현재까지 통틀어 최종 버젼이다.


6. Simplayer4


왜 6번째인데 4냐면 Simplyer 짓고 나서 4번째라서 그렇다.

사실 이전 두개는 프로토타입에 가까웠고. 디자인은 전체적으로는 비슷한데, 더 깔끔해 보이려고 노력을 많이 했다. 정말로 많이 했다.


대부분은 비슷한데 크게 다른 게 하나 있다면 설정창이 생겼다는 것.



이런식으로. 컬러도 바꿀 수 있게 해봤는데, 생각보다 좋더라.

어차피 한번 바꾸면 거의 안바꾸지만 있는 건 없는 것보다 훨씬 낫다고 생각한다.


나머지 기능은 거의 FLAT 버젼과 동일하다.

이쪽은 지인 두명정도 달래서 줫는데, 실제로 쓰는지는 모르겠다.

일단 나는 잘 쓰고 있고.







아직까지는 전혀 불편한 점이 없기에 이 버젼을 6달 넘게 쓰고 있지만,

언젠간 필요한 게 생기거나, 질리면 새로 만들지도 모르겠다. 끝



여담 1. 지금 다시 보니 첫번쨰 버젼하고 최종하고 별로 다를 게 없네

여담 2. 그때나 지금이나 코딩 실력은 별로 안는 것 같다...

여담 3. 뭔가 네트워크 다루는 사람들 보면 멋있어 보이던데 그런 것도 한번 도전해보고는 싶다.


저작자 표시 비영리 변경 금지
신고

'개발' 카테고리의 다른 글

개발 이야기 - Simplayer5  (0) 2014.12.18
개발 이야기 - 런쳐  (0) 2014.07.17
개발 이야기 - 뮤직플레이어  (4) 2014.04.05