gchq/CyberChef

Misc: Mobile UI

Open

#181 opened on Aug 18, 2017

View on GitHub
 (14 comments) (6 reactions) (0 assignees)JavaScript (34,843 stars) (3,944 forks)batch import
featurehelp wanted

Description

Summary

The current UI isn't very good on mobile devices. We should start thinking about how we can improve it.

Possible solutions

There are two paths we could go down:

  1. Create an entirely separate UI for mobile devices
  2. Make modifications to the current UI so that it adjusts better to fit smaller screens

I'm keen to hear people's opinions on which route they think is best. There are definitely pros and cons to each one. If we create an entirely new UI, it will break a lot of the code in src/web/ which is currently tightly coupled to the existing DOM. However, modifying the current UI to work better on mobile could result in messy code if it isn't done well. This could be a good time to start building index.html in a more modular fashion so that the code becomes easier to maintain.

If anyone wants to mock up some designs for what a mobile UI could look like, please go ahead. The focus should be on simplicity.

Contributor guide

Tech stack
javascripthtmlcss
Domain
frontend
Issue type
feature
DifficultyEstimated implementation difficulty for a new contributor, from 1 for very small changes to 5 for expert-level work.
3
Estimated timeA rough time range for an experienced contributor to investigate, implement, test, and prepare a pull request.
1-2 days
Activity statusHow available the issue appears right now: fresh, active, stale, blocked, or waiting on maintainer input.
stale
ClarityHow clearly the issue explains the expected change, acceptance criteria, and next step.
needs investigation
Prerequisites
basic HTML/CSSfamiliarity with CyberChef codebase
Newbie friendlinessA 1-100 score estimating how approachable this issue is for first-time contributors.
30
Research direction
Explore the src/web/ directory to understand the current DOM structure and code coupling. Review the comments on this issue for design mockups and community suggestions. Consider trade offs between creating a separate mobile UI vs. making the existing UI responsive, referencing any prior discussions or linked PRs.