image-sequencer
image-sequencer copied to clipboard
Alternative UI implementations (long-term)
I think we ought not to do this just yet, but part of the long term plan is to have different UIs be able to run Image Sequencer. I'm collecting a few ideas all in one place, but we have plenty of work before these seem to be a reasonable priority to take up.
- "node-and-line" style UI - like a flow-based program (Quartz Composer, Pure Data, node red (javascript!), etc)
- visual nodes-and-lines UI: https://github.com/flowhub/the-graph
- https://flowhub.github.io/the-graph/examples/demo-simple.html
- Possible web-based commandline interface: https://hyper.is/?
- (for node-and-line style UIs) non-linear sequences with Y-splitters -- ability to split an image into two sequences! (whoa)
(Many from https://github.com/publiclab/image-sequencer/issues/118)
More!
- https://developers.google.com/blockly/
- Materialize?
@jywarren I'll try to change some basic looks using materialize. I have a bit of experience with that
@jywarren @publiclab/is-reviewers I just had a great idea in mind. How about making an image-sequencer desktop app? Using electron we can create that app. It will be cross platform and very easy to build too since we can easily copy the current website code and run it in electron. It can be a good example of ui implementation. It can be in a separate repository. Thoughts?
@jywarren One thing I want to suggest if we should change our UI code to React.js.
@Divy123 @jywarren how about creating a new repo for different image-sequencer ui implementations with reactjs, blockly, electron etc. While keeping the legacy ui in the current repo but planning a complete overhaul for that(stylewise only) because purejs/html is better for first timers. Thoughts?
@jywarren I agree with @Divy123 about using frameworks for the long run. The UI is very light for now and pure JS and HTML are just about perfect to render it, but should the project UI get an overhaul with a very impressive UI/UX structure, we might need to look into frameworks to make our jobs easier and make the code more legible
@VibhorCodecianGupta the UI overhaul can be done stylewise by using some modern CSS framework like materialize to make the page look modern and flat and then the same UI can be copied over to react and just break the different parts of the page into different components. Thoughts?
On Thu 24 Jan, 2019, 11:06 PM Vibhor Gupta <[email protected] wrote:
@jywarren https://github.com/jywarren I agree with @Divy123 https://github.com/Divy123 about using frameworks for the long run. The UI is very light for now and pure JS and HTML are just about perfect to render it, but should the project UI get an overhaul with a very impressive UI/UX structure, we might need to look into frameworks to make our jobs easier and make the code more legible
— You are receiving this because you commented. Reply to this email directly, view it on GitHub https://github.com/publiclab/image-sequencer/issues/708#issuecomment-457286998, or mute the thread https://github.com/notifications/unsubscribe-auth/AhKOn6jUof8wElGbnDupmmh4DBmx_LK8ks5vGe8zgaJpZM4aP3ru .
@HarshKhandeparkar agreed but there is more to it. Since as of now we are dealing with lots of UI states I think working with redux can be a great advantage. After employing react and redux together we can surely work on styles or rather we can work simultaneously on both.
@Divy123 you can work on React, I will work on styles. We can then merge both maybe?
Sure @HarshKhandeparkar that would be great. Lets know @jywarren thinks upon this.
@jywarren @Divy123 @publiclab/is-reviewers How does this look?
That's super cool!! Awesome !! While right now I am struggling with my npm . The npm install is too slow
Collapsible update! @jywarren @Divy123 @publiclab/is-reviewers
I think #670 can be a part if we plan to use React and redux.
Update!!! @publiclab/is-reviewers @jywarren
Download! :
Insert Step! :
If it looks like the animations are a bit stuttery, they are not. Its because the GIF frame rate is low. Thanks!
@publiclab/is-reviewers @Divy123 @jywarren Update!!
new header:
new footer:
new range:
new responsive page design:
new responsive step images:
new self-adjusting textareas instead of inputs:
Super awesome. Looks amazing @HarshKhandeparkar @jywarren please have a look and also I want to migrate the code to React and redux. Should I proceed ahead?
@Divy123 I have made some other general changes to the code as well. Please have a look at it if you haven't. Thanks!
https://github.com/HarshKhandeparkar/image-sequencer/commits/materialize-ui-overhaul
I also love this 💕💕, but I really want to encourage folks to consider letting our codebase mature a bit more before attempting a new UI. I know it's exciting to try out but we have a lot of things to work on to flesh out and stabilize the codebase before I think we're ready for a new UI.
Make no mistake, i truly appreciate your energy and enthusiasm here. But let's look at a couple of the big projects we need to complete before opening a new one.
For example, the idea of truly standalone meta modules #315, or full UI testing, or per module comparison testing. And then of course the big project of a serverless express app to allow cloud-based processing. Also webassembly acceleration! Many are listed at https://github.com/publiclab/image-sequencer/labels/project
These are all critical projects and once we build them out we'll be in a much better place to take on a new big project because the core of our library will be stronger.
I'm 100% in support of this new UI, but I want to encourage us to think about it in the /next/ cycle of big projects, rather than right now. I hope that sounds reasonable and fair!!! What do you all think?
And once more, this is really impressive!!!!
On Tue, Jan 29, 2019, 2:03 PM Slytherin <[email protected] wrote:
Super awesome. Looks amazing. @jywarren https://github.com/jywarren please have a look and also I want to migrate the code to React and redux. Should I proceed ahead?
— You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub https://github.com/publiclab/image-sequencer/issues/708#issuecomment-458621637, or mute the thread https://github.com/notifications/unsubscribe-auth/AABfJ9F9cKqlu7eO6izgFVV3OFjXzX0vks5vIH7agaJpZM4aP3ru .
Sure I will look into it and reach back to you right then @HarshKhandeparkar
@jywarren what I have done is I have deprecated bootstrap. Also I have added responsiveness and also refactored the code a little bit. It does not touch any other field. It just stabilizes the code in general
@jywarren Materialize is a very similar to bootstrap and even a bit simpler. It has no dependencies either. I have only used materialize instead of bootstrap. I have also fixed errors and redundancies in the index.html file. I have also tried to minimise custom styles. Also I have changed the js code and split it into two different folders one for DOM and one for sequencer actions. Also fixed a few code errors. All of the code is almost the same with a few changes, mostly changes in classes. I have replaced the bootstrap components with similar looking materialize components. The end result is that the UI looks better since equivalent materialize components look better than bootstrap. Also the inputs have been changed to reduce custom code and to increase esse of input(in case of textarea)
Sure @jywarren . Also I think the changes made by @HarshKhandeparkar are easily adoptable . The idea of using React can be postponed until the changes as said by you are done.
Ok, well Harsh maybe share a PR, but I worry about the changes affecting the display of button state for many custom UI behaviors, and a number of UIs relied on bootstrap. Let's give it a good testing but I hope you understand my caution in this!
You can apart from opening a PR also push to your own gh-pages branch to let other people try it out. Thanks!
On Tue, Jan 29, 2019, 2:27 PM Slytherin <[email protected] wrote:
Sure @jywarren https://github.com/jywarren . Also I think the changes made by @HarshKhandeparkar https://github.com/HarshKhandeparkar are easily adoptable . The idea of using React can be postponed until the changes as said by you are done.
— You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub https://github.com/publiclab/image-sequencer/issues/708#issuecomment-458630279, or mute the thread https://github.com/notifications/unsubscribe-auth/AABfJ54hBpuWUiYT00ZyIH-CTUTd0J9lks5vIIRSgaJpZM4aP3ru .
@jywarren sure. I think I will open a PR and any you can point out any concerning things? This is still a WIP though
@jywarren do my gh-pages link to harshkhandepsrkar.github.io
? Or some other link? I haven't tried it before.
That's fine! Even if we just leave it open as a PR for a while we can point to it as an alternative UI.
Although perhaps for future ones we might try to develop them im addition to our existing UI, rather than replacing it, that's part of the idea of having the UI be a separate layer that's swappable. Make sense?
On Jan 29, 2019 3:24 PM, "Harsh Khandeparkar" [email protected] wrote:
@jywarren https://github.com/jywarren sure. I think I will open a PR and any you can point out any concerning things? This is still a WIP though
— You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub https://github.com/publiclab/image-sequencer/issues/708#issuecomment-458650750, or mute the thread https://github.com/notifications/unsubscribe-auth/AABfJ7Q-hlU4lapy9H1IROT9paGG4yvFks5vIJGfgaJpZM4aP3ru .
Yes it'll be that plus /image-sequencer/
🙌🏽
On Tue, Jan 29, 2019, 3:27 PM Jeffrey Warren <[email protected] wrote:
That's fine! Even if we just leave it open as a PR for a while we can point to it as an alternative UI.
Although perhaps for future ones we might try to develop them im addition to our existing UI, rather than replacing it, that's part of the idea of having the UI be a separate layer that's swappable. Make sense?
On Jan 29, 2019 3:24 PM, "Harsh Khandeparkar" [email protected] wrote:
@jywarren https://github.com/jywarren sure. I think I will open a PR and any you can point out any concerning things? This is still a WIP though
— You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub https://github.com/publiclab/image-sequencer/issues/708#issuecomment-458650750, or mute the thread https://github.com/notifications/unsubscribe-auth/AABfJ7Q-hlU4lapy9H1IROT9paGG4yvFks5vIJGfgaJpZM4aP3ru .
@jywarren yess! That's a great idea. I am going to open a pr right now. Thanks for the help with gh-pages.
@HarshKhandeparkar a great work!! :+1: