How to translate graphical mock-ups into code?

Question

You have designed a beautiful and innovative application.
Now, what would be the general guidelines to achieve it in an efficiently and successfully way?!
I wonder if there is a methodology that could be applied to any programming language.

Answer 1

Doing my own research, I found the following:

Read about UML Diagrams!

They are divided into two categories:

(1) Behavioral Diagrams:
-------------------
* Use Case Diagram
* Activity Diagram
* State Machine Diagram
* Sequence Diagram
* Communication Diagram
* Interaction Overview Diagram
* Timing Diagram

(2) Structure Diagrams:
-------------------
* Class Diagram
* Component Diagram
* Deployment Diagram
* Object Diagram
* Package Diagram
* Profile Diagram
* Composite Structure Diagram

The most frequently used in Software Development are: Use Case diagrams, Class diagrams, and Sequence diagrams.

So, I think this is very helpful ! ! ! Explanation & Diagrams here:

Source: https://creately.com/blog/diagrams/uml-diagram-types-examples/

Answer 2

Splitting the every job.For example,summing,multiplying ,drawing ...
Create a common class. Summing,multiplying are math processes.Therefore class name is MathProc. As like.You must have variables.They are news getting and setting.Then make algorithm for all(events, variables, processes ...).The rest will come.I think.

Answer 3

Hello

Answer 4

hi