# My thoughts for a GUI 1.0 | looking for a frontend developer :)

**URL:** https://forum.syncthing.net/t/my-thoughts-for-a-gui-1-0-looking-for-a-frontend-developer/3002
**Category:** UX
**Created:** [June 10, 2015, 1:53pm UTC](https://forum.syncthing.net/t/my-thoughts-for-a-gui-1-0-looking-for-a-frontend-developer/3002 "2015-06-10T13:53:59Z")
**Posts on this page:** 20
**Page:** 1

<div class="post-metadata">

### Author: ![Eddy2909](https://forum.syncthing.net/user_avatar/forum.syncthing.net/eddy2909/32/2011_2.png) [@Eddy2909](https://forum.syncthing.net/u/Eddy2909)
#### Post date: [June 10, 2015, 1:53pm UTC](https://forum.syncthing.net/t/my-thoughts-for-a-gui-1-0-looking-for-a-frontend-developer/3002/1 "2015-06-10T13:53:59Z")

</div>

hi there! as I said, I made some thoughts about a new interface. These are my results:

clean Desktop with

- Device-identifikation by color (for unconscious recognition of devices)
- chart for up & download-speed
- chart for CPU & RAM usage
- future feature?: pause syncing \>\> delete!

**LARGE** @ 1920x1080 Dashboard (folderview) (default view)

 ![](https://forum-uploads.syncthingcdn.net/original/2X/0/0a3442a058473ba8a75408ed8638c1a82d82e8df.jpg)

Dashboard with popups

 ![](https://forum-uploads.syncthingcdn.net/original/2X/f/fd2ee6e30e9d4324b879ceabec44bb4c9568f6dc.jpg)

Device /Syncthing-Settings (own device)

 ![](https://forum-uploads.syncthingcdn.net/original/2X/6/675295585e4249f6f99c2f037cb767c950f7bb00.jpg)

Device-Settings (node)

 ![](https://forum-uploads.syncthingcdn.net/original/2X/2/2e157fc6b2664fcc11c7b7c6096b3198f85d35da.jpg)

Folder-Settings

 ![](https://forum-uploads.syncthingcdn.net/original/2X/a/a28b5681b777149430a87e77195e1e72dbc65d8c.jpg)

filesync details

 ![](https://forum-uploads.syncthingcdn.net/original/2X/e/ea08a51efcc081fbe5d1fc5f69b9430fb7b0a596.jpg)

add folder modal cxl (see popup)

add device modal cxl (see popup)

(restart) modal cxl (see popup)

Opened Device and Folderdetails (accordion) _cancelled_ tnx2 @calmh

**MEDIUM** @ 1024x768 Dashboard (folderview) (default view)

 ![](https://forum-uploads.syncthingcdn.net/original/2X/a/a5baf578de5a8bd64e069b86dd0f91597aacb34e.jpg)

Device /Syncthing-Settings (own device)

 ![](https://forum-uploads.syncthingcdn.net/original/2X/2/2004c698dfc73345a54d80f290e6a2654ab91936.jpg)

Device-Settings (node)

 ![](https://forum-uploads.syncthingcdn.net/original/2X/d/d1db0561305bfeff5fb524551d456c9ccd331cbb.jpg)

Folder-Settings

 ![](https://forum-uploads.syncthingcdn.net/original/2X/6/6f3bcf578aa175beb18ca31680e0c9a45cb4fcd4.jpg)

filesync details

 ![](https://forum-uploads.syncthingcdn.net/original/2X/d/d7f4e93d5a6555f99178bb0aa5c5fbfe0a7a20c2.jpg)

(restart) modal cxl (see popup)

add folder modal cxl (see popup)

add device modal cxl (see popup)

**SMALL** @ 540x960 Dashboard (folderview) (default view)

 ![](https://forum-uploads.syncthingcdn.net/original/2X/b/b17cc60ff881faa27977aa5825f8876349c4c2bd.jpg)

Device /Syncthing-Settings (own device)

 ![](https://forum-uploads.syncthingcdn.net/original/2X/3/3cfe95dd3ee06346e4a9cf39e6a70cdfa55b0704.jpg)

Device-Settings (node)

 ![](https://forum-uploads.syncthingcdn.net/original/2X/4/45bbe5cbc43d87c49905b5e1dde4249d619bc4e1.jpg)

Folder-Settings

 ![](https://forum-uploads.syncthingcdn.net/original/2X/4/4b8e50bb7d69378cd1fe7573725f4d3ac22c21e4.jpg)

filesync details

 ![](https://forum-uploads.syncthingcdn.net/original/2X/c/c2d794f06958e9e928b2f961c4533c492b641478.jpg)

(restart) modal cxl (see popup)

add folder modal cxl (see popup)

add device modal cxl (see popup)

looking forward to your feedback 😋

---

<div class="post-metadata">

### Author: ![calmh](https://forum.syncthing.net/user_avatar/forum.syncthing.net/calmh/32/15311_2.png) [@calmh](https://forum.syncthing.net/u/calmh)
#### Post date: [June 10, 2015, 1:59pm UTC](https://forum.syncthing.net/t/my-thoughts-for-a-gui-1-0-looking-for-a-frontend-developer/3002/2 "2015-06-10T13:59:00Z")

</div>

Looks nice.

---

<div class="post-metadata">

### Author: ![Eddy2909](https://forum.syncthing.net/user_avatar/forum.syncthing.net/eddy2909/32/2011_2.png) [@Eddy2909](https://forum.syncthing.net/u/Eddy2909)
#### Post date: [June 10, 2015, 2:04pm UTC](https://forum.syncthing.net/t/my-thoughts-for-a-gui-1-0-looking-for-a-frontend-developer/3002/3 "2015-06-10T14:04:14Z")

</div>

…bit too colorful in my opinion. I love using boxed, clean and flat designs - but couldn’t (yet) transpose it to syncthing 😌

---

<div class="post-metadata">

### Author: ![Eddy2909](https://forum.syncthing.net/user_avatar/forum.syncthing.net/eddy2909/32/2011_2.png) [@Eddy2909](https://forum.syncthing.net/u/Eddy2909)
#### Post date: [June 13, 2015, 11:20pm UTC](https://forum.syncthing.net/t/my-thoughts-for-a-gui-1-0-looking-for-a-frontend-developer/3002/4 "2015-06-13T23:20:17Z")

</div>

btw: what about some pause feature to pause syncing?

---

<div class="post-metadata">

### Author: ![bigbear2nd](https://forum.syncthing.net/user_avatar/forum.syncthing.net/bigbear2nd/32/4525_2.png) [@bigbear2nd](https://forum.syncthing.net/u/bigbear2nd)
#### Post date: [June 14, 2015, 4:25pm UTC](https://forum.syncthing.net/t/my-thoughts-for-a-gui-1-0-looking-for-a-frontend-developer/3002/5 "2015-06-14T16:25:44Z")

</div>

> <https://github.com/syncthing/syncthing/issues/215>

---

<div class="post-metadata">

### Author: ![zukoo](https://forum.syncthing.net/user_avatar/forum.syncthing.net/zukoo/32/891_2.png) [@zukoo](https://forum.syncthing.net/u/zukoo)
#### Post date: [June 15, 2015, 6:20am UTC](https://forum.syncthing.net/t/my-thoughts-for-a-gui-1-0-looking-for-a-frontend-developer/3002/6 "2015-06-15T06:20:26Z")

</div>

Looks nice, to me, defintely better than the current.

Maybe reusing the node specific icons from the current ui in the “Share with” column and device box would be better.

---

<div class="post-metadata">

### Author: ![Eddy2909](https://forum.syncthing.net/user_avatar/forum.syncthing.net/eddy2909/32/2011_2.png) [@Eddy2909](https://forum.syncthing.net/u/Eddy2909)
#### Post date: [June 15, 2015, 8:30am UTC](https://forum.syncthing.net/t/my-thoughts-for-a-gui-1-0-looking-for-a-frontend-developer/3002/7 "2015-06-15T08:30:40Z")

</div>

> [@zukoo](#):
>
> Maybe reusing the node specific icons from the current ui in the “Share with” column and device box would be better.

thanks! I know from work that recognising thinks works much better with colors than with “forms”. By using colors we could color the corner of the navbar as the devices color is chosen. Honestly I dont like the color-boxes in the “shared with” column too. 😝

---

<div class="post-metadata">

### Author: ![zukoo](https://forum.syncthing.net/user_avatar/forum.syncthing.net/zukoo/32/891_2.png) [@zukoo](https://forum.syncthing.net/u/zukoo)
#### Post date: [June 15, 2015, 9:26am UTC](https://forum.syncthing.net/t/my-thoughts-for-a-gui-1-0-looking-for-a-frontend-developer/3002/8 "2015-06-15T09:26:22Z")

</div>

A few more cents 😉

- Rename the column “local/global” to “State” and use the small font with the existing local/global logos on two lines. Also do this for “Size” to have local & global info here too.
- “Foldername” is not such a nice column name.
- What is the meaning of the red pause button? If red means the folder is paused maybe it should display a play sign instead of pause.
- Last, the memory gauge might be better off with actual value rather than percentage.

---

<div class="post-metadata">

### Author: ![canton7](https://forum.syncthing.net/user_avatar/forum.syncthing.net/canton7/32/9528_2.png) [@canton7](https://forum.syncthing.net/u/canton7)
#### Post date: [June 15, 2015, 9:31am UTC](https://forum.syncthing.net/t/my-thoughts-for-a-gui-1-0-looking-for-a-frontend-developer/3002/9 "2015-06-15T09:31:23Z")

</div>

Just to make sure that previous work isn’t overlooked:

> [@New interface design](https://forum.syncthing.net/t/new-interface-design/1874):
>
> Hey guys, I have been working on a new interface for Syncthing lately and wanted to share it with you guys before proceeding further. The goal with it is to make it easier for average users to use the app, by simplifying the interface and making it easy to understand what is happening at any given moment, without needing special knowledge or abilities. I wanted the interface to feel familiar by using recognizable design patterns. The biggest change is that folders now look more like people exp…

---

<div class="post-metadata">

### Author: ![Eddy2909](https://forum.syncthing.net/user_avatar/forum.syncthing.net/eddy2909/32/2011_2.png) [@Eddy2909](https://forum.syncthing.net/u/Eddy2909)
#### Post date: [June 16, 2015, 8:14am UTC](https://forum.syncthing.net/t/my-thoughts-for-a-gui-1-0-looking-for-a-frontend-developer/3002/10 "2015-06-16T08:14:06Z")

</div>

cross post from [/custom-gui-mockups-and-programming/](https://forum.syncthing.net/t/custom-gui-mockups-and-programming/2921/15)

> [@Custom gui | Mockups and programming](https://forum.syncthing.net/t/custom-gui-mockups-and-programming/2921/17):
>
> Fwiw, in current master (v0.11.10 when it’s released), files can be dropped in $config\_dir/gui (i.e. ~/.config/syncting/gui on Linux etc) to override the compiled in GUI on the fly, without restarting or setting environment variables.

Is there anybody who would develop this GUI (with me)? I could do any needed graphical-work - but developing 😒 not.

---

<div class="post-metadata">

### Author: ![Eddy2909](https://forum.syncthing.net/user_avatar/forum.syncthing.net/eddy2909/32/2011_2.png) [@Eddy2909](https://forum.syncthing.net/u/Eddy2909)
#### Post date: [June 16, 2015, 9:20am UTC](https://forum.syncthing.net/t/my-thoughts-for-a-gui-1-0-looking-for-a-frontend-developer/3002/11 "2015-06-16T09:20:01Z")

</div>

> [@zukoo](#):
>
> What is the meaning of the red pause button? If red means the folder is paused maybe it should display a play sign instead of pause.

the red pause button has two features:

- it indicates the process of syncing (red 0-33%, orange 34-66%, green 67-99,99%)
- it’s the button to pause and resume syncing so this one button shows the sync-process (running and paused) and allows you to pause and to resume 😌

---

<div class="post-metadata">

### Author: ![canton7](https://forum.syncthing.net/user_avatar/forum.syncthing.net/canton7/32/9528_2.png) [@canton7](https://forum.syncthing.net/u/canton7)
#### Post date: [June 16, 2015, 9:28am UTC](https://forum.syncthing.net/t/my-thoughts-for-a-gui-1-0-looking-for-a-frontend-developer/3002/12 "2015-06-16T09:28:07Z")

</div>

> [@Eddy2909](#):
>
> so this one button shows the sync-process (running and paused) and allows you to pause and to resume

Personally I would find such dual-meaning confusing 😄

---

<div class="post-metadata">

### Author: ![Eddy2909](https://forum.syncthing.net/user_avatar/forum.syncthing.net/eddy2909/32/2011_2.png) [@Eddy2909](https://forum.syncthing.net/u/Eddy2909)
#### Post date: [June 16, 2015, 9:44am UTC](https://forum.syncthing.net/t/my-thoughts-for-a-gui-1-0-looking-for-a-frontend-developer/3002/13 "2015-06-16T09:44:51Z")

</div>

already changed it 🙂

---

<div class="post-metadata">

### Author: ![bigbear2nd](https://forum.syncthing.net/user_avatar/forum.syncthing.net/bigbear2nd/32/4525_2.png) [@bigbear2nd](https://forum.syncthing.net/u/bigbear2nd)
#### Post date: [June 16, 2015, 12:23pm UTC](https://forum.syncthing.net/t/my-thoughts-for-a-gui-1-0-looking-for-a-frontend-developer/3002/14 "2015-06-16T12:23:53Z")

</div>

Are you working and updating this design: [https://projects.invisionapp.com/share/AB2A6DYZN#/screens](https://projects.invisionapp.com/share/AB2A6DYZN#/screens) out of this issue?

> <https://github.com/syncthing/syncthing/issues/1381>

---

<div class="post-metadata">

### Author: ![Eddy2909](https://forum.syncthing.net/user_avatar/forum.syncthing.net/eddy2909/32/2011_2.png) [@Eddy2909](https://forum.syncthing.net/u/Eddy2909)
#### Post date: [June 16, 2015, 2:24pm UTC](https://forum.syncthing.net/t/my-thoughts-for-a-gui-1-0-looking-for-a-frontend-developer/3002/15 "2015-06-16T14:24:35Z")

</div>

nope… it could be a alternative UI or in the end some idea. I think the mockups of Brennan are really nice but imho too flat or plain. (dont know the right words)

and there are some points I would not do like in these mockups - important features are missing.

---

<div class="post-metadata">

### Author: ![thgh](https://forum.syncthing.net/letter_avatar_proxy/v4/letter/t/ce73a5/32.png) [@thgh](https://forum.syncthing.net/u/thgh)
#### Post date: [June 16, 2015, 7:55pm UTC](https://forum.syncthing.net/t/my-thoughts-for-a-gui-1-0-looking-for-a-frontend-developer/3002/16 "2015-06-16T19:55:26Z")

</div>

I would be interested to develop this. Just figured out how to edit the GUI.

My goal is to use this at work where we do projects in teams. Lots of folders/devices. The plan is to first hide useless information and make better use of screen estate. Expect something more like BTS2.

---

<div class="post-metadata">

### Author: ![Eddy2909](https://forum.syncthing.net/user_avatar/forum.syncthing.net/eddy2909/32/2011_2.png) [@Eddy2909](https://forum.syncthing.net/u/Eddy2909)
#### Post date: [June 17, 2015, 1:21pm UTC](https://forum.syncthing.net/t/my-thoughts-for-a-gui-1-0-looking-for-a-frontend-developer/3002/17 "2015-06-17T13:21:38Z")

</div>

what is/are the useless information for you?

---

<div class="post-metadata">

### Author: ![thgh](https://forum.syncthing.net/letter_avatar_proxy/v4/letter/t/ce73a5/32.png) [@thgh](https://forum.syncthing.net/u/thgh)
#### Post date: [June 17, 2015, 6:22pm UTC](https://forum.syncthing.net/t/my-thoughts-for-a-gui-1-0-looking-for-a-frontend-developer/3002/18 "2015-06-17T18:22:55Z")

</div>

Let me tell you what I think is useful:

- folder
  - size + itemcount + peers for synced folders
  - progress for syncing folders
  - error/status for other

- device
  - ip (+ maybe last statechange) for connected devices
  - last seen for disconnected devices
  - error/status for other

- appearance:
  - mostly the basic options
  - option to disable help text

- settings
- advanced

Moved some code around to get a more “firefox/chrome settings”-like screen

 ![](https://forum-uploads.syncthingcdn.net/original/2X/c/c54dee1959ebe3ac9fc8ae9145c9a00953e2cef9.PNG)

---

<div class="post-metadata">

### Author: ![Eddy2909](https://forum.syncthing.net/user_avatar/forum.syncthing.net/eddy2909/32/2011_2.png) [@Eddy2909](https://forum.syncthing.net/u/Eddy2909)
#### Post date: [June 18, 2015, 11:05am UTC](https://forum.syncthing.net/t/my-thoughts-for-a-gui-1-0-looking-for-a-frontend-developer/3002/19 "2015-06-18T11:05:24Z")

</div>

[quote=“thgh, post:18, topic:3002”]foldersize[/quote] watch the mockups

[quote=“thgh, post:18, topic:3002”]itemcount[/quote] watch the mockups

[quote=“thgh, post:18, topic:3002”]peers for synced folders[/quote] watch the mockups

[quote=“thgh, post:18, topic:3002”]ip (+ maybe last statechange) for connected deviceslast seen for disconnected deviceserror/status for other[/quote] ok

[quote=“thgh, post:18, topic:3002”]last seen for disconnected devices[/quote] ok

[quote=“thgh, post:18, topic:3002”]error/status for other[/quote] whats other in this context?

[quote=“thgh, post:18, topic:3002”]mostly the basic options[/quote] ok - not yet layouted

[quote=“thgh, post:18, topic:3002”]option to disable help text[/quote] which help text? you mean the description text below the option-fields riight?

---

<div class="post-metadata">

### Author: ![ekim501](https://forum.syncthing.net/letter_avatar_proxy/v4/letter/e/96bed5/32.png) [@ekim501](https://forum.syncthing.net/u/ekim501)
#### Post date: [June 18, 2015, 11:07pm UTC](https://forum.syncthing.net/t/my-thoughts-for-a-gui-1-0-looking-for-a-frontend-developer/3002/20 "2015-06-18T23:07:54Z")

</div>

I personally would like to be able to group the devices and folders. I’m starting to get a lot of both and it would be nice if I could organize them.

[Next page](https://forum.syncthing.net/t/my-thoughts-for-a-gui-1-0-looking-for-a-frontend-developer/3002.md?page=2)
